انیمیشن برای ViewPager در اندروید

سلام دوستان امیدوارم سال خوبی را سپری کرده باشید در این سری از آموزش برنامه نویسی اندروید به افزودن انیمیشن برای ViewPager در اندروید می پردازیم برای اینکه برنامه شما متریال دیزاین شود لازم است برخی از Design Pattern های گوگل را رعایت کنید در ادامه برای ViewPager یکسری انیمیشن معرفی خواهیم کرد که می توانید برای بهتر شدن Viewpager از آن استفاده کنید در ادامه می توانید پیش نمایشی از انیمیشن ها را مشاهده کنید با ما همراه باشید.
به علت اینکه کمی حجم فایل ها سنگین هستند از لینک های زیر برای دیدن پیش نمایش استفاده کنید.
پیش نمایش FadeOut
پیش نمایش Depth
پیش نمایش Depth Out
قبلا آموزش های مربوط به Viewpager را برای شما قرار دادیم که می توانید از لینک زیر به آموزش های ViewPager دسترسی پیدا کنید.
آموزش های Viewpager در اندروید
در اینجا شما لازم است که همانند زیر یک کلاس ایجاد کنید برای هرکدام لازم است یک کلاس متفاوت ایجاد کنید.
اگر می خواهید از انیمیشن Depth Out استفاده کنید مثل زیر یک کلاس به نام CubeOutDepthTransformation.java ایجاد کنید سپس کد های زیر را در آن قرار دهید.

public class CubeOutDepthTransformation 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.setPivotX(page.getWidth());
            page.setRotationY(-90 * Math.abs(position));
        }
        else if (position <= 1){    // (0,1]
            page.setAlpha(1);
            page.setPivotX(0);
            page.setRotationY(90 * Math.abs(position));
        }
        else {    // (1,+Infinity]
            // This page is way off-screen to the right.
            page.setAlpha(0);
        }
        if (Math.abs(position) <= 0.5){
            page.setScaleY(Math.max(0.4f,1-Math.abs(position)));
        }
        else if (Math.abs(position) <= 1){
            page.setScaleY(Math.max(0.4f,1-Math.abs(position)));
        }
    }
}

public class CubeOutDepthTransformation 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.setPivotX(page.getWidth());

page.setRotationY(-90 * Math.abs(position));

}

else if (position <= 1){ // (0,1]

page.setAlpha(1);

page.setPivotX(0);

page.setRotationY(90 * Math.abs(position));

}

else { // (1,+Infinity]

// This page is way off-screen to the right.

page.setAlpha(0);

}

if (Math.abs(position) <= 0.5){

page.setScaleY(Math.max(0.4f,1-Math.abs(position)));

}

else if (Math.abs(position) <= 1){

page.setScaleY(Math.max(0.4f,1-Math.abs(position)));

}

سپس برای استفاده از آن بعد از اینکه آداپتور یا Viewpager شما لود شد کد زیر را قرار دهید.

    ViewPager viewPager ..... ;
    viewPager.setPageTransformer(false, new CubeOutDepthTransformation());

1 2	ViewPager viewPager ..... ; viewPager.setPageTransformer(false, new CubeOutDepthTransformation());

برای اینکه همانند Depth انیمیشن ایجاد کنید یک کلاس با نام DepthTransformation ایجاد کنید.

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);
        }
    }
}

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);

}

برای اینکه از آن در Viewpager استفاده کنید مثل زیر عمل کنید.

DepthTransformation depthTransformation = new DepthTransformation();
ViewPager viewPager.setPageTransformer(true, DepthTransformation);

1 2	DepthTransformation depthTransformation = new DepthTransformation(); ViewPager viewPager.setPageTransformer(true, DepthTransformation);

و در آخر برای اینکه از انیمیشن Fadeout استفاده کنید یک کلاس به نام FadeOutTransformation.java ایجاد کرده و کدهای زیر را در آن قرار دهید.

public class FadeOutTransformation implements ViewPager.PageTransformer{
    @Override
    public void transformPage(View page, float position) {
        page.setTranslationX(-position*page.getWidth());
        page.setAlpha(1-Math.abs(position));
    }
}