[英]Rebuild whole widget tree when a keyboard appears
How to resolve re-render the whole widget tree when keyboard appears in flutter?当键盘出现在 flutter 中时,如何解决重新渲染整个小部件树的问题? In my app, whenever keyboard appears and disappears, the whole widget tree will be re build?
在我的应用程序中,每当键盘出现和消失时,整个小部件树都会重新构建? What is the solution to avoid this?
避免这种情况的解决方案是什么?
There are multiple ways to handle this, here are some solutions I've used in the past.有多种方法可以解决这个问题,这里有一些我过去使用过的解决方案。
resizeToAvoidBottomInset
parameter resizeToAvoidBottomInset
参数Set this to false
and your screen will not resize, the downside of this is that the keyboard will appear on top of your UI将此设置为
false
并且您的屏幕不会调整大小,这样做的缺点是键盘将出现在您的 UI 顶部
Example:例子:
class SampleScreen extends StatelessWidget {
const SampleScreen({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
body: Align(
alignment: Alignment.bottomCenter,
child: SafeArea(
minimum: const EdgeInsets.all(20),
child: TextField(
decoration: new InputDecoration(
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 1.0),
),
hintText: 'Mobile Number',
),
),
),
),
);
}
}
By placing your whole body inside a ScrollView you may now have a lengthy form, only caveat here is that you will not be able to use Spacer
and Expanded
widgets通过将你的整个身体放在一个 ScrollView 中,你现在可能有一个冗长的表单,这里唯一需要注意的是你将无法使用
Spacer
和Expanded
小部件
Example例子
class SampleScreen extends StatelessWidget {
const SampleScreen({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
minimum: const EdgeInsets.all(20),
child: SingleChildScrollView(
child: Column(children: [
Container(
padding: EdgeInsets.all(20),
margin: EdgeInsets.all(10),
color: Colors.red,
height: MediaQuery.of(context).size.height - 165,
),
TextField(
decoration: new InputDecoration(
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.black, width: 1.0),
),
hintText: 'Mobile Number',
),
),
]),
),
),
);
}
}
Use a stateful widget and save your app's current data somewhere.使用有状态小部件并将应用的当前数据保存在某处。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.