如何去除Flutter中ListView.builder组件后的多余空白？

1. 清除列表项自带的内边距 #

你使用的CheckboxListTile组件自带默认的水平/垂直内边距，这是容易被忽略的空白来源。直接给它添加contentPadding属性清零：

CheckboxListTile(
  contentPadding: EdgeInsets.zero, // 去掉默认内边距
  horizontalTitleGap: 8.0, // 可选：按需调整复选框与文字的间距
  value: tempSelectedTags.contains(tags[index].id),
  // 其余代码保持不变
)

2. 让ListView仅包裹内容（解决内容不足时的底部空白） #

你的ListView.builder被Flexible包裹后，默认会强制占满所有可用空间——哪怕列表内容很少，底部也会出现大片空白。给ListView加上shrinkWrap: true，让它根据实际内容高度自适应：

ListView.builder(
  shrinkWrap: true, // 关键：让ListView贴合内容高度，不强制拉伸
  padding: EdgeInsets.zero, // 确保ListView本身无额外padding
  physics: const ScrollPhysics(),
  itemCount: tags.length,
  // 其余代码保持不变
)

3. 彻底清除系统级padding影响（前两种方案无效时用） #

如果仍有来自系统的默认padding（比如iOS的安全区留白），用MediaQuery.removePadding包裹ListView，明确移除上下padding：

Flexible(
  child: MediaQuery.removePadding(
    context: context,
    removeTop: true,
    removeBottom: true,
    child: ListView.builder(
      padding: EdgeInsets.zero,
      shrinkWrap: true,
      // 其余代码保持不变
    ),
  ),
)

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