ViewPager page scaling issue with page transformer

Question

Hi I'm developing an app where I'm using viewpager to make custom animation with viewpager transformer but the problem is that there is scaling issue with viewpager page transformer. I tried every possible x and y scaling but still the problem is the same. I'm having hard time understanding the problem please if someone can help me out here.

Below is the image of what I'm trying to achieve

Update:

Well looks I did not find the solution yet but still trying to figure as I'm almost there with just left with the designing of cardstack look.

My page Transformation code

public class CardStackTransformer implements ViewPager.PageTransformer {
    private static final float DEFAULT_CURRENT_PAGE_SCALE = 1.0f;
    private static final float OTHER_PAGE_SCALE = 0.9f;
    private int dimen;

    @Override
    public void transformPage(@NonNull View view, float position) {

        //view.setScaleX(DEFAULT_CURRENT_PAGE_SCALE);
        // view.setScaleY(DEFAULT_CURRENT_PAGE_SCALE);
        /*dimen = view.getWidth();
        int pageWidth = view.getWidth();
        final float translateValue = position * -pageWidth;
        if (translateValue < -pageWidth) {
            view.setTranslationX(translateValue);
        }

        if (position < -1) {
            view.setAlpha(0);

        } else if (position <= 0) {
            view.setAlpha(1.0f);
            view.setTranslationX(view.getWidth() * -position);
            view.setTranslationY(0);
            view.setScaleX(1);
            view.setScaleY(1);
        } else if (position <= 1) {
            view.setTranslationX(dimen * position);
            view.setAlpha(-0.5f * position + 1.0f);
            //  view.setTranslationX((-dimen / 1.1F) * position);
            view.setTranslationX(view.getWidth() * -position);
            view.setTranslationY((dimen / 200.09f) * position);

            float scaleFactor = OTHER_PAGE_SCALE
                    + (1 - OTHER_PAGE_SCALE) * (1 - Math.abs(position));
            view.setScaleX(scaleFactor);
            view.setScaleY(scaleFactor);
            //view.setScaleX(OTHER_PAGE_SCALE);
            //view.setScaleY(OTHER_PAGE_SCALE);
        } else {
            view.setAlpha(0);
        }*/
        view.setScaleX(DEFAULT_CURRENT_PAGE_SCALE);
        view.setScaleY(DEFAULT_CURRENT_PAGE_SCALE);
        dimen = view.getWidth();

        if(position < -1) {
            view.setAlpha(0);

        } else if(position <= 0) {
            view.setAlpha(1.0f);
            view.setTranslationX(0);
            view.setTranslationY(0);
            view.setScaleX(DEFAULT_CURRENT_PAGE_SCALE);
            view.setScaleY(OTHER_PAGE_SCALE);
        } else if(position <= 1) {
            final float scaleFactor = OTHER_PAGE_SCALE + (1 - OTHER_PAGE_SCALE) * (1 - Math.abs(position));

           // view.setTranslationX(dimen * -position);
            view.setAlpha(-0.5f * position + 1.0f);
            view.setTranslationX((-dimen / 1.1F) * position);
            view.setTranslationY((dimen / 209.9f)*position);
            view.setTranslationX(view.getWidth() * -position);
            view.setScaleX(scaleFactor);
            view.setScaleY(scaleFactor);
        } else {
            view.setAlpha(0);
        }
    }
}

Answer 1

check below code

import android.view.View
import androidx.core.view.ViewCompat
import androidx.viewpager.widget.ViewPager
import kotlin.math.abs

class SliderTransformer() : ViewPager.PageTransformer {

    companion object {
        private const val TAG = "SliderTransformer"

        private const val DEFAULT_TRANSLATION_X = .50f
        private const val DEFAULT_TRANSLATION_FACTOR = 1.2f

        private const val SCALE_FACTOR = .14f
        private const val DEFAULT_SCALE = 1f

        private const val ALPHA_FACTOR = .3f
        private const val DEFAULT_ALPHA = 1f

    }

    override fun transformPage(page: View, position: Float) {

        page.apply {

            ViewCompat.setElevation(page, -abs(position))

            val scaleFactor = -SCALE_FACTOR * position + DEFAULT_SCALE
            val alphaFactor = -ALPHA_FACTOR * position + DEFAULT_ALPHA

            when {
                position <= 0f -> {
                    translationX = DEFAULT_TRANSLATION_X
                    scaleX = DEFAULT_SCALE
                    scaleY = DEFAULT_SCALE
                    alpha = DEFAULT_ALPHA + position
                }
                position >0 -> {
                    scaleX = scaleFactor
                    scaleY = scaleFactor
                    translationX = -(width / DEFAULT_TRANSLATION_FACTOR) * position
                    alpha = alphaFactor
                }
                else -> {
                    translationX = DEFAULT_TRANSLATION_X
                    scaleX = DEFAULT_SCALE
                    scaleY = DEFAULT_SCALE
                    alpha = DEFAULT_ALPHA
                }
            }
        }
    }
}