You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何让LazyVerticalGrid中元素均分空间并填满最大高度?

实现LazyVerticalGrid元素垂直均分并填满高度

可以实现,核心是让每个网格项填充所在行的全部高度,同时配合垂直排列方式均分空间。具体修改如下:

1. 调整LazyVerticalGrid的垂直排列

保留verticalArrangement = Arrangement.SpaceBetween,它会让行与行之间的空间均匀分布,确保整体填满Grid的高度。

2. 修改每个网格项的Modifier

让所有网格项(星期文本、空按钮、日期按钮)都填充所在行的高度:

  • 星期文本:添加Modifier.fillMaxHeight().wrapContentVertical(Alignment.CenterVertically),既让文本垂直居中,又占满行高。
  • 日期按钮:将原有的height(IntrinsicSize.Max)替换为fillMaxHeight(),让按钮填满所在行的全部高度。

修改后的完整代码

Column (
    modifier = Modifier.fillMaxWidth(),
) {
   ...
    val weekDays: List<String> = listOf("M", "T", "W", "T", "F", "S", "S")

    LazyVerticalGrid(
        modifier = Modifier.fillMaxHeight(),
        columns = GridCells.Fixed(7),
        verticalArrangement = Arrangement.SpaceBetween
    ) {
        items(weekDays) { weekDay ->
            Text(
                text = "$weekDay", 
                fontSize = 20.sp,
                modifier = Modifier
                    .fillMaxHeight()
                    .wrapContentVertical(Alignment.CenterVertically)
            )
        }
        items(offsetDays.value) { _ ->
            TextButton(
                onClick = { },
                shape = RoundedCornerShape(5.dp),
                border = BorderStroke(1.dp, Color.Gray),
                modifier = Modifier.fillMaxHeight()
            ) {
                Text(text = "", fontSize = 20.sp )
            }
        }
        items((calendar.value.getActualMaximum(Calendar.DAY_OF_MONTH))) { day ->
            TextButton(
                onClick = { },
                shape = RoundedCornerShape(5.dp),
                border = BorderStroke(1.dp, Color.Gray),
                modifier = Modifier.fillMaxHeight()
            ) {
                Text(text = "${day + 1}", fontSize = 20.sp )
            }
        }
    }
}

补充优化方案

如果需要每行高度完全一致(而非依赖SpaceBetween分配间距),可以通过固定行高实现:

  1. 确定日历总行数(通常为6行:1行星期标题 + 最多5行日期)
  2. 用Modifier.onSizeChanged获取LazyVerticalGrid的实际高度,计算每行高度(总高度 ÷ 6)
  3. 将计算出的行高应用到所有item的height()修饰符中

这种方式能确保每行高度严格均等,适合对布局精度要求更高的场景。

内容的提问来源于stack exchange,提问作者TryZ

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.09 07:47:07