Question

我有一个TextFormField，当我点击它以输入文本时会重新加载当前屏幕。当我点击formfield时，在重新加载整个屏幕并再次呈现所有小部件之前，会短暂显示软件键盘。我正在Android设备上运行该应用。

Container(
        child: Form(
          key: _formKey,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              TextFormField(
                validator: (value) {
                  if (value.isEmpty) {
                    return 'Your input cannot be empty';
                  }
                },
              ),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 16.0),
                child: RaisedButton(
                  onPressed: () {

                    if (_formKey.currentState.validate()) {
                      print('validated');
                    }
                  },
                  child: Text('Save'),
                ),
              ),
            ],
          ),
        ),
        margin: EdgeInsets.only(top:8.0),
  ),

Answer 1

我有同样的问题。这是我的代码

class MainPage extends StatefulWidget {
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  Model model = Model();

  @override
  Widget build(BuildContext context) {
  GlobalKey<FormState> _formKey = GlobalKey<FormState>();
    var mediaWidth = MediaQuery.of(context).size.width / 2.0;
    return Scaffold(
...

，我通过在build方法之外声明_formKey来解决此问题。这对我有用。

class MainPage extends StatefulWidget {
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  Model model = Model();
  GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    var mediaWidth = MediaQuery.of(context).size.width / 2.0;
    return Scaffold(
...

希望它将对您有帮助

Answer 2

问题在于，当您单击该字段时，将重新构建TextFormField的控制器，这就是问题的原因。

为解决这个问题，您是否尝试过创建一个Statefull小部件，然后在此小部件的状态中创建一个TextEditingController并将其作为参数传递给TextFormField？

Answer 3

是的，这是因为出现键盘时，颤动支架会调整为当前可用的屏幕尺寸。因此，我们可以通过防止支架尺寸变化轻松地处理此问题。我建议将脚手架resizeToAvoidBottomInset属性设置为false。如果为真，则主体和脚手架的浮动小部件应自行调整大小，以避免屏幕键盘的高度由环境MediaQuery的MediaQueryData，viewInsets bottom属性定义。

解决方案：

resizeToAvoidBottomInset: false,

完整示例：

@override
Widget build(BuildContext context) {
  setDisplayData();
  return Scaffold(
    resizeToAvoidBottomInset: false,
    appBar: getAppBar(),
    body: OrientationBuilder(
      builder: (context, orientation) {
        return orientation == Orientation.portrait
            ? _buildVerticalLayout()
            : _buildHorizontalLayout();
      },
    ),
  );

Flutter TextFormField聚焦时会重新加载当前屏幕

3 个答案: