How to achieve cube effect in view pager in RTL mode?

Question

I want to achieve a cube animation effect when swiping ViewPager fragments. like this:

I'm using this code to achieve that:

class CubeOutTransformer : ViewPager2.PageTransformer {
    override fun transformPage(page: View, position: Float) {
        val deltaY = 0.5F

        page.pivotX = if (position < 0F) page.width.toFloat() else 0F
        page.pivotY = page.height * deltaY
        page.rotationY = 45F * position
    }
}

But my current effect is like this:

That only happens when I'm in RTL mode and in LTR mode everything is OK. But I want to achieve that effect in RTL mode. Can anyone help me? Thanks.

Answer 1

You need to reverse a couple of things:

• The condition from if (position < 0F) to if (position > 0F)
• The rotation in Y direction from 45F to -45F

class CubeOutTransformerRTL : ViewPager2.PageTransformer {
    override fun transformPage(page: View, position: Float) {
        val deltaY = 0.5F

        page.pivotX = if (position > 0F) page.width.toFloat() else 0F
        page.pivotY = page.height * deltaY
        page.rotationY = -45F * position

    }
}

Preview: