Jetpack Compose中Column设置verticalScroll属性不生效出现报错如何解决

你触发报错的核心原因是同方向滚动组件嵌套冲突：

• 外层Column添加了verticalScroll修饰符，本身具备垂直滚动能力，会给内部子元素提供无限的纵向布局空间
• 内层LazyColumn默认也是垂直滚动属性，且你给它和外层包裹的Box都设置了fillMaxSize，在无限纵向空间中无法完成测量，直接触发Compose的运行时异常。

推荐使用第一种性能最优的方案，第二种仅作为特殊场景的兼容方案：

方案1：移除外层滚动Column，所有内容合并到LazyColumn中（推荐） #

LazyColumn本身支持插入多种不同类型的列表项，完全可以承载你的头部自定义视图、列表项、底部版本号文本，既避免滚动冲突，还能保留LazyColumn的懒加载性能优势，示例代码如下：

val context = LocalContext.current
Box(
    modifier = modifier
        .fillMaxSize()
) {
    val state = viewModel.state.value

    LazyColumn(modifier = modifier.fillMaxSize()) {
        // 头部间距
        item {
            Spacer(modifier = Modifier.size(24.dp))
        }
        // 头部自定义视图
        item {
            AccountNameSection(modifier = modifier)
            Spacer(modifier = Modifier.size(24.dp))
        }
        // 列表项
        if (!state.items.isNullOrEmpty()) {
            items(state.items) { item ->
                ProfileListItems(item = item, onItemClick = {

                })
            }
        }
        // 底部版本号
        item {
            Text(text = context.getAppVersionName())
        }
    }
    if (state.error.isNotBlank())
        SimpleSnackbar(
            text = state.error,
            modifier = modifier.align(Alignment.BottomCenter)
        )

    if (state.isLoading)
        Loading(modifier = modifier.align(Alignment.BottomCenter))
}

方案2：保留外层Column滚动，禁用内层LazyColumn滚动并设置自适应高度 #

如果业务场景必须保留外层的滚动逻辑，可以给内层LazyColumn关闭自身滚动能力，同时设置高度自适应内容，让所有列表项完全展开跟随外层Column滚动，注意此方案会丢失LazyColumn的懒加载特性，列表项过多时会有性能损耗，需要修改的代码段如下：

if (!state.items.isNullOrEmpty()) {
    // 移除外层Box的fillMaxSize设置，LazyColumn关闭滚动、高度自适应
    LazyColumn(
        modifier = modifier
            .fillMaxWidth()
            .wrapContentHeight(),
        userScrollEnabled = false
    ) {
        items(state.items) { item ->
            ProfileListItems(item = item, onItemClick = {

            })
        }
    }
}

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