androidandroid-jetpack-composehorizontal-pager

Jetpack Compose HorizontalPager offer by current page

I wanna implement this design: I have 2 pages, the second page's left side part visible on the first page, and the first page's right side on the second.

I played with contentPadding, pageSpacing, modifier.graphicsLayer and so on, but nothing worked. What is the correct setup? Thank you

enter image description here

enter image description here

Solution

  • You can make use of custom PageSize. For example, we use this FillPageSize, where you can specify the fraction of available space that each page takes:

    class FillPageSize(
    private val fraction: Float = 1F,
): PageSize {

    override fun Density.calculateMainAxisPageSize(availableSpace: Int, pageSpacing: Int): Int {
        return (availableSpace * fraction).roundToInt()
    }
}

    Usage is simple:

    HorizontalPager(
    pageSize = FillPageSize(.8F)
) { ... }

    You can easily modify that to subtract specified amount of pixels from available space or something.