Jetpack Compose中如何给LazyColumn子项设置等权重均分高度？

LazyColumn本身是为长列表懒加载设计的可滚动容器，没有内置子项权重分配功能，因为它默认不会限制整体滚动高度，无法基于固定总高度给子项分配占比。你可以根据是否需要滚动选择以下两种方案实现需求：

方案1：菜单数量少、无需滚动（推荐） #

如果菜单数量可控，所有菜单项不需要滚动就能完全展示，直接将LazyColumn替换为普通Column，给每个子项设置weight(1f)即可自动均分高度：

// else块内替换原有LazyColumn代码
Column(
    modifier = Modifier
        .fillMaxSize()
        .weight(1F)
) {
    menus.forEach { menu ->
        MenuCard(
            modifier = Modifier.weight(1f), // 新增权重属性
            menu = menu,
            onClick = {}
        )
    }
}

方案2：菜单数量多、需要滚动 #

如果菜单数量较多，超出屏幕后需要支持滑动，先获取LazyColumn的可用高度，动态计算每个菜单项的高度即可：

@Composable
fun MenuList(
    loading: Boolean,
    menus: List<Menu>,
    onNavigateToMenuDetailScreen: (String) -> Unit
) {
    // 保存LazyColumn可用高度
    var columnHeight by remember { mutableStateOf(0.dp) }
    val density = LocalDensity.current

    Box(modifier = Modifier
        .background(color = MaterialTheme.colors.surface)
        .fillMaxSize()) {
        Column(modifier = Modifier.fillMaxSize()) {
            if (loading && menus.isEmpty()) {
                LoadingShimmer(imageHeight = 800.dp)
            }
            else if (menus.isEmpty()) {
                NothingHere()
            }
            else {
                LazyColumn(
                    modifier = Modifier
                        .fillMaxSize()
                        .weight(1F)
                        // 监听布局高度变化
                        .onSizeChanged {
                            columnHeight = with(density) { it.height.toDp() }
                        }
                ) {
                    itemsIndexed(
                        items = menus
                    ) { index, menu ->
                        MenuCard(
                            // 计算每个item高度，注意扣除MenuCard上下6dp的padding总和
                            modifier = Modifier.height(columnHeight / menus.size - 12.dp),
                            menu = menu,
                            onClick = {}
                        )
                    }
                }
            }
        }
    }
}

如果需要MenuCard内的文字垂直居中，可以给MenuCard内部的Column加上fillMaxHeight()属性即可。

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