Im-Kevin / cool_ui

用flutter实现一些我认为好看的UI控件,有Popover,仿Weui的Toast,自定义键盘
Apache License 2.0
460 stars 74 forks source link

自定义键盘好像自身没有高度 #83

Closed 309791679 closed 1 year ago

309791679 commented 2 years ago

showModalBottomSheet( isScrollControlled: true, builder: (BuildContext context) { //构建弹框中的内容 return Container( margin: EdgeInsets.only(bottom:MediaQuery.of(context).viewInsets.bottom), //这个段代码,实现这个底部跟随 width: 300.r, height: 220.r, decoration: BoxDecoration( borderRadius: BorderRadius.only(topLeft: Radius.circular(10.r),topRight: Radius.circular(10.r)), //color: Color.fromRGBO(249, 249, 249, 1) color: Colors.white ), //现在是正常的键盘可以让showModalBottomSheet容器底部跟随键盘高度,但是自定义键盘就不行,我的测试是它没有高度

309791679 commented 2 years ago

我的代码 class NumberKeyboar extends StatelessWidget{ static const CKTextInputType inputType1 = const CKTextInputType(name:'CKNumberKeyboard'); static double getHeight(BuildContext ctx){ MediaQueryData mediaQuery = MediaQuery.of(ctx); return 365.r; //355.r //return mediaQuery.size.width / 3 / 2 * 2; } final KeyboardController? controller ; const NumberKeyboar({this.controller});

static register(){ CoolKeyboard.addKeyboard(NumberKeyboar.inputType1,KeyboardConfig(builder: (context,controller, params){ return NumberKeyboar(controller: controller); },getHeight: NumberKeyboar.getHeight)); }

@override Widget build(BuildContext context) { MediaQueryData mediaQuery = MediaQuery.of(context); return Container( width: 414.r, height: 365.r,

  //padding: EdgeInsets.only(top:21.5.r),
  alignment: Alignment.center,
  decoration: BoxDecoration(
    borderRadius: BorderRadius.only(topLeft: Radius.circular(20.r),topRight: Radius.circular(20.r)),
    color: Colors.white,
    boxShadow: [
      BoxShadow(
        color: Colors.black.withOpacity(0.06),
        spreadRadius: 3.r,
        blurRadius: 2,
        offset: Offset(1, 0),
      ),
    ],

  ),

  child: Stack(
    children: [
      Positioned(
        bottom: 0,
        child: 
      ),
    ],

  ),
);

}

Widget buildButton(String title,{required String value}){ return Container( color: Colors.white, child: GestureDetector( behavior: HitTestBehavior.translucent, child: Center(child: Text(title),), onTap: (){ controller?.addText(value); }, ), ); } }

Im-Kevin commented 2 years ago

image 这个没有加

309791679 commented 2 years ago

image 这个没有加

是的,官方例子是Navigator跳转后才能在输入框有焦点是滚动,直接调用输入框获取焦点时并不会滚动而是在输入时激活滚动,按照我的写法就没有这个问题了

`void main() async { NumberKeyboar.register(); runMockApp(KeyboardRootWidget(child: MyApp())); // 新的 await ScreenUtil.ensureScreenSize(); }

class MyApp extends StatelessWidget { MyApp() { }

@override Widget build(BuildContext context) { return MaterialApp( localizationsDelegates: const [ GlobalMaterialLocalizations.delegate, // 指定本地化的字符串 GlobalCupertinoLocalizations.delegate, // 对应的Cupertino风格 GlobalWidgetsLocalizations.delegate // 指定默认的文本排列方向, 由左到右或由右到左 ], supportedLocales: [Locale("en"), Locale("zh")], debugShowCheckedModeBanner: false, onGenerateRoute: BaseRouter.getRouter().generator, builder: (ctx, child) { ScreenUtil.init(ctx,designSize:Size(414,736)); return Theme( data: ThemeData(), child: Navigator( onGenerateRoute: (_) => MaterialPageRoute( builder: (ctx) => LoginPage(), ), ), ); }, ); } } `

309791679 commented 2 years ago

LoginPage 这边的结构

`Widget build(BuildContext context) {

return KeyboardMediaQuery( child: Scaffold()) }`

309791679 commented 2 years ago

image

309791679 commented 2 years ago

返回直接退出 使用这个

home: Builder(builder: (BuildContext context) { ScreenUtil.init(context,designSize:Size(414,690)); return LoginPage(); },),

Im-Kevin commented 2 years ago

不是很理解你在说什么,有点散

309791679 commented 2 years ago

不是很理解你在说什么,有点散

大概就是,获取不到输入法的高度

Im-Kevin commented 2 years ago

你是用什么东西获取高度,因为自定义键盘的高度处理方式与原生键盘的方式有些不同