列表与滚动:ListView、GridView、Sliver

掌握常见列表、网格、懒加载构建方式,理解什么时候使用 CustomScrollView 和 Sliver。

列表滚动

列表为什么要 builder

如果列表数据很多,不要一次性创建所有子组件。ListView.builder 会按需构建可见项,性能更好。商品列表、消息列表、文章列表都应该优先考虑 builder。

ListView.builder(
  itemCount: articles.length,
  itemBuilder: (context, index) {
    final item = articles[index];
    return ListTile(
      title: Text(item.title),
      subtitle: Text(item.summary),
      onTap: () {},
    );
  },
)

GridView 适合什么

图片墙、商品卡片、应用入口等适合 GridView。PC 和移动端可以根据宽度调整 crossAxisCount。

什么时候用 Sliver

当你需要可折叠 AppBar、多个列表组合、列表和网格混排时,使用 CustomScrollView + Sliver 系列组件会更灵活。普通页面没必要一开始就上 Sliver。

官方参考