Jetpack Compose中LazyColumn遮挡按钮，如何分配布局占比？

你的问题根源在于未限制LazyColumn的高度，当列表条目过多时，它会无限延伸并挤出底部按钮。以下两种方案可以解决这个问题：

方案一：标题、按钮固定高度，LazyColumn占剩余空间 #

给标题和按钮设置固定高度，通过weight(1f)让LazyColumn占据屏幕剩余所有空间，这样列表内容会在分配的区域内滚动，不会遮挡其他组件：

Column(horizontalAlignment = Alignment.CenterHorizontally,
    modifier = Modifier
        .fillMaxSize()
        .background(Color(0xFFFAD173))
) {
    // 标题固定高度
    DCLCTitle(
        modifier = Modifier
            .height(80.dp)
            .fillMaxWidth()
    )
    // LazyColumn占据剩余空间
    DCList(
        ListDSState,
        modifier = Modifier
            .weight(1f)
            .fillMaxWidth()
    )
    // 按钮固定高度
    DCListButton(
        modifier = Modifier
            .height(60.dp)
            .fillMaxWidth()
    )
}

方案二：按比例分配布局空间（20/60/20） #

通过weight参数按比例分配三个组件的高度，总权重之和为1f，各组件按权重占对应比例的屏幕高度：

Column(horizontalAlignment = Alignment.CenterHorizontally,
    modifier = Modifier
        .fillMaxSize()
        .background(Color(0xFFFAD173))
) {
    DCLCTitle(
        modifier = Modifier
            .weight(0.2f) // 占20%高度
            .fillMaxWidth()
    )
    DCList(
        ListDSState,
        modifier = Modifier
            .weight(0.6f) // 占60%高度
            .fillMaxWidth()
    )
    DCListButton(
        modifier = Modifier
            .weight(0.2f) // 占20%高度
            .fillMaxWidth()
    )
}

注意：如果标题或按钮的内容高度超过分配的空间，可能会被截断，可根据实际内容调整固定高度或权重比例，确保内容完整显示。

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