Flutter：如何将焦点转移到下一个 TextFormField？

Question

我是 Flutter 新手，想在当前 TextFormField 达到 maxLength 时从一个 TextFormField 移动到另一个，而无需按 enter。这意味着我可以在小时 TextFormField 上输入 2 位数字，重点 TextFormField 将移动到分钟 TextFormField 等等。

我试过使用 nextFocus()，但是这只有在按下 enter 时才有效。

小时输入的示例小部件：

Widget _buildHH(){
    return Theme(
      data: Theme.of(context).copyWith(primaryColor: Colors.orange),
      child: Expanded(
        child:
        TextFormField(
          maxLength: 2,
          cursorColor: Colors.orange,
          style: TextStyle(color: Colors.orange),
          decoration: InputDecoration(
              border: OutlineInputBorder(),
              labelText: 'HH'
          ),
          onEditingComplete: () => FocusScope.of(context).nextFocus(),
          keyboardType: TextInputType.number,
          validator: (String value){
            return null;
          },
          onSaved: (String value){
            _HH = value;
          },
        ),
      )
    );
  }

Answer 1

给你所有的TextFormField一个FocusNode和一个TextEditingController

  TextEditingController fooController = TextEditingController();
  TextEditingController bahController = TextEditingController();

  FocusNode fooFocusNode;
  FocusNode bahFocusNode;

 @override
  void initState() {
    super.initState();

    fooFocusNode = FocusNode();
    bahFocusNode = FocusNode();
  }

@override
  void dispose() {

    fooFocusNode.dispose();
    bagFocusNode.dispose();
    fooController.dispose();
    bahController.dispose();
    super.dispose();
  }

将 Controller 和 FocusNode 分配给您的 TextFormField

在您的 TextFormField 中监听 onChanged 这将 return 您的控制器具有的当前值。从这里您可以做一个简单的检查，看看您的参数是否得到满足。

onChanged: (value) {

  if (value.length >= 2) {
    fooFocusNode.unfocus();
    FocusScope.of(context).requestFocus(bahFocusNode);
  }
},

Answer 2

final node = FocusScope.of(context);

在构建方法下初始化这个变量

onChanged: (value) {
                   if (value.length == 2) node.nextFocus();
                     },

将此 onChanged 方法添加到您的 TextFormField，如果textfield中的文本长度等于2，它会自动转移焦点。

Flutter：如何将焦点转移到下一个 TextFormField？

Flutter: How to shift focus to next TextFormField?

flutter

textformfield