Flutter 中GridView部件的兩種方式

1、GridView.count

直接寫間距等，在children下寫內容

return GridView.count(
      crossAxisCount: 2,
      crossAxisSpacing: 10,
      mainAxisSpacing: 10,
      //只能設置寬高比
      // childAspectRatio: 0.6,
      padding: EdgeInsets.all(20),
      children: this._getListData(),
    );

List<Widget> _getListData() {
    var tempListData = listData.map((value) {
      return Container(
        child: Column(
          children: <Widget>[
            Image.network(value['imageUrl']),
            Text(value['title']),
            Text(value['author'])
          ],
        ),
      );
    });
    return tempListData.toList();
  }

2、GridView.builder

需要實現gridDelegate、itemBuilder、itemCount，

gridDelegate：gridDelegate: SliverGridDelegateWithFixedCrossAxisCount()中寫間距什麼的，

itemBuilder：itemBuilder: (context, index){return 內容}

itemCount：itemCount返回多少行

return Container(
      child: GridView.builder(
          padding: EdgeInsets.all(20),
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 2,
            crossAxisSpacing: 10,
            mainAxisSpacing: 10,
          ),
          itemCount: listData.length,
          itemBuilder: (context, index) {
            return Column(
              children: <Widget>[
                Image.network(listData[index]['imageUrl']),
                SizedBox(
                  height: 10,
                ),
                Text(
                  listData[index]['title'],
                  style: TextStyle(
                    fontSize: 18,
                  ),
                ),
              ],
            );
          }),
    );