Flutter：页面进入时自动将光标定位到指定TextField

方法一：直接使用autofocus属性 #

给需要自动聚焦的目标TextField添加autofocus: true参数即可，其他TextField不设置该属性，页面加载后光标会自动定位到目标输入框。
示例代码：

TextField(
  autofocus: true, // 仅为目标输入框设置此属性
  decoration: InputDecoration(
    hintText: '请输入内容'
  ),
)

方法二：通过FocusNode手动控制聚焦 #

如果需要更灵活的聚焦逻辑（比如延迟聚焦、根据业务条件触发），可以使用FocusNode实现：

1. 定义FocusNode实例：

final FocusNode _targetFocusNode = FocusNode();

2. 在页面初始化完成后请求焦点：

@override
void initState() {
  super.initState();
  // 确保页面渲染完成后再执行聚焦
  WidgetsBinding.instance.addPostFrameCallback((_) {
    FocusScope.of(context).requestFocus(_targetFocusNode);
  });
}

3. 将FocusNode绑定到目标TextField：

TextField(
  focusNode: _targetFocusNode,
  decoration: InputDecoration(
    hintText: '请输入内容'
  ),
)

4. 页面销毁时释放资源：

@override
void dispose() {
  _targetFocusNode.dispose();
  super.dispose();
}

场景选择 #

• 无需复杂逻辑时，优先使用autofocus属性，实现更简洁；
• 需要动态控制聚焦时机或条件时，选择FocusNode方案。

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