CurvedNavigationBar页面中TextField弹出键盘后立即收起且组件重建丢失焦点的问题求助

看起来你遇到的键盘弹出后立刻收起、伴随组件重建丢失焦点的问题，用resizeToAvoidBottomInset: false没解决，我来帮你分析根源并给出针对性的解决方案：

问题根源分析 #

从你的代码里能定位到几个核心问题：

1. 全局导航索引index：你把int index = 0;定义在了_HomePageState外部作为全局变量，这会导致状态脱离State类的管控——当键盘弹出触发布局重建时，全局变量的状态可能和UI不同步，引发不必要的页面重建或索引混乱，直接导致TextField焦点丢失。
2. 嵌套Scaffold：MyPage内部又嵌套了一层Scaffold，但HomePage已经是完整的Scaffold容器。嵌套Scaffold会打乱Flutter的布局层级计算，尤其是键盘弹出时的布局适配逻辑，这是键盘弹出后立刻收起的关键诱因之一。
3. 未初始化的输入控制器：MyPage中使用的_msgText控制器没有看到初始化代码，TextField必须绑定已初始化的控制器才能正常管理焦点和输入状态，未初始化会引发焦点异常。
4. 重复设置resizeToAvoidBottomInset：在HomePage和MyPage同时设置该属性，会引发布局计算冲突，进一步干扰键盘行为。

解决方案及修改代码 #

1. 修复导航索引的状态管理

把全局变量index移到_HomePageState内部作为成员变量，由State类维护状态：

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  // 将index改为State内部成员变量，由State管控状态
  int index = 0;
  final List<Widget> _screens = [
    MyPage(), 
    // 其他页面
  ];

  @override
  Widget build(BuildContext context) {
    final themeProvider = Provider.of<ThemeProvider>(context);
    return Scaffold(
      // 先恢复为true，强制false会引发更多布局适配问题
      resizeToAvoidBottomInset: true,
      body: IndexedStack(
        index: index,
        children: _screens,
      ),
      bottomNavigationBar: CurvedNavigationBar(
        height: mq.height * 0.07,
        backgroundColor: themeProvider.themeData.canvasColor,
        color: themeProvider.themeData.cardColor,
        animationCurve: Curves.fastLinearToSlowEaseIn,
        index: index,
        items: _items, // 确保_items已正确定义
        onTap: (newIndex) => setState(() => index = newIndex),
      ),
    );
  }
}

2. 移除嵌套Scaffold并初始化输入控制器

修改MyPage，去掉内部的Scaffold，同时初始化TextEditingController：

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

  @override
  State<MyPage> createState() => _MyPageState();
}

class _MyPageState extends State<MyPage> {
  // 初始化TextEditingController，管理输入和焦点
  final TextEditingController _msgText = TextEditingController();
  // 可选：手动管理焦点（若需要更精细的焦点控制）
  final FocusNode _focusNode = FocusNode();

  @override
  void dispose() {
    // 页面销毁时释放资源，避免内存泄漏
    _msgText.dispose();
    _focusNode.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // 移除嵌套的Scaffold，直接返回页面内容
    return SingleChildScrollView( // 套滚动组件，适配键盘弹出时的布局
      child: Column(
        children: [
          Padding(
            padding: EdgeInsets.symmetric(
              horizontal: mq.width * 0.05,
              vertical: mq.height * 0.02,
            ),
            child: TextFormField(
              controller: _msgText,
              focusNode: _focusNode,
              style: const TextStyle(color: Colors.black87),
              decoration: InputDecoration(
                filled: true,
                fillColor: const Color(0xFFF1E7D6),
                hintText: 'Write a message',
                contentPadding: const EdgeInsets.symmetric(
                  horizontal: 10,
                  vertical: 12,
                ),
                hintStyle: TextStyle(
                  color: Colors.black54,
                  fontSize: regulartextsize - 1,
                ),
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(12),
                ),
              ),
              maxLines: null,
              keyboardType: TextInputType.multiline,
              textCapitalization: TextCapitalization.sentences,
              validator: (value) {
                if (value == null || value.trim().isEmpty) {
                  return 'Message cannot be empty';
                }
                return null;
              },
            ),
          ),
        ],
      ),
    );
  }
}

为什么这些修改能解决问题？ #

• 全局变量转成员变量：确保导航索引的状态完全由_HomePageState控制，布局重建时状态不会混乱，避免不必要的页面切换导致焦点丢失。
• 移除嵌套Scaffold：Flutter不建议嵌套Scaffold，这会干扰系统对布局层级的计算（尤其是键盘弹出时的适配逻辑），移除后键盘的弹出/收起行为会恢复正常。
• 初始化控制器与焦点节点：TextField必须绑定已初始化的控制器才能正常管理输入和焦点，手动添加FocusNode还能实现更精细的焦点控制（比如主动请求/释放焦点）。
• 添加滚动组件：恢复resizeToAvoidBottomInset: true后，用SingleChildScrollView包裹内容，既能避免键盘覆盖输入框，又不会破坏布局逻辑。

如果修改后仍有问题，可以尝试在initState中手动请求焦点（若需要）：

@override
void initState() {
  super.initState();
  // 延迟请求焦点，避免布局未完成时触发
  WidgetsBinding.instance.addPostFrameCallback((_) {
    _focusNode.requestFocus();
  });
}

内容来源于stack exchange