Custom animation by overriding transformPage(View view, float position) method of PageTransformer class of View Pager

3
votes

I want my view pager animation like below image from left and right side both. I have 3 pages. the middle one should not move. when I will move left or right only left or the right page will scroll with little fade in middle screen.

I am making animation with overriding the transformPage(View view, float position) method of PageTransformer class in view pager 

 private final PageTransformer mPageTransformer2 = new PageTransformer() {
    @Override
    public void transformPage(View view, float position) {
        Log.d("CalViewPager", "transformPage: " + position );

        if (position < 0.0f ) {
            // Pin the left page to the left side.
            view.setTranslationX(getWidth() * -position);
            view.setAlpha(Math.max(1.0f - position, 0.0f));
        } else{
            // Use the default slide transition when moving to the next page.
            view.setTranslationX(0.0f);
            view.setAlpha(1.0f);
        }


    };

Above code works fine from right side and i am trying to do in left side also. So, i try to understand the position value of transform(View view, float position) method. but i am unable to figure out how it changes with view?

What i found if i swap right side each position value increase by 1 and if in left side then it get decrease by 1. but how would I know which view has which position value?

Note: - please comment if you didn't get my question or need more explanation

1
androidanimationandroid-viewpagerandroid-pagetransformer

1 Answers

0
votes

You must use the following code : 

public void transformPage(View page, float position) {
       final float normalizedposition = Math.abs(Math.abs(position) - 1);
       page.setScaleX(normalizedposition / 2 + 0.5f);
       page.setScaleY(normalizedposition / 2 + 0.5f);

}

For example, visit this website example of cardpager yazdani