如何使Flutter GridView在各屏幕下保持恒定尺寸并预留广告位？

要让GridView在所有屏幕尺寸下保持恒定尺寸（或预留广告空间），可以从以下几个方向调整：

1. 固定GridView项的尺寸 #

放弃使用sizer的百分比（如80.w/80.h），给每个GridView子项设置固定宽高：

GridView.count(
  crossAxisCount: 2,
  childAspectRatio: 1.0, // 保持宽高比一致
  children: List.generate(6, (index) {
    return Container(
      width: 120, // 固定宽度
      height: 120, // 固定高度
      margin: EdgeInsets.all(8),
      color: Colors.grey[200],
      child: // 你的子项内容
    );
  }),
)

如果需要适配屏幕密度，也可以用sizer的固定dp值：120.dp，但注意在MyApp初始化时设置SizerUtil.setFixedSize(true)，确保dp值在不同屏幕上保持视觉一致。

2. 限制GridView的整体高度 #

通过ConstrainedBox给GridView设置最大高度，确保它不会占用全部屏幕空间：

Column(
  children: [
    ConstrainedBox(
      constraints: BoxConstraints(
        maxHeight: 300, // 固定最大高度，可根据需求调整
      ),
      child: GridView.count(
        shrinkWrap: true, // 必须设置，让GridView自适应内容高度
        crossAxisCount: 2,
        children: // 你的子项列表
      ),
    ),
    // 下方的广告Widget
    Container(
      height: 100,
      color: Colors.blue,
      child: Text("广告区域"),
    ),
  ],
)

shrinkWrap: true是关键配置，它让GridView只占用子项所需的高度，再通过maxHeight限制上限，避免小屏时过度拉伸。

3. 动态计算GridView可用高度 #

如果希望广告始终占据固定高度，可通过MediaQuery计算GridView的可用高度：

final screenHeight = MediaQuery.of(context).size.height;
final adHeight = 100.0; // 广告固定高度

Column(
  children: [
    Expanded(
      child: GridView.count(
        crossAxisCount: 2,
        children: // 你的子项列表
      ),
    ),
    Container(
      height: adHeight,
      color: Colors.blue,
      child: Text("广告区域"),
    ),
  ],
)

这种方式下，GridView会占据屏幕高度减去广告高度的剩余空间，既保证广告有固定位置，也避免GridView在小屏时挤压广告。

内容的提问来源于stack exchange，提问作者fayzo bngsh