Flutter搜索栏实现单击显预设项、双击唤软键盘问题求助

核心思路是通过手动控制焦点、拦截手势事件，拆分单击和双击的不同行为：

• 禁用默认自动唤起键盘：关闭搜索栏的自动获焦属性，用FocusNode手动管理输入框焦点状态
• 拦截手势优先级：让外层手势检测器优先处理单击/双击，避免和搜索栏自带手势冲突
• 分场景处理逻辑：单击仅打开面板显示预设列表，双击则打开面板并唤起键盘

完整代码实现 #

Widget searchBar() {
  final FloatingSearchBarController searchBarController = FloatingSearchBarController();
  final FocusNode _searchFocusNode = FocusNode();

  return GestureDetector(
    behavior: HitTestBehavior.opaque, // 优先处理外层手势，避免和搜索栏自带手势冲突
    onTap: () {
      // 单击逻辑：打开面板但不唤起键盘
      if (!searchBarController.isOpen) {
        searchBarController.open();
      }
      // 延迟取消焦点，抵消面板打开时的自动获焦尝试
      Future.delayed(const Duration(milliseconds: 100), () {
        _searchFocusNode.unfocus();
      });
    },
    onDoubleTap: () {
      // 双击逻辑：打开面板并唤起键盘
      if (!searchBarController.isOpen) {
        searchBarController.open();
      }
      _searchFocusNode.requestFocus();
    },
    child: FloatingSearchBar(
      controller: searchBarController,
      focusNode: _searchFocusNode,
      autoFocus: false, // 关闭默认自动获焦，阻止默认唤起键盘
      hint: "search",
      openAxisAlignment: 0.0,
      width: 600,
      axisAlignment: 0.0,
      scrollPadding: const EdgeInsets.only(top: 16, bottom: 20),
      elevation: 4.0,
      onQueryChanged: (query) {},
      builder: (BuildContext context, Animation<double> transition) {
        return ClipRRect(
          child: Material(
            color: Colors.white,
            child: Container(
              color: Colors.white,
              child: Column(
                children: [
                  ListTile(
                    title: const Text('Item 1'),
                    onTap: () => searchBarController.close(),
                  ),
                  ListTile(
                    title: const Text('Item 2'),
                    onTap: () => searchBarController.close(),
                  ),
                  ListTile(
                    title: const Text('Item 3'),
                    onTap: () => searchBarController.close(),
                  ),
                ],
              ),
            ),
          ),
        );
      },
    ),
  );
}

关键细节说明 #

1. FocusNode的作用：完全掌控输入框的焦点状态，requestFocus()主动唤起键盘，unfocus()阻止键盘弹出
2. HitTestBehavior.opaque：确保手势检测器优先捕获点击事件，避免搜索栏自带的点击逻辑触发默认获焦
3. 延迟取消焦点：搜索栏打开时可能会内部触发一次获焦，延迟100ms取消焦点可以确保面板正常显示但键盘不弹出

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