一、问题来源
Flutter开发过程中安卓系统遇到当普通键盘输入用户账号之后,在密码框输入密文时会出现普通键盘先消失,安全键盘再弹出的过程,两种键盘切换的过程会失去焦点,简称键盘失焦。
二、解决办法
就是用 Listener 监听动作,普通键盘和安全键盘切换之后再次请求焦点即可,代码如下:
dart
/// 账号焦点
final focusNodeAccount = FocusNode();
/// 密码焦点
final focusNodePwd = FocusNode();
dart
...
Listener(
onPointerDown: (event) async {
await Future.delayed(const Duration(milliseconds: 350));
focusNodeAccount.requestFocus();
SystemChannels.textInput.invokeMethod('TextInput.show');//兼容小米手机
},
child: TextField(
focusNode: focusNodeAccount,
decoration: InputDecoration(
border: buildBorder(),
focusedBorder: buildBorder(),
hintText: "账号",
hintStyle: TextStyle(fontSize: 15, color: Color(0xffB3B3B3)),
fillColor: Colors.white,
filled: true,
),
),
),
const SizedBox(height: 8),
Listener(
onPointerDown: (event) async {
await Future.delayed(const Duration(milliseconds: 350));
focusNodePwd.requestFocus();
SystemChannels.textInput.invokeMethod('TextInput.show');//兼容小米手机
},
child: TextField(
focusNode: focusNodePwd,
decoration: InputDecoration(
border: buildBorder(),
focusedBorder: buildBorder(),
hintText: "密码",
hintStyle: TextStyle(fontSize: 15, color: Color(0xffB3B3B3)),
fillColor: Colors.white,
filled: true,
),
obscureText: true,
),
),
三、总结
1、思路是通过在键盘切换通过 FocusNode 请求再次获取焦点;
2、为什么要执行这行代码?
dart
await Future.delayed(const Duration(milliseconds: 350));
是为了等安全键盘完全弹出(动画结束之后)再获取焦点。如果没有此行代码,部分华为机型会先获取到焦点然后二次丢失(测试同学在此阻击过本人,真机直面)。