Flutter 小技巧之 ListView 和 PageView 的各种花式嵌套

Flutter 小技巧之 ListView 和 PageView 的各种花式嵌套

在 Flutter 中，ListView 和 PageView 是两个常用的控件，它们可以用于滑动展示大量内容的场景，且支持各种嵌套方式，本文将介绍其中的一些花式嵌套方式。

ListView 嵌套 ListView

在某些场景下，我们需要在 ListView 中展示另一个 ListView，比如在一个订单列表中，每个订单又包含了多个商品。此时我们可以在每个订单条目中再嵌入一个 ListView 来展示商品列表。

ListView.builder(
  itemCount: orders.length,
  itemBuilder: (context, index) {
    return Column(
      children: [
        // 订单条目
        ListTile(
          // ...
        ),
        // 商品列表
        ListView.builder(
          shrinkWrap: true,
          physics: NeverScrollableScrollPhysics(),
          itemCount: orders[index].items.length,
          itemBuilder: (context, i) {
            return ListTile(
              // ...
            );
          },
        ),
      ],
    );
  },
)

在嵌套 ListView 时，需要注意内层 ListView 的 shrinkWrap 属性必须为 true