如何在Jetpack Compose中调整网格单元格大小以填充最大空间？

要实现无滚动且单元格填充整个空间的网格布局，核心是手动计算单元格高度，让网格刚好填满可用区域。以下是具体实现：

方法：通过BoxWithConstraints计算单元格高度 #

利用BoxWithConstraints获取父容器的可用高度，结合列数、间距计算每个单元格的高度，同时禁用LazyVerticalGrid的滚动功能：

BoxWithConstraints(modifier = Modifier.fillMaxSize()) {
    // 计算可用高度：父容器总高度减去顶部padding
    val availableHeight = maxHeight - 16.dp
    // 计算行数：2列布局，向上取整得到总行数
    val rowCount = (myItems.size + 1) / 2
    val verticalSpacing = 8.dp
    // 计算单个单元格高度：可用高度减去所有垂直间距后，均分到每一行
    val cellHeight = (availableHeight - verticalSpacing * (rowCount - 1)) / rowCount

    LazyVerticalGrid(
        modifier = Modifier
            .background(Color.Yellow)
            .padding(top = 16.dp),
        columns = GridCells.Fixed(2),
        verticalArrangement = Arrangement.spacedBy(verticalSpacing),
        horizontalArrangement = Arrangement.spacedBy(8.dp),
        // 禁用滚动，强制网格不超出父容器
        userScrollEnabled = false
    ) {
        items(items = myItems, key = { it.name }) { item ->
            Box(
                modifier = Modifier
                    .height(cellHeight)
                    .fillMaxWidth()
                    .background(Color.Red)
            ) {
                Text(text = "test")
            }
        }
    }
}

原理说明 #

1. BoxWithConstraints能拿到父容器的真实尺寸，避免硬编码高度适配不同设备；
2. 计算单元格高度时，需要扣除垂直方向的所有间距（(行数-1)*间距），确保总高度刚好填满可用区域；
3. 开启userScrollEnabled=false防止网格因内容过长出现滚动条。

替代方案：使用非懒加载的Grid组件 #

如果你的列表项数量固定且不多，直接用Grid组件更简洁（无需处理懒加载的滚动逻辑）：

BoxWithConstraints(modifier = Modifier.fillMaxSize()) {
    val availableHeight = maxHeight - 16.dp
    val rowCount = (myItems.size + 1) / 2
    val verticalSpacing = 8.dp
    val cellHeight = (availableHeight - verticalSpacing * (rowCount - 1)) / rowCount

    Grid(
        modifier = Modifier
            .background(Color.Yellow)
            .padding(top = 16.dp),
        columns = GridCells.Fixed(2),
        verticalArrangement = Arrangement.spacedBy(verticalSpacing),
        horizontalArrangement = Arrangement.spacedBy(8.dp)
    ) {
        myItems.forEach { item ->
            Box(
                modifier = Modifier
                    .height(cellHeight)
                    .fillMaxWidth()
                    .background(Color.Red)
            ) {
                Text(text = "test")
            }
        }
    }
}

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