How do I put a LazyVerticalGrid in a scrollable C...

# compose

[Tobias Gronbach]

How do I put a LazyVerticalGrid in a scrollable Column. I get following exception : "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())." What is the recommended approach? I guess this is not an uncommon usecase?

[Thomas Dougherty]

What’s the end result you’re trying to achieve?

[Tobias Gronbach]

Hi Thomas, thanks for your question! I have a Filter-Dialog. It contains several lists of filters. For Each List I use a LazyVerticalGrid. The filter-lists require more space than is available on screen so I wanted to place them inside a Column and make it scrollable.

[Thomas Dougherty]

I believe you can achieve that same effect within a LazyColumn itself. Something like:

LazyColumn {
    // Add a single item
    item {
        Text(text = "Header")
    }

    // Add first filters list
    items(firstFiltersList) { filter ->
        Text(text = "Filter: $filter")
    }

    // Add another single item
    item {
        Text(text = "Another Header")
    }

    // Add second filters list
    items(secondFiltersList) { filter ->
        Text(text = "Filter: $filter")
    }
}

[Thomas Dougherty]

Your filter lists would each go in their own items block and the content displayed can be different. I am by no means an expert on Lists in compose yet, but I’m pretty sure there’s no way currently to add the LazyVerticalGrid into a scrollable column.

[Tobias Gronbach]

Yeah maybe I'll go with that approach. I had those Grid-Component already available in a seperate Composable that was quite nicely designed with all the logic and I hoped to be able to just reuse it. But thanks a lot for your idea! I guess I'll go with that approach! 👌