摆脱 android 上虚拟键盘上的填充(抖动)
Get rid of padding on virtual keyboard on android (flutter)
当我在我的虚拟 android 设备上拉起虚拟键盘时,它看起来如下:
如您所见,键盘底部有大量黑色填充。我不知道如何摆脱这个。
我已经尝试过 resizeToAvoidBottomPadding: false,
,它会在 未显示 键盘时删除屏幕底部的填充,但在显示时无济于事.非常感谢任何输入!
代码:
Scaffold(
backgroundColor:const Color(0xffFFF6E0),
resizeToAvoidBottomPadding: false,
child:GestureDetector(
onTap: () {
FocusScope.of(context).unfocus();
},
child:Container(
child: Stack(
overflow: Overflow.clip,
children: <Widget>[
AnimatedPositioned(
duration: Duration(milliseconds: 400),
top:5,
bottom: (mode == 1)?MediaQuery.of(context).size.height*.18:MediaQuery.of(context).size.height,
left:5,
right:5,
child:Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Theme.of(context).colorScheme.primary,
),
child: Column(
children: <Widget>[
SizedBox(
height: 20,
),
Text(
"Welcome Back!",
style: Theme.of(context).textTheme.display3.copyWith(fontSize: 44),
),
Container(
margin: EdgeInsets.only(left:20,right:20,top:20),
//padding: EdgeInsets.only(right:20,left:20,),
padding: EdgeInsets.only(right:20,left:20,),
decoration: new BoxDecoration(
borderRadius: BorderRadius.circular(20),
color:Theme.of(context).primaryColor,
),
//child:
child:new TextField(
decoration: InputDecoration(
hintText: 'email',
border: InputBorder.none
),
)
),
Container(
margin: EdgeInsets.only(left:20,right:20,top:20),
//padding: EdgeInsets.only(right:20,left:20,),
padding: EdgeInsets.only(right:20,left:20,),
decoration: new BoxDecoration(
borderRadius: BorderRadius.circular(20),
color:Theme.of(context).primaryColor,
),
//child:
child:new TextField(
decoration: InputDecoration(
hintText: 'email',
border: InputBorder.none
),
)
),
Container(
margin: EdgeInsets.only(left:20,right:20,top:20),
//padding: EdgeInsets.only(right:20,left:20,),
padding: EdgeInsets.only(right:20,left:20,),
decoration: new BoxDecoration(
borderRadius: BorderRadius.circular(20),
color:Theme.of(context).primaryColor,
),
//child:
child:new TextField(
decoration: InputDecoration(
hintText: 'email',
border: InputBorder.none
),
)
)
],
),
)
),
Positioned(
bottom:0,
left:0,
right:0,
child:
Align(
alignment: Alignment.bottomCenter,
child: RaisedButton(
color: const Color(0xff251605),
elevation: 4,
textColor: const Color(0xffFFF6E0),
//padding: EdgeInsets.fromLTRB(15, 15, 15, 15),
child:
SizedBox(
width: 200,
height: 35,
child:
Text("Back",style:TextStyle(color:const Color(0xffFFF6E0),fontSize: 24,fontWeight:FontWeight.normal),textAlign: TextAlign.center,),
),
onPressed: (){
},
padding: const EdgeInsets.all(15.0),
shape: RoundedRectangleBorder(borderRadius: new BorderRadius.circular(40.0))
),
)
)
]
)
)
)
在您的 build 方法中,在返回之前添加此
SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
当我在我的虚拟 android 设备上拉起虚拟键盘时,它看起来如下:
如您所见,键盘底部有大量黑色填充。我不知道如何摆脱这个。
我已经尝试过 resizeToAvoidBottomPadding: false,
,它会在 未显示 键盘时删除屏幕底部的填充,但在显示时无济于事.非常感谢任何输入!
代码:
Scaffold(
backgroundColor:const Color(0xffFFF6E0),
resizeToAvoidBottomPadding: false,
child:GestureDetector(
onTap: () {
FocusScope.of(context).unfocus();
},
child:Container(
child: Stack(
overflow: Overflow.clip,
children: <Widget>[
AnimatedPositioned(
duration: Duration(milliseconds: 400),
top:5,
bottom: (mode == 1)?MediaQuery.of(context).size.height*.18:MediaQuery.of(context).size.height,
left:5,
right:5,
child:Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Theme.of(context).colorScheme.primary,
),
child: Column(
children: <Widget>[
SizedBox(
height: 20,
),
Text(
"Welcome Back!",
style: Theme.of(context).textTheme.display3.copyWith(fontSize: 44),
),
Container(
margin: EdgeInsets.only(left:20,right:20,top:20),
//padding: EdgeInsets.only(right:20,left:20,),
padding: EdgeInsets.only(right:20,left:20,),
decoration: new BoxDecoration(
borderRadius: BorderRadius.circular(20),
color:Theme.of(context).primaryColor,
),
//child:
child:new TextField(
decoration: InputDecoration(
hintText: 'email',
border: InputBorder.none
),
)
),
Container(
margin: EdgeInsets.only(left:20,right:20,top:20),
//padding: EdgeInsets.only(right:20,left:20,),
padding: EdgeInsets.only(right:20,left:20,),
decoration: new BoxDecoration(
borderRadius: BorderRadius.circular(20),
color:Theme.of(context).primaryColor,
),
//child:
child:new TextField(
decoration: InputDecoration(
hintText: 'email',
border: InputBorder.none
),
)
),
Container(
margin: EdgeInsets.only(left:20,right:20,top:20),
//padding: EdgeInsets.only(right:20,left:20,),
padding: EdgeInsets.only(right:20,left:20,),
decoration: new BoxDecoration(
borderRadius: BorderRadius.circular(20),
color:Theme.of(context).primaryColor,
),
//child:
child:new TextField(
decoration: InputDecoration(
hintText: 'email',
border: InputBorder.none
),
)
)
],
),
)
),
Positioned(
bottom:0,
left:0,
right:0,
child:
Align(
alignment: Alignment.bottomCenter,
child: RaisedButton(
color: const Color(0xff251605),
elevation: 4,
textColor: const Color(0xffFFF6E0),
//padding: EdgeInsets.fromLTRB(15, 15, 15, 15),
child:
SizedBox(
width: 200,
height: 35,
child:
Text("Back",style:TextStyle(color:const Color(0xffFFF6E0),fontSize: 24,fontWeight:FontWeight.normal),textAlign: TextAlign.center,),
),
onPressed: (){
},
padding: const EdgeInsets.all(15.0),
shape: RoundedRectangleBorder(borderRadius: new BorderRadius.circular(40.0))
),
)
)
]
)
)
)
在您的 build 方法中,在返回之前添加此
SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);