VS Code运行Flutter时TextFormField致iOS/Android异常，Xcode正常如何修复？

问题现象 #

• iOS端点击后键盘冻结，应用卡顿或崩溃
• Android端无法在TextFormField中输入内容
• 直接用Xcode运行代码时功能正常

排查方向与修复建议 #

1. 布局问题定位与修复 #

从代码来看，TextFormField嵌套在AnimatedContainer及Positioned组件中，不合理的布局参数可能导致焦点冲突或渲染异常：

• 移除Positioned的top: -30，避免容器偏移出可交互区域
• 动态计算AnimatedContainer的宽度（替换固定的100.w），防止宽度溢出屏幕
• 去掉TextFormField的autofocus: true，避免初始焦点与动画容器的渲染逻辑冲突
• 修正TextStyle的无效属性decorationColor，改为color控制文本颜色

修改后的核心代码片段：

Positioned(
  top: 0,
  left: 135,
  child: AnimatedContainer(
    color: const Color.fromARGB(255, 62, 84, 122),
    duration: const Duration(milliseconds: 800),
    curve: Curves.bounceInOut,
    height: 20.h,
    width: MediaQuery.of(context).size.width - 135,
    margin: const EdgeInsets.only(top: 30),
    child: Column(
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: const [
            IconButton(icon: Icon(Icons.skip_previous), onPressed: null),
          ],
        ),
        Center(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: TextFormField(
              onChanged: (value) => setState(() {}),
              controller: textFieldController,
              maxLines: 2,
              style: const TextStyle(color: Colors.black),
              decoration: const InputDecoration(
                  filled: true,
                  fillColor: Colors.white,
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(4.0)))),
            ),
          ),
        ),
      ],
    ),
  ),
)

2. Flutter环境问题修复 #

从flutter doctor结果中存在两个关键警告，需优先修复：

• Dart路径冲突：执行以下命令调整PATH顺序，确保使用Flutter自带的Dart版本：

  export PATH="/Users/pannam/Documents/flutter/bin:$PATH"
  

  可将该命令添加到~/.bash_profile或~/.zshrc中实现永久生效
• Android Studio缺失捆绑Java：重新安装Android Studio，或在Android Studio设置中手动指定Java SDK路径

3. 额外优化建议 #

• 避免在onChanged中频繁调用setState，若无需实时刷新整个页面，可仅更新必要状态
• 确保textFieldController在生命周期内正确初始化与释放：

  late TextEditingController textFieldController;
  
  @override
  void initState() {
    super.initState();
    textFieldController = TextEditingController();
  }
  
  @override
  void dispose() {
    textFieldController.dispose();
    super.dispose();
  }
  

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