Jetpack Compose：如何在Box中实现固定Column A且嵌套Column B可滚动？

当然可以在Box布局中实现这个需求，核心是通过修饰符限制Column B的可用空间并为其添加滚动能力，无需使用LazyColumn。

关键思路 #

• Column A整体占据Box的全部空间，内部垂直排列：顶部固定内容保持原高度，Column B通过weight(1f)占据剩余可用空间。
• 为Column B添加verticalScroll(rememberScrollState())修饰符，当内容超出其可用空间时自动开启滚动。
• Column A本身不添加滚动修饰符，保持固定不可滚动。

代码示例 #

Box(
    modifier = Modifier.fillMaxSize()
) {
    Column( // 你的Column A
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Top
    ) {
        // Column A的固定内容（文本、按钮等）
        Text(
            text = "这是Column A的固定顶部内容",
            modifier = Modifier.padding(16.dp),
            fontSize = 20.sp
        )
        
        // 可滚动的Column B
        Column(
            modifier = Modifier
                .weight(1f) // 占据Column A剩余的全部空间
                .verticalScroll(rememberScrollState()) // 开启垂直滚动
                .padding(16.dp)
        ) {
            // 模拟大量内容，测试滚动效果
            repeat(50) {
                Text(
                    text = "这是Column B的第${it+1}条内容",
                    modifier = Modifier.padding(vertical = 8.dp),
                    fontSize = 16.sp
                )
            }
        }
        
        // Column A底部的固定内容（可选）
        Text(
            text = "这是Column A的固定底部内容",
            modifier = Modifier.padding(16.dp),
            fontSize = 18.sp,
            fontWeight = FontWeight.Bold
        )
    }
}

细节说明 #

• weight(1f)：让Column B自动填充Column A中除固定内容外的剩余空间，避免内容无限延伸撑爆布局。
• rememberScrollState()：保存滚动状态，确保重组时滚动位置不会丢失。
• Column A的fillMaxSize()：使其占满Box的全部空间，保证内部weight修饰符能正确计算剩余空间。

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