[Flutter] 去掉 ListView 上默认的的 top-padding

最新推荐文章于 2024-08-07 15:33:27 发布

NeverSettle101

最新推荐文章于 2024-08-07 15:33:27 发布

阅读量872

点赞数

分类专栏： Flutter 文章标签： flutter list toppadding toppadding listview

本文链接：https://blog.csdn.net/qq_21265915/article/details/118092171

版权

Flutter 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

官方 issue 地址

起因

使用 Drawer 的时候，想在其中使用 ListView 来展示数据，但是发现在 DarwerHeader（ListView 布局上面的一个 Widget）与 ListView 之间有一个明显的空白间隙，设置Header 部分颜色为 blue 和 ListView 部分为 amber 之后更为明显。
在这里插入图片描述

可以看到 blue 与 amber 之间，有一个很宽的间隔（并且使用布局分析发现其是 SliverPadding）。

原因

可滚动的 View 会添加一个默认的 padding（没错，就是这里的 padding），具体可以看 scroll_view.dart 中在这里插入图片描述

解决

可以使用 MediaQuery.removePadding 方法包裹此 ListView，并且指定你想移除的 Padding 为 true，比如这里我们需要移除 topPadding：

Widget _buildDrawerListView(){
  return MediaQuery.removePadding(
    context: context,
    removeTop: true,
    child: ListView.builder(
     .......
    )
  );
}