Jetpack Compose如何在LazyColumn中嵌入不可滚动的固定网格？

你遇到的IllegalStateException异常是因为Jetpack Compose默认禁止嵌套同方向滚动的懒加载容器，两个纵向滚动的懒加载组件共存时就会触发该异常。

核心解决思路为两种：要么禁用内部网格的滚动能力并让其高度适配内容总大小，要么直接使用非懒加载的网格实现，避免嵌套滚动冲突。具体可选用以下任一方案：

• 方案1：调整LazyVerticalGrid配置（适配网格数据量较大的场景）
  仅需给现有LazyVerticalGrid添加两个配置即可解决冲突：
  1. 新增userScrollEnabled = false参数，禁用网格自身的滚动能力
  2. 添加Modifier.height(IntrinsicSize.Min)修饰符，让网格高度自动适配所有内容的总高度，不会无限延伸
     修改后的完整代码如下：

@ExperimentalFoundationApi
@Composable
fun MyLazyColumn() {
    LazyColumn {
        item {
            Text(text = "My LazyColumn Title")
        }
        item {
            LazyVerticalGrid(
                cells = GridCells.Fixed(4),
                modifier = Modifier.height(IntrinsicSize.Min),
                userScrollEnabled = false
            ) {
                items(10) {
                    Box(
                        modifier = Modifier
                            .size(50.dp)
                            .padding(5.dp)
                            .background(Color.Gray)
                    )
                }
            }
        }
    }
}

注意：userScrollEnabled参数需要Compose Foundation 1.2.0及以上版本支持。

• 方案2：手动实现非懒加载网格（适配网格数据量小的场景）
  如果网格元素数量不多（通常低于20个），不需要使用懒加载容器，直接用Column+Row组合实现固定网格即可，不会产生滚动冲突：

@Composable
fun FixedGrid(
    columns: Int,
    itemCount: Int,
    modifier: Modifier = Modifier,
    content: @Composable (index: Int) -> Unit
) {
    Column(modifier = modifier) {
        // 计算网格总行数
        val totalRows = (itemCount + columns - 1) / columns
        for (rowIndex in 0 until totalRows) {
            Row(modifier = Modifier.fillMaxWidth()) {
                for (colIndex in 0 until columns) {
                    val itemIndex = rowIndex * columns + colIndex
                    if (itemIndex < itemCount) {
                        Box(modifier = Modifier.weight(1f)) {
                            content(itemIndex)
                        }
                    } else {
                        // 最后一行不足列数时补占位空白
                        Spacer(modifier = Modifier.weight(1f))
                    }
                }
            }
        }
    }
}

// 调用示例
@Composable
fun MyLazyColumn() {
    LazyColumn {
        item {
            Text(text = "My LazyColumn Title")
        }
        item {
            FixedGrid(columns = 4, itemCount = 10) {
                Box(
                    modifier = Modifier
                        .size(50.dp)
                        .padding(5.dp)
                        .background(Color.Gray)
                )
            }
        }
    }
}

如果你使用Compose 1.5.0及以上版本，还可以直接使用官方foundation库提供的非懒加载Grid组件，无需自己手动实现行列逻辑，默认不可滚动，直接嵌入LazyColumn即可正常使用。

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