https://kotlinlang.org logo
#compose
Title
# compose
r

Ryan Simon

04/22/2022, 12:36 PM
Hey all 👋 , has anyone had luck getting a
HorizontalPager
to work inside of a
LazyColumn
? I've got a rather involved screen that has multiple
HorizontalPagers
for images and for tabs. All of the content should be vertically scrollable. Screenshot in thread.
c

Chris Sinco [G]

04/22/2022, 3:29 PM
What issues are you having? And did you try to just a non-lazy Column before?
r

Ryan Simon

04/22/2022, 4:03 PM
@Chris Sinco [G] Yeah non lazy column works just fine. The issue is that my Composables for each tab require a LazyListScope. That's because there's several elements that need to be displayed like the screenshot pictured with a list of recipe ingredients What will happen is that when I scroll the content inside one of the tabs, that content will appear duplicated and then the content of the tab will disappear. It doesn't crash or anything, it just disappears until I switch tabs and come back. I was able to get everything working by removing the HorizontalPager for the tabs, but that's not ideal.
c

Colton Idle

04/23/2022, 2:58 AM
Do you have any minimally reproducible code to share?
r

Ryan Simon

04/25/2022, 9:24 PM
@Colton Idle Took me a bit to get to this, but here's the minimally reproducible code. You can see how the content gets duplicated just in the Preview/Interactive Preview
I'm aware that it's weird to use a
LazyListScope
from the outer
LazyColumn
inside of the
HorizontalPager
, but that's the only way I got any of it to work at all. I can't have
LazyColumn
as content for my pager tabs because that breaks the nesting rule since
HorizontalPager
already creates a
LazyColumn
automatically for us
3 Views