TextField高度增加后文本未居中？如何保持字号不变解决该问题

嘿，这问题我之前踩过坑！其实根本不用改字号，核心就是TextField的默认内边距和垂直对齐逻辑在自定义高度时没适配好，给你两个实用的解决方案：

方案一：textAlignVertical + 精准调整内边距 #

这是最直接的解决思路，通过强制垂直对齐属性，再配合内边距抵消默认的留白：

// 自定义高度（比如大于默认高度）的场景
TextField(
  style: TextStyle(fontSize: 14), // 保持你原来的字号不变
  textAlignVertical: TextAlignVertical.center, // 关键！强制文本垂直居中
  decoration: InputDecoration(
    contentPadding: EdgeInsets.symmetric(vertical: 10), // 根据高度微调上下内边距
    border: OutlineInputBorder(),
    hintText: "输入内容",
  ),
)

// 高度设为40的场景
Container(
  height: 40,
  child: TextField(
    style: TextStyle(fontSize: 14),
    textAlignVertical: TextAlignVertical.center,
    decoration: InputDecoration(
      contentPadding: EdgeInsets.symmetric(horizontal: 12), // 只保留水平内边距，上下设为0
      border: InputBorder.none, // 避免和Container边框重叠
      hintText: "高度40的输入框",
    ),
  ),
)

方案二：开启isDense减少默认冗余内边距 #

TextField的默认装饰自带了多余的上下留白，开启isDense可以快速缩小默认内边距，再配合垂直对齐：

TextField(
  style: TextStyle(fontSize: 14),
  textAlignVertical: TextAlignVertical.center,
  decoration: InputDecoration(
    isDense: true, // 减少默认内边距
    contentPadding: EdgeInsets.symmetric(vertical: 6, horizontal: 12), // 微调上下内边距适配高度
    border: OutlineInputBorder(),
    hintText: "isDense适配调整",
  ),
)

小提醒： #

• textAlignVertical.center对Android平台尤为重要，iOS默认可能已居中，但加上不影响兼容性；
• 如果用Container固定高度，记得把TextField的边框设为InputBorder.none，避免出现双重边框。

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