Flutter开发：Flexible嵌套ListView产生无法消除自动空白问题咨询

我一眼就注意到你遇到的这个空白问题啦——这其实是Flutter里ListView组件的默认内边距在搞鬼。

问题原因 #

Flutter的ListView组件默认会给内容添加EdgeInsets.symmetric(vertical: 8.0)的内边距，也就是上下各8像素的空白，这刚好对应你描述的“Mais saúde e Segurança”标题下方到蓝色容器上方的那处无法消除的空白。另外，你的ListView嵌套在Flexible中，如果不设置shrinkWrap，也可能导致ListView占用超出实际内容的空间，不过这次的核心问题还是默认内边距。

解决方案 #

只需要两步就能解决：

1. 给ListView添加padding: EdgeInsets.zero，直接去掉默认的上下内边距；
2. 可选但推荐：添加shrinkWrap: true，让ListView仅占用其内容所需的空间，避免布局冗余。

修改后的代码片段（对应你最后一个Flexible部分）：

Flexible(
  flex: 7,
  child: ListView(
    padding: EdgeInsets.zero, // 关键：移除默认上下内边距
    shrinkWrap: true, // 优化：让ListView根据内容自适应高度
    children: [
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
      ListTile(
        leading: Icon(Icons.map),
        title: Text("data"),
      ),
    ],
  ),
),

额外检查（可选） #

如果你调整后还有细微空白，可以检查一下上方包含“Mais saúde e Segurança”标题的Flexible组件：里面的SizedBox(height: 5)也会带来一点顶部间距，根据需求调整这个数值即可。

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