如何清除 Textfield 并在 Flutter 中的 OnChange 事件上将焦点返回到同一个 Textfield 控制器？

Question

我在 Flutter 应用程序中有一个 Textfield 控制器，我想清除该 Textfield 并在将该 Textfield 的值传递到该 Textfield 自己的 OnChange 事件后重新聚焦于其中。

实际上，在我的应用程序中，我想使用外部设备（即连接到我们的 Android 设备的 QR 码扫描仪）连续扫描 QR 码。然后我想将每个新扫描的值显示到一个标签，并在扫描新的二维码后再次更新该值。

任何人都可以帮助我在 Flutter 中实现它吗？

Answer 1

这非常简单，因为您只需在更改时将文本设置回空即可。

  TextEditingController _textEditingController = TextEditingController();

  TextField(
    controller: _textEditingController,
    onChanged: (value)=> _textEditingController.text = '',
  )

这是你想要的吗？如果这不是您想要的，请告诉我。

Answer 2

我实现了所需的功能，但我对这种方法不太满意，我希望以某种方式得到纠正。但你绝对能明白需要做什么。

var _currentFieldFocusNode = FocusNode();
var _textEditingController = TextEditingController();
TextFormField(
  focusNode: _currentFieldFocusNode,
  controller: _textEditingController,
  onFieldSubmitted: (newValue) async {
  setState(
    () {
      //do anything with new value
      _textEditingController.clear();
    },
  );
  await Future.delayed(
          Duration(milliseconds: 200))
      .then((value) => FocusScope.of(context)
          .requestFocus(
              _currentFieldFocusNode));
  },
),

Answer 3

我知道已经快四年了，但这是我使用的解决方案：

late FocusNode focusNode;
late TextEditingController textController;

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

  focusNode = FocusNode();
  textController = TextEditingController();
}

@override
void dispose() {
  // Clean up the focus node when the Form is disposed.
  focusNode.dispose();
  textController.dispose();

  super.dispose();
}

@override
Widget build(BuildContext context) {
  return TextField(
    controller: textController,
    focusNode: focusNode,
    onFieldSubmitted: (_) async {
      // do something with the text you've got
      setState(() {
        textController.clear();
      });
      FocusScope.of(context).requestFocus(focusNode);
    }
  );
}

这与 Junaid Rehmat 的答案非常相似，但异步调用会从屏幕上删除键盘，而此解决方案不会。

此外，如果您没有多个嵌套焦点范围，您可以简单地使用：

focusNode.requestFocus();