flutter 网格布局 GridView

gridView构造方法的属性

属性  说明
scrollDirection 滚动方向
reverse 组件反向排序
controller  滚动控制（滚动监听）
primary 如果内容不足，则用户无法滚动 而如果[primary]为true，它们总是可以尝试滚动。
physics 滑动类型设置  AlwaysScrollableScrollPhysics() 总是可以滑动
                     NeverScrollableScrollPhysics()禁止滚动
                     BouncingScrollPhysics() 内容超过一屏 上拉有回弹效果
                     ClampingScrollPhysics() 包裹内容 不会有回弹
shrinkWrap  默认false 内容适配
padding 内边距
crossAxisCount  列 数量
mainAxisSpacing 垂直子 Widget 之间间距
crossAxisSpacing    水平子 Widget 之间间距
childAspectRatio    子 Widget 宽高比例
addAutomaticKeepAlives  默认true
addRepaintBoundaries    默认true
addSemanticIndexes  默认true
cacheExtent 设置预加载的区域
children    子元素
semanticChildCount  将提供语义信息的子代数量
dragStartBehavior    
GridView.builder独有属性     
gridDelegate    一个控制 GridView 中子项布局的委托。
itemBuilder 遍历数返回Widget
itemCount   子控件数量

构造函数
1.GridView默认构造函数可以类比于ListView默认构造函数，适用于有限个数子元素的场景，因为GridView组件会一次性全部渲染children中的子元素组件；
2.GridView.builder构造函数可以类比于ListView.builder构造函数，适用于长列表的场景，因为GridView组件会根据子元素是否出现在屏幕内而动态创建销毁，减少内存消耗，更高效渲染；
3.GridView.count构造函数是GrdiView使用SliverGridDelegateWithFixedCrossAxisCount的简写（语法糖），效果完全一致；
4.GridView.extent构造函数式GridView使用SliverGridDelegateWithMaxCrossAxisExtent的简写（语法糖），效果完全一致。
用法

1.GridView.count

GridView.count(
      //水平子Widget之间间距
      crossAxisSpacing: 10.0,
      //垂直子Widget之间间距
      mainAxisSpacing: 30.0,
      //GridView内边距
      padding: EdgeInsets.all(10.0),
      //一行的Widget数量
      crossAxisCount: 2,
      //子Widget宽高比例
      childAspectRatio: 2.0,
      //子Widget列表
      children: getWidgetList(),
    );

2.GridView.builder

 @override
  Widget build(BuildContext context) {
    List<String> datas = getDataList();
    return GridView.builder(
        itemCount: datas.length,
        //SliverGridDelegateWithFixedCrossAxisCount 构建一个横轴固定数量Widget
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          //横轴元素个数
            crossAxisCount: 3,
            //纵轴间距
            mainAxisSpacing: 20.0,
            //横轴间距
            crossAxisSpacing: 10.0,
            //子组件宽高长度比例
            childAspectRatio: 1.0),
        itemBuilder: (BuildContext context, int index) {
          //Widget Function(BuildContext context, int index)
          return getItemContainer(datas[index]);
        });
  }

3.GridView.builder（SliverGridDelegateWithMaxCrossAxisExtent）

GridView.builder(
      itemCount: datas.length,
      itemBuilder: (BuildContext context, int index) {
        return getItemContainer(datas[index]);
      },
      gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
        //单个子Widget的水平最大宽度
        maxCrossAxisExtent: 200,
        //水平单个子Widget之间间距
        mainAxisSpacing: 20.0,
        //垂直单个子Widget之间间距
        crossAxisSpacing: 10.0
      ),
    );

在colum嵌套GridView时需加入以下代码

ListView.builder(
//解决无限高度问题
  shrinkWrap: true,
  //禁用滑动事件
  physics: NeverScrollableScrollPhysics(),
);

同样适用listView