Flutter 3.27.1 macOS端TextField自动选中文本导致输入覆盖问题求助

问题场景 #

在macOS 15.3.1系统上使用Flutter 3.27.1开发桌面应用时，遇到TextField组件异常：首次输入文本后，再次输入时现有文本会被自动全选，导致后续输入直接覆盖原有内容而非追加。

复现步骤：

• 创建macOS平台Flutter桌面应用
• 添加TextFormField（或自定义封装的TextFieldWidget）组件
• 运行应用并在输入框中输入文本
• 再次输入时，现有文本被自动选中，新输入内容覆盖原有文本

涉及代码片段：

TextFieldWidget(
  controller: NotificationFormControllers.userSearchController,
  bgColor: appColor.pureWhiteAndBlack,
  doOnChanged: (text) {
    context.read<NotificationControlBloc>().add(UserSearch(
        query: text, userList: widget.data.userName.split(',').toList()));
  },
  hintText: 'Search User',
),

可能的解决方法 #

1. 排查Bloc逻辑中的文本重置 #

检查UserSearch事件处理逻辑，确认是否在处理搜索时意外重新设置了userSearchController的文本值。如果Bloc内部存在更新controller文本的操作，会导致输入框光标位置被重置，触发全选行为。确保仅在必要时更新文本，且更新时保留光标位置：

// 示例：更新文本时保留光标位置
final cursorPos = controller.selection.baseOffset;
controller.text = newText;
controller.selection = TextSelection.fromPosition(TextPosition(offset: cursorPos));

2. 手动控制焦点与光标位置 #

通过FocusNode监听输入框焦点状态，在获得焦点时强制将光标移动到文本末尾，避免全选：

// 在Widget的initState中初始化FocusNode
final FocusNode _searchFocusNode = FocusNode();

@override
void initState() {
  super.initState();
  _searchFocusNode.addListener(() {
    if (_searchFocusNode.hasFocus) {
      WidgetsBinding.instance.addPostFrameCallback((_) {
        final controller = NotificationFormControllers.userSearchController;
        // 将光标设置到文本末尾
        controller.selection = TextSelection.fromPosition(
          TextPosition(offset: controller.text.length),
        );
      });
    }
  });
}

// 将focusNode传入TextFieldWidget
TextFieldWidget(
  controller: NotificationFormControllers.userSearchController,
  focusNode: _searchFocusNode,
  bgColor: appColor.pureWhiteAndBlack,
  doOnChanged: (text) {
    context.read<NotificationControlBloc>().add(UserSearch(
        query: text, userList: widget.data.userName.split(',').toList()));
  },
  hintText: 'Search User',
),

3. 升级Flutter版本 #

Flutter 3.27.1在macOS平台的TextField组件可能存在已知的焦点/选择行为bug。尝试升级到最新稳定版（如3.30.x及以上），官方后续版本可能已修复该问题。

4. 优化onChanged事件触发频率 #

如果onChanged中触发的Bloc事件导致Widget频繁重建，也可能引发输入框焦点异常。可以使用防抖（debounce）来减少事件触发次数，避免不必要的UI重建：

// 使用dart:async的Timer实现防抖
Timer? _debounceTimer;

void _onSearchTextChanged(String text) {
  _debounceTimer?.cancel();
  _debounceTimer = Timer(const Duration(milliseconds: 300), () {
    context.read<NotificationControlBloc>().add(UserSearch(
        query: text, userList: widget.data.userName.split(',').toList()));
  });
}

// 在TextFieldWidget的doOnChanged中调用该方法
TextFieldWidget(
  // ...其他参数
  doOnChanged: _onSearchTextChanged,
),

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