具有verticalScroll修饰符的Column内的LazyColumn抛出异常

Question

在我的一个可组合组件中， Lazycolumn嵌套在Column可组合组件内。 我希望能够与Lazycolumn一起滚动整个Column 。 但是，在Column上指定verticalScroll modifier属性会导致以下异常导致应用程序崩溃。 我怎样才能解决这个问题？

例外

java.lang.IllegalStateException: Vertically scrollable component was measured with an infinity maximum height constraints, which is disallowed. One of the common reasons is nesting layouts like LazyColumn and Column(Modifier.verticalScroll()).

可组合的

Column(
    modifier = Modifier
        .fillMaxWidth()
        .verticalScroll(rememberScrollState())
        .padding(bottom = 100.dp),
    verticalArrangement = Arrangement.Center,
    horizontalAlignment = Alignment.CenterHorizontally
) {
    LazyColumn(
        modifier = Modifier
            .fillMaxWidth()
    ) {
        items(
            items = allItems!!,
            key = { item ->
                item.id
            }
        ) { item ->
            ShoppingListScreenItem(
                navController = navController,
                item = item,
                sharedViewModel = sharedViewModel
            ) { isChecked ->
                scope.launch {
                    shoppingListScreenViewModel.changeItemChecked(item!!, isChecked)
                }
            }
        }
    }

   ...

Button(
    modifier = Modifier.padding(vertical = 24.dp),
    onClick = {
        navController.navigate(NavScreens.AddItemScreen.route) {
            popUpTo(NavScreens.AddItemScreen.route) {
                inclusive = true
            }
        }
    }
) {
    Text("Go to add item screen")
  }
}

Answer 1

当您希望使用Constraints测量您的LazyColumn时，会发生这种情况， Constraints.Infinity是不允许的，如错误日志中所述。 应该有一个固定的高度，或者你不应该有另一个具有相同方向的 Scrollable。

Column(
    modifier = Modifier
         // This is the cause
        .verticalScroll(rememberScrollState())
) {
    LazyColumn(
       // and not having a Modifier that could return non-infinite max height contraint
        modifier = Modifier
            .fillMaxWidth()
    ) {

}

如果您不知道确切的高度，可以将Modifier.weight(1f)分配给 LazyColumn。

约束

本节是关于“约束”和测量的额外内容，如果您对它的工作原理不感兴趣，可以跳过这部分

我用 Constraints.Infinity 测量的意思是

当您在 Compose 中创建布局时，您使用

measurable.measure(constraints)

然后你得到子 Composables 作为可测量的，每个作为

Modifier.fillMaxWidth()

这些约束会根据您的大小修改器而变化。 当有滚动并且您不使用任何大小修饰符时，约束返回 minHeight =0，maxHeight= 一些我不记得的大数字。

Modifier.fillMaxWidth().weight(1f)

 Modifier.fillMaxWidth().weight(1f)

使用不同修饰符或滚动检查Constraints的最简单方法是从BoxWithConstraints