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

Josh Eldridge

03/19/2024, 2:47 AM
Does anyone have experience with
HorizontalPager
? I've been trying to figure out how to deal with height changes between items as it doesn't seem to consistently adjust the height of the current screen. Take this calendar view for example. Using layout inspector I can see there are 2 items pre-loaded on the sides and october is taking the smaller size and properly wrapping it's height. But sometimes like the second image, it takes the height of the largest side-loaded element.
A better example for the extra space version, the layout inspector is showing an odd overlap in the original.
c

curioustechizen

03/19/2024, 3:52 AM
I'm not sure if this is related but I had some issues in my HorizontalPager implementation that was caused by the default verticalAlignment being CenterVertically. I changed it to Top to fix it for my case.
j

Josh Eldridge

03/19/2024, 3:55 AM
This is what I'm working with currently, I make sure my vertical alignment is set to Top, and I've been experimenting with various modifiers but nothing stops it, the height issue is not consistent either.
Copy code
HorizontalPager(
      state = pagerState,
      verticalAlignment = <http://Alignment.Top|Alignment.Top>,
      key = { index -> monthState.getKeyForPage(index) },
      modifier = Modifier.animateContentSize().wrapContentHeight().onSizeChanged { Timber.d(it.toString()) }
    )
    { page ->
      MonthContent(
        showAdjacentMonths = showAdjacentMonths,
        selectedDate = selectedDate,
        dateSelected = monthPagerDateSelected,
        dateSubtexts = dateSubtexts,
        currentMonth = monthState.getMonthForPage(page),
        today = today,
        daysOfWeek = daysOfWeek,
        modifier = Modifier
      )
    }
I've submitted a bug here: https://issuetracker.google.com/issues/330194851 I discovered that it's unreliable when there is a larger data count, but it is reliably adjusting height when swiping at smaller page counts.
s

Stylianos Gakis

03/19/2024, 5:10 AM
For your use case specifically here, would it not make sense to make your calendar month components just always take up 6 rows worth of height regardless?
j

Josh Eldridge

03/19/2024, 2:41 PM
I could, but I rather not have an empty space for the other X months in my use case
s

Stylianos Gakis

03/19/2024, 2:51 PM
Would it not be jumpy then in the cases where that other month comes in and it does want to have that extra row? Or would you just like to optimally animate this movement?
j

Josh Eldridge

03/19/2024, 2:52 PM
I would like to optimally animate the movement. The
animateContentSize
feels smooth enough when it does work
4 Views