Hi, How can I add multiple Headers that occupy both columns in LazyVerticalStaggeredGrid with 2 Colu...

# compose

[Ali haider]

Hi, How can I add multiple Headers that occupy both columns in LazyVerticalStaggeredGrid with 2 Columns?

[Kirill Grouchnikov]

Do you have a design mock of what your requirements are?

[Kirill Grouchnikov]

You’re probably looking for span = StaggeredGridItemSpan.SingleLane but that would depend on how your target design looks like

[Ali haider]

I have a home page in my app where, Banner section as you can see in the first screenshot under the banner I have the Categories section under categories section, I have the Trending Products section you can see in the second picture. and I wanna add the Last section like For you . You can see it last picture like LazyVerticalStaggeredGrid.
When I added LazyVerticalStaggeredGrid in my parent scrollable Column it gave me an illegal exception.

[Kirill Grouchnikov]

Do you have LazyVerticalStaggeredGrid working at all in your app? If not, first you’ll need to figure that out, and then get to item spans

[Ali haider]

No, I am using it for the very first time LazyVerticalStaggeredGrid. You can suggest other workarounds. Thank you @Kirill Grouchnikov.

[Ali haider]

@Kirill Grouchnikov Can I ask the same question in other channels?

[Kirill Grouchnikov]

This is the right channel for compose questions. Asking the same question in multiple channels will lead to being ignored in all of them

[Kirill Grouchnikov]

Overall, you need to provide full information on what you’re trying to do, and what is not working right now. You asked how to do multiple headers that span two columns in a staggered grid, but first you need to have your app not crash displaying even an empty grid.

[Kirill Grouchnikov]

So that would be the question to begin with - why is this specific piece of code not working and crashing? Which means that you would attach a piece of code that people can take a look at, along with the relevant snippet of the crash stack trace.

[Kirill Grouchnikov]

Compose comes with samples for its public APIs, in this particular case https://cs.android.com/androidx/platform/frameworks/support/+/androidx-main:compose/[…]StaggeredGridSamples.kt?q=LazyVerticalStaggeredGrid%20file:kt which can be found on cs.android.com by typing “LazyVerticalStaggeredGrid file:kt” into the search box

[Kirill Grouchnikov]

That would be your starting point to have a working grid

[Ali haider]

Let me try the samples.

[Ali haider]

Thank you @Kirill Grouchnikov It worked span = StaggeredGridItemSpan.FullLine .