Skip to content

Depth Transformation

Dipanshu Kumar edited this page Mar 14, 2018 · 11 revisions

Hello guys here i will tell you how you can apply Depth Transformation on Viewpager.

Depth

First you have to implement ViewPager.PageTransformer in your class then check for position value, if position < -1 or position > 1 then set Alpha to 0 otherwise for position <= 0 you code for page which is currently visible to you and for position <= 1 you code for the page which is going to be visible to you.

public class DepthTransformation implements ViewPager.PageTransformer{
    @Override
    public void transformPage(View page, float position) {

        if (position < -1){    // [-Infinity,-1)
            // This page is way off-screen to the left.
            page.setAlpha(0);

        }
        else if (position <= 0){    // [-1,0]
            page.setAlpha(1);
            page.setTranslationX(0);
            page.setScaleX(1);
            page.setScaleY(1);

        }
        else if (position <= 1){    // (0,1]
            page.setTranslationX(-position*page.getWidth());
            page.setAlpha(1-Math.abs(position));
            page.setScaleX(1-Math.abs(position));
            page.setScaleY(1-Math.abs(position));

        }
        else {    // (1,+Infinity]
            // This page is way off-screen to the right.
            page.setAlpha(0);

        }


    }
}

Now creating object of your transformation class

DepthTransformation depthTransformation = new DepthTransformation();

After doing this you just set your transformation to view pager

ViewPager viewPager.setPageTransformer(true, DepthTransformation);