如何在 Jetpack Compose 的 LazyColumn 中使用 LazyColumn？

Question

我收到此错误消息，但我不明白。

java.lang.IllegalState

异常：垂直滚动组件是在无限大的最大高度限制下测量的，这是不允许的。 常见原因之一是嵌套布局，如 LazyColumn 和 Column(Modifier.verticalScroll())。 如果您想在项目列表之前添加 header，请在 LazyColumn scope 内的主要项目（）之前添加一个 header 作为单独的项目（）。发生这种情况可能还有其他原因：您的 ComposeView 被添加到具有一定权重的 LinearLayout，您应用了 Modifier.wrapContentSize(unbounded = true) 或编写了自定义布局。 请尝试删除 infinit 的源

滚动容器上方层次结构中的约束。

这是示例代码。

@Composable
fun SupplementSearchScreen(
    onSearch: (String) -> List<Vitamin>,
    updateRecentAddedSupplementList: List<Vitamin>
) {

    LazyColumn(
        modifier = Modifier
            .fillMaxSize()
    ) {
        item{
             SupplementSearchResultCard(someList)
        }
    }
}

@Composable
fun SupplementSearchScreen(list:List<SomeList>){
    ContentCard(
        modifier = Modifier.fillMaxWidth()
    ) {
        Text(
            text = "Hello World",
            fontSize = 16.sp,
            color = Color.Black
        )
        LazyColumn(
            modifier = Modifier
                .fillMaxWidth()
                .wrapContentHeight()
        ) {
            items(list){ resultItem ->
                SearchResultItem(resultItem)
            }
        }
    }
}

这里出了什么问题？

Answer 1

惰性列需要固定高度的组件作为父级来实现惰性行为，如果使用修饰符 Modifier.verticalScroll() 或另一个惰性列在父级中添加惰性列，它将获得无限高度，它将无法决定何时组合以及何时处置可组合项, 而不是使用惰性列块的项目{}

在 xml 中，如果将 recyclerview 包装在嵌套滚动视图中，也会出现同样的问题，但在 xml 中，它不会显示错误，而是会导致 ANR，因为 Recycler 视图适配器中的项目增加

Answer 2

您可以使用：

Modifier.height(LocalConfiguration.current.screenHeightDp.dp)

在第一个惰性列上获取所有屏幕高度。

我不知道这样的东西是否适合你，但只是尝试一下。

Answer 3

您不能直接在 LazyColumn 内部使用 LazyColumn。 只需将 LazyColumn 与不同类型一起使用，如下所示：

sealed interface Item {

    data class SearchCard(val name: String) : Item

    data class SearchText(val name: String): Item
}

@Composable
fun SearchScreen(list: List<Item>) {
    LazyColumn {
        items(list.size) { index ->
            when (list[index]) {
                is Item.SearchCard -> TODO()
                is Item.SearchText -> TODO()
            }
        }
    }
}