如何在不硬编码高度的情况下让LazyVerticalGrid所有项高度一致？

要实现让第1、2项及后续项和第0项高度一致，且不硬编码高度，可以通过动态测量首项高度并复用的方式实现，具体步骤如下：

• 用remember创建状态变量存储首项的高度
• 在首项的布局中监听尺寸变化，将实际高度存入状态
• 后续所有项使用该状态值作为高度约束

修改后的完整代码：

@Composable
fun LazyVerticalGridDemo() {
    val list = (1..10).map { it.toString() }
    // 保存首项高度的状态变量，初始值为0.dp
    val firstItemHeight = remember { mutableStateOf(0.dp) }
    // 用于将px转为dp
    val density = LocalDensity.current

    LazyVerticalGrid(
        columns = GridCells.Adaptive(128.dp),
        contentPadding = PaddingValues(start = 12.dp, top = 16.dp, end = 12.dp, bottom = 16.dp)
    ) {
        item {
            Card(
                backgroundColor = Color.Blue,
                modifier = Modifier
                    .padding(4.dp)
                    .fillMaxWidth()
                    // 监听首项尺寸变化，将px高度转为dp存入状态
                    .onSizeChanged { size ->
                        firstItemHeight.value = with(density) { size.height.toDp() }
                    },
                elevation = 8.dp,
            ) {
                Text(
                    text = "0",
                    fontWeight = FontWeight.Bold,
                    fontSize = 30.sp,
                    color = Color(0xFFFFFFFF),
                    textAlign = TextAlign.Center,
                    modifier = Modifier.padding(24.dp)
                )
            }
        }

        items(list.size) { index ->
            Card(
                backgroundColor = Color.Red,
                modifier = Modifier
                    .padding(4.dp)
                    .fillMaxWidth()
                    // 复用首项的高度，确保和首项一致
                    .height(firstItemHeight.value)
                    // 初始状态下高度为0，添加最小高度避免布局异常
                    .defaultMinSize(minHeight = 48.dp),
                elevation = 8.dp,
            ) {
                Text(
                    text = list[index],
                    fontWeight = FontWeight.Bold,
                    fontSize = 30.sp,
                    color = Color(0xFFFFFFFF),
                    textAlign = TextAlign.Center,
                    modifier = Modifier.padding(16.dp)
                )
            }
        }
    }
}

关键逻辑说明： #

1. 状态存储高度：通过remember创建的firstItemHeight会在Compose重组时保留值，确保首项测量完成后，后续项能获取到正确的高度。
2. 动态测量高度：首项的onSizeChanged回调会在布局完成后触发，将像素单位的高度转为dp单位，存入状态变量。
3. 复用高度约束：后续项通过height(firstItemHeight.value)强制使用首项的高度，同时添加defaultMinSize避免初始状态下高度为0导致的布局异常。

这种方式完全不需要硬编码固定高度，所有项的高度会自动匹配首项的实际高度，适配不同屏幕尺寸和内容变化。

内容的提问来源于stack exchange，提问作者SURYA S R