我们在上一章回中介绍了SliverList组件相关的内容,本章回中将介绍SliverGrid组件.闲话休提,让我们一起Talk Flutter吧。
概念介绍
我们在本章回中介绍的SliverGrid组件是一种网格类组件,主要用来创建网格类布局,它和GridView组件类似,它们的不同之处在于SliverGrid组件可以被当作一
个整体来滑动。我们将在本章回中详细介绍SliverGrid组件的使用方法。
使用方法
和其它组件一样,SliverGrid组件提供了相关的属性来控制自己,不过它的属性只有三个:- key属性;- delegate属性; - gridDelegate属性;
我们先看一下delegate属性。该属性是SliverChildDelegate类型,不过这个类是一个抽象类,无法创建实例,它有两个实现类,详细如下:
- SliverChildBuilderDelegatet - SliverChildListDelegate.
关于SliverChildDelegate类和它的两个子类是不是很熟悉,没错!我们在上一章回中刚刚介绍过它们,因此这里就不再介绍了。我们重点介绍gridDelegate属性,
该属性是SliverGridDelegate类型,不过这个类是一个抽象类,无法创建实例,它有两个实现类,详细如下:
- SliverGridDelegateWithFixedCrossAxisCount, 该类提供了五个属性,详细的名称和功能如下:
- crossAxisCount属性:用来控制主轴上显示内容的数量;
- mainAxisSpacing属性:用来控制主轴上显示内容的空间,相当于行距
- crossAxisSpacing属性:用来控制交叉轴上显示内容的空间,相当于列距
- childAspectRatio属性:用来控制显示的宽高比;
- mainAxisExtent属性:用来控制主轴外显示内容的扩展空间,
- SliverGridDelegateWithMaxCrossAxisExtent,该类提供了五个属性,详细的名称和功能如下:
- maxCrossAxisExtent属性用来控制主轴上最大可以显示的内容数量;
- mainAxisSpacing