Flutter开发邮箱输入组件时遇Bottom Overflowed by infinity pixels错误求解决

你的代码出现底部溢出的核心原因是Container和SizedBox设置的space_8值异常（大概率是无穷大或远超屏幕高度的数值），同时不必要的嵌套也可能加剧布局冲突。以下是修复方案：

方案1：修正space_8的取值 #

确保space_8是一个合理的固定高度值，比如：

// 示例：根据需求调整为具体数值
const double space_8 = 50.0;
const double space_2 = 4.0;

方案2：简化布局结构 #

移除冗余的SizedBox，直接在Container中放置TextFormField，避免重复设置高度导致的冲突：

return Scaffold(
  body: Column(
    mainAxisSize: MainAxisSize.min,
    children: [
      Container(
        height: space_8, // 确保此处space_8为合理数值
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(space_2),
          color: widgetBackGroundColor
        ),
        child: TextFormField(
          controller: controller,
          keyboardType: TextInputType.emailAddress,
          decoration: InputDecoration(
            hintText: "example@gmail.com",
            border: InputBorder.none, // 可选：移除默认边框避免重叠
            contentPadding: EdgeInsets.symmetric(horizontal: 12.0) // 可选：调整内边距
          ),
        ),
      )
    ],
  ),
);

方案3：让布局自适应屏幕 #

如果希望输入框合理适配屏幕，可去掉固定height，改用Padding和内置装饰：

return Scaffold(
  body: Padding(
    padding: EdgeInsets.all(16.0),
    child: TextFormField(
      controller: controller,
      keyboardType: TextInputType.emailAddress,
      decoration: InputDecoration(
        hintText: "example@gmail.com",
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(space_2),
          borderSide: BorderSide.none
        ),
        filled: true,
        fillColor: widgetBackGroundColor
      ),
    ),
  ),
);

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