由于某种原因,我无法在导航后的下一页专注于文本字段。选择文本字段时,键盘将自动关闭。如果我在 TextField 上设置autofocus: true
,那么键盘将无限弹出并立即一遍又一遍地关闭。
当我的应用程序大小合理时,我遇到了这个问题,但我能够在最小的示例应用程序中重新创建它。
我正在使用带有 Flutter beta v0.3.2 的 Dart 2.0.0-dev.55.0。
主页代码:
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'),
),
],
),
),
);
}
}
下面是带有文本字段的页面的代码。
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,但不能专注于"设置"页面中的文本字段。我认为这与键盘不优先于弹出的页面有关?还是怎么回事?如何让应用程序只关注导航页面上的输入字段?
所以问题来自我向脚手架提供全局密钥的事实。删除密钥可以解决此问题。不确定为什么,但这个问题主要在这个 Github 问题中解释。
我在验证输入时显示错误消息时使用键弹出小吃栏,但现在我选择只在文本小部件中显示错误消息。
要解决此问题,请使用这样的代码。
// 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...',
)
)
就我而言,autofocus:true 不仅适用于 iOS 模拟器,而且适用于 Android 和 iOS 的真实设备。
全局键也有类似的问题。正在 flutter 的架构 redux 示例中查看类似示例。
像这样为我修复的钥匙
static final GlobalKey<FormFieldState<String>> _orderFormKey = GlobalKey<FormFieldState<String>>();
只需添加autofocus
作为true
,这将在导航到新屏幕时打开键盘
TextField(
autofocus: true,
),
我在文本字段中添加了焦点节点时也遇到了这个问题。删除焦点节点解决了我的问题。
不确定您的问题是什么,因为我无法再重现它了。我刚刚在 Flutter Channel beta、1.18.0-11.1.pre 中尝试了您的代码,一切都在不修改原始代码的情况下正常工作。
它看起来更像是Flutter的错误。