Flutter布局问题：如何让Row中的所有Widget始终顶部对齐？

问题现象 #

当Row内的文本内容较短时，图标、按钮和文本无法保持顶部对齐，文本会处于垂直居中位置；只有文本较长时，三者才会自然顶部对齐。

修复方案 #

核心原因是Row默认的crossAxisAlignment属性值为CrossAxisAlignment.center，短文本场景下Row的高度由图标或按钮决定，文本会被垂直居中布局。只需将Row的垂直对齐方式改为CrossAxisAlignment.start，即可强制所有子组件保持顶部对齐。

修改后的关键代码 #

Row(
  // 强制所有子项顶部对齐
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [
    Icon(Icons.info_outline),
    ElevatedButton(
      onPressed: () {},
      child: const Text("按钮"),
    ),
    // 用Expanded确保文本占满剩余空间，避免溢出
    Expanded(
      child: const Text("这里是短文本"),
    ),
  ],
)

额外优化（可选） #

如果按钮默认的垂直内边距导致和图标、文本的顶部存在细微差距，可以调整按钮的内边距来缩小差异：

ElevatedButton(
  style: ElevatedButton.styleFrom(
    padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
  ),
  onPressed: () {},
  child: const Text("按钮"),
)

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