Flutter Widget 之 SliverList&SliverGrid

2,107 阅读1分钟

如果要分别滚动列表和网格 ListView和GridView是最好的选择。

但是,如果你想要将列表和网格一起滚动,或创造其他的复杂的滚动效果,该怎么办呢?

这就是SliverList和SliverGrid的用途!

Sliver只是可滚动区域的一部分,并进入自定义滚动视图,因为Slivers可以滚动到视图时毫不费力地构建每个项目。Slivers对于有效滚动大量子项特别有用。

SliverList接受一个delegate参数,该参数在滚动到视图时提供列表中的项目。

SliverList(
    delegate: 
)

你可是使SliverChildListDelegate指定实际的子项列表

SliverList(
    delegate: SliverChildListDelegate(
        [
            widget,
            anotherWidget,
            yetAnotherWidget,
        ]
    )
)

或者使用SliverChildBuilderDelegate毫不费力的构建它们

SliverList(
    delegate: SliverChildBuilderDelegate(
        (BuilderContext context, int index) {
      return aWidget;
    }),
)

SliverGrid还可以使用delegate或显示列表指定子项

SliverGrid.count(
    children: scrollItems,
    ...
);

但是网格上的crossAxis纬度还有一些额外的格式, 使用SliverGrid.count指定它在网格中应包含的项目数。

SliverGrid.count(
    children: scrollItems,
    crossAxisCount: 4,
);

或者指定项目的最大宽度以确定使用SliverGrid.extent构造函数在网格中放置多少个项目。

SliverGrid.extent(
    crossAxisExtent: 90.0,
    ...
),

如果想了解有关SliverList,SliverGrid的内容,或者关于Flutter的其他功能,请访问flutter.io

原文翻译自视频:视频地址