GridView 详解

一、主要参数：

属性	类型	说明
scrollDirection	Axis	滚动方法
padding	EdgeInsetsGeometry	内边距
resolve	bool	组件反向排序
crossAxisSpacing	double	水平子 Widget 之间间距
mainAxisSpacing	double	垂直子 Widget 之间间距
crossAxisCount	int	一行的 Widget 数量
childAspectRatio	double	子 Widget 宽高比例
children		<Widget>[ ]
gridDelegate	SliverGridDelegateWithFixedCrossAxisCount（常用）	控制布局主要用在GridView.builder 里面

二、代码示例：
1、GridView.count 简单示例
适用场景：当子widget数量比较少时，可以快速的创建固定数量子元素的GridView

List<Widget> _listData = []; // 添加自定义 Widget 组件，如包裹的图片文字的Container容器  

@override
Widget build(BuildContext context) {
	// TODO: implement build
	return GridView.count(
		// 内边距
		padding: EdgeInsets.all(20), 
		// 横轴元素个数
		crossAxisCount: 2,
		 // 横轴间距
 		crossAxisSpacing: 20,
 		// 纵轴间距
 		mainAxisSpacing: 20,
 		// 子组件宽高长度比例
 		childAspectRatio:0.7,
 		children: _listData
 		);
}

2、GridView.builder 简单示例

**适合场景：**当子widget比较多时，可以通过GridView.builder来动态创建子widget

注意：该方法没有内边距

List<Widget> _listData = []; // 添加自定义 Widget 组件，如包裹的图片文字的Container容器  

@override
Widget build(BuildContext context) {
	// TODO: implement build
	return GridView.builder(
		// _listData 的元素个数
		itemCount: _listData.length,
		// _listData 的数据 
		itemBuilder: _listData,
		gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
			// 横轴元素个数
			crossAxisCount: 2, 
			// 纵轴间距
			mainAxisSpacing: 20.0,
			// 横轴间距
			crossAxisSpacing: 10.0,
			// 子组件宽高长度比例
			childAspectRatio: 1.0
		)
	);
}