13

出于某种原因，导航后我无法在下一页上关注 TextField。选择 TextField 时，键盘会自动关闭。如果我autofocus: true在 TextField 上设置，那么键盘将无限弹出并立即一遍又一遍地关闭。

当我的应用程序大小合理时，我遇到了这个问题，但我能够在一个最小的示例应用程序中重新创建它。

我将 Dart 2.0.0-dev.55.0 与 Flutter beta v0.3.2 一起使用。

主页代码：

import 'package:flutter/material.dart';
import 'settings.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('Helpful text.',),
            // ===== Where navigation happens =====
            RaisedButton(
              onPressed: () {
                Navigator.push(context, PageRouteBuilder(
                  pageBuilder: (_, __, ___) => SettingsPage()));
              },
              child: Text('Go to input page'),
            ),
          ],
        ),
      ),
    );
  }
}

这是带有 TextField 的页面的代码。

import 'package:flutter/material.dart';

class SettingsPage extends StatefulWidget {
  SettingsPage({Key key}) :
   super(key: key);

  @override
  _SettingsPage createState() => new _SettingsPage();
}


class _SettingsPage extends State<SettingsPage> {

  @override
  Widget build(BuildContext context) {
    final key = GlobalKey<ScaffoldState>();
    return Scaffold(
      key: key,
      backgroundColor: Colors.white,
      appBar: AppBar(
        title: Text("Settings"),
      ),
      body: ListView(
        children: <Widget>[
          Text("Enter something"),
          // Can't focus on this widget
          TextField(),
        ],
      ),
    );
  }
}

如果我在主页上放一个 TextField，我可以很好地专注于 TextField，但不能在“设置”页面中的那个上。我认为这与键盘没有优先于弹出页面有关吗？或者发生了什么？如何让应用程序只关注导航页面上的输入字段？

4

7 回答 7

9

所以问题出在我将 GlobalKey 提供给 Scaffold 的事实。删除密钥解决了这个问题。不完全确定为什么，但这个问题主要在这个Github 问题中解释。

在验证输入时显示错误消息时，我使用该键弹出小吃栏，但现在我选择仅在 Text 小部件中显示错误消息。

于 2018-05-25T20:09:01.773 回答
2

全局密钥也有类似的问题。在flutter的架构redux示例中查看了一个类似的示例。

使用像这样为我修复的钥匙

static final GlobalKey<FormFieldState<String>> _orderFormKey = GlobalKey<FormFieldState<String>>();
于 2018-06-25T21:28:37.047 回答
2

为了解决这个问题，使用这样的代码。

// Class private property
static final GlobalKey<FormFieldState<String>> _searchFormKey = GlobalKey<FormFieldState<String>>()

// Inside widget
TextFormField(
  key: _searchFormKey, // Use searchFormKey here like this
  decoration: InputDecoration(
    border: OutlineInputBorder(),
    labelText: 'Type here...',
  )
)
于 2019-11-07T11:07:09.623 回答
1

只需添加autofocusas true，这将在导航到新屏幕时打开键盘

 TextField(
            autofocus: true,
          ),
于 2020-07-03T06:48:07.003 回答
0

我也遇到了添加到文本字段的焦点节点的问题。删除焦点节点解决了我的问题。

于 2018-07-03T16:58:22.480 回答
0

不确定您的问题是什么，因为我无法再重现它。我刚刚在 Flutter Channel beta 1.18.0-11.1.pre 中尝试了您的代码，并且一切正常，无需修改您的原始代码。

它看起来更像是 Flutter 的 bug。

于 2020-05-30T18:21:51.623 回答
0

就我而言， autofocus:true 不仅适用于 iOS 模拟器，而且适用于 Android 和 iOS 的真实设备

于 2021-05-21T23:20:10.777 回答