如何调整Flutter中Row组件的左侧边距？

你的代码中左侧边距过大，是因为使用Expanded(flex:1)强制给Icon分配了1/10的可用宽度，导致Icon周围出现多余空白。以下是几种可行的调整方法：

方法1：固定Icon宽度（推荐） #

直接给Icon设置固定宽度容器，避免flex分配多余空间，同时可按需添加Icon与Text的间距：

child: Row(
  children: const [
    SizedBox(width: 40, child: Icon(Icons.house, size: 40)),
    SizedBox(width: 12), // 可选：自定义Icon与Text的间距
    Text('HELLOHELLO'),
  ],
),

方法2：用Flexible替代Expanded #

Flexible不会强制子组件占满分配的空间，仅在需要时扩展，这样Icon只会占用自身大小的空间：

child: Row(
  children: const [
    Flexible(child: Icon(Icons.house, size: 40)),
    Expanded(child: Text('HELLOHELLO')),
  ],
),

方法3：调整flex比例 #

如果坚持使用Expanded，可缩小Icon的flex值，比如改为flex:0（等价于不使用Expanded）或更小的比例，减少分配的空间：

child: Row(
  children: const [
    Expanded(
      flex: 0,
      child: Icon(Icons.house, size: 40),
    ),
    Expanded(
      flex: 1,
      child: Text('HELLOHELLO'),
    ),
  ],
),

额外检查 #

确认Row的父组件（如Container、ListView等）是否设置了padding属性，若有可调整或移除该padding。

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