Flutter TextFormField失去焦点时如何触发onSubmitted或onEditingComplete

实现方案 #

你可以通过以下两种方案实现失焦触发提交逻辑的需求，两种方案都不会触发频繁的Firestore请求，仅在输入结束失焦时执行一次提交：

方案1：为TextFormField绑定FocusNode监听焦点变化

适合字段数量较少的场景，逻辑更独立：

1. 为每个输入框创建单独的FocusNode，在初始化时监听焦点状态
2. 监听到失焦事件时，执行你的提交逻辑即可
   示例代码：

class _YourPageState extends State<YourPage> {
  late final FocusNode numFieldFocusNode;
  final TextEditingController numController = TextEditingController();

  @override
  void initState() {
    super.initState();
    numFieldFocusNode = FocusNode();
    // 监听焦点变化
    numFieldFocusNode.addListener(() {
      // 仅在失焦时触发提交
      if (!numFieldFocusNode.hasFocus) {
        // 这里替换为你原本要写在onSubmitted/onEditingComplete里的逻辑
        uploadToFirestore(numController.text);
      }
    });
  }

  @override
  void dispose() {
    numFieldFocusNode.dispose();
    numController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return TextFormField(
      focusNode: numFieldFocusNode,
      controller: numController,
      keyboardType: TextInputType.number,
      // 原有onSubmitted可以保留，兼容有回车按键的设备场景
      onSubmitted: uploadToFirestore,
    );
  }
}

方案2：修改现有全局关闭键盘的逻辑，统一触发提交

适合页面内有大量输入框，不想逐个绑定FocusNode的场景：
直接在你现有的GestureDetector的失焦逻辑前，先获取当前持有焦点的输入框，主动调用它的onSubmitted/onEditingComplete回调即可，修改后的代码如下：

return GestureDetector(
  onTap: (){
    final currentFocus = FocusScope.of(context);
    if (!currentFocus.hasPrimaryFocus && currentFocus.focusedChild != null) {
      // 获取当前持有焦点的输入框组件
      final focusedWidget = currentFocus.focusedChild?.context?.widget;
      if (focusedWidget is TextFormField) {
        // 主动触发提交回调
        focusedWidget.onSubmitted?.call(focusedWidget.controller?.text ?? '');
        // 如果要触发onEditingComplete就换下面这行
        // focusedWidget.onEditingComplete?.call();
      }
      // 再执行失焦关闭键盘
      currentFocus.unfocus();
    }
  },
  child: // 你的原有页面布局内容
);

补充说明 #

如果想让数字键盘自带确认键，也可以将键盘类型修改为TextInputType.numberWithOptions(signed: true, decimal: true)，部分系统会弹出带完成/回车按键的数字键盘，但该实现不同平台表现不一致，还是配合失焦监听兼容性更好。

内容的提问来源于stack exchange，提问作者LazyTurtle