顧名思義就是以網格的形式排列。
和前一篇列表一樣它可以設定他的排列方式、訂製子元素、設定列表間隔、數量等

下列是簡單的網格程式碼(也運用了之前所學的text、container與listview)

Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: GridView.count(
          crossAxisCount: 3, // 網格的列數
          mainAxisSpacing: 10,  // 主軸方向的間距
          crossAxisSpacing: 10, // 交叉軸方向的間距
          
          //用List.generate函數來生成一個包含9個子元素的Widget列表
          children: List.generate(9, (index) {  
            return Container(
              color: Colors.blue,  // 子元素的背景顏色
              alignment: Alignment.center,  // 子元素內容的對齊方式
              child: Text('Item $index'),  // 子元素的文本內容
            );
          }),
        ),
      ),
    );
  }

執行結果

網格構造函數的用法
1.GridView.count: 基礎用法，可以使用crossAxisCount參數指定列數，使用mainAxisSpacing和crossAxisSpacing來指定主軸和交叉軸的間距。
2.GridView.extent：子元素的最大交叉軸尺寸是固定的，可以使用maxCrossAxisExtent參數指定子元素的最大交叉軸尺寸，使用mainAxisSpacing和crossAxisSpacing來指定間距。
3.GridView.builder：用於動態生成子元素，可以通過提供itemCount和itemBuilder參數，根據需要生成子元素。
4.GridView.custom：一個高度可自定義的GridView構造函數，透過gridDelegate和childrenDelegate參數，自定義網格的布局和子元素。

(可參考官網的寫法: https://api.flutter.dev/flutter/widgets/GridView-class.html )