自定义Draggable Widget父组件下TextFormField仅双击唤起输入键盘需求

我刚好解决过类似的场景，要实现双击TextFormField才唤起键盘，核心就是拦截它的默认单击唤起焦点行为，然后手动在双击时触发焦点。结合你的Draggable父组件，具体实现方案如下：

关键思路 #

1. 用GestureDetector包裹TextFormField，通过设置behavior: HitTestBehavior.opaque优先拦截点击事件，阻止TextFormField响应默认的单击操作。
2. 监听GestureDetector的双击事件，手动给TextFormField的FocusNode请求焦点，唤起键盘。
3. 记得及时释放资源，避免内存泄漏。

完整代码示例 #

class DoubleTapEditableField extends StatefulWidget {
  const DoubleTapEditableField({super.key});

  @override
  State<DoubleTapEditableField> createState() => _DoubleTapEditableFieldState();
}

class _DoubleTapEditableFieldState extends State<DoubleTapEditableField> {
  // 用于控制TextFormField的焦点状态
  final FocusNode _fieldFocusNode = FocusNode();
  // 管理输入内容的控制器
  final TextEditingController _textController = TextEditingController();

  @override
  void dispose() {
    // 页面销毁时释放资源
    _fieldFocusNode.dispose();
    _textController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Draggable(
      // 这里替换成你自己的Draggable配置（比如feedback、childWhenDragging等）
      feedback: const Text("正在拖动"),
      childWhenDragging: const Text("拖动中..."),
      child: GestureDetector(
        // 确保GestureDetector优先处理点击事件，不让TextFormField响应单击
        behavior: HitTestBehavior.opaque,
        // 单击时不执行任何操作
        onTap: () {},
        // 双击时手动唤起焦点，弹出键盘
        onDoubleTap: () {
          _fieldFocusNode.requestFocus();
        },
        child: TextFormField(
          // 绑定焦点节点
          focusNode: _fieldFocusNode,
          controller: _textController,
          // 可选：如果不需要长按选中文本的功能，可以开启这个
          enableInteractiveSelection: false,
          decoration: const InputDecoration(
            border: OutlineInputBorder(),
            hintText: "双击我开始输入",
          ),
        ),
      ),
    );
  }
}

代码说明 #

• GestureDetector的behavior设置：HitTestBehavior.opaque会让GestureDetector占据整个点击区域，优先处理所有点击事件，这样TextFormField就不会接收到单击信号，也就不会默认弹出键盘了。
• 双击事件处理：在onDoubleTap回调中调用_fieldFocusNode.requestFocus()，手动触发TextFormField的焦点状态，系统就会自动弹出输入键盘。
• 资源释放：在State的dispose方法中释放FocusNode和TextEditingController，这是Flutter开发的最佳实践，避免内存泄漏。

如果你的Draggable有特殊的拖动触发逻辑（比如需要长按拖动），这个方案也不会和双击操作冲突，因为Draggable的长按识别和GestureDetector的双击识别是独立的，不会互相干扰。

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