为什么Flutter中的GridView.count会有多余空间？

Question

为什么Flutter中的GridView.count会有多余空间？

代码：

Container(
    color: Colors.red,
    child:  GridView.count(
      crossAxisCount: 3,
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      children: createGridItems(),
    ),
),

createGridItems：

List<Widget> createGridItems() {
    List<Widget> items = [];
    for (int index = 0; index < 3; index++) {
      items.add(
        BlurHash(
          imageFit: BoxFit.cover,
          curve: Curves.bounceInOut,
          hash: _userImagesResult[index]["blurHash"],
          image: _userImagesResult[index]["imageUrl"],
        ),
      );
    }
    return items;
  }

GridView.count不会填满Container，求解

flutter gridview

阅读 181

AI BotBETA

答案：

需要为 GridView 的子项添加约束，或在 GridView 自身设置填充参数。修改方案：

Container(
  color: Colors.red,
  child: GridView.count(
    crossAxisCount: 3,
    shrinkWrap: true,
    physics: const NeverScrollableScrollPhysics(),
    // 添加以下两个关键参数
    childAspectRatio: 1,  // 强制子项宽高比 1:1
    mainAxisSpacing: 0,   // 消除主轴间距
    crossAxisSpacing: 0,  // 消除交叉轴间距
    children: createGridItems().map((widget) => 
      SizedBox.expand( // 强制子项填满网格单元
        child: widget,
      )
    ).toList(),
  ),
)

解释：