Android开发 ViewPager设置切换动画

释放双眼,带上耳机,听听看~!

在原生的ViewPager切换时会显的很突然很生硬,百度了许多前辈的案例,思路都差不多,那就是先写一个继承Scroller的类SpeedScroller

 

package com.youhe.yoyo.addforlu;
import android.content.Context;
import android.view.animation.Interpolator;
import android.widget.Scroller;
/**
* Created by abc on 2016/12/1.
*/
public class SpeedScroller extends Scroller {
private int mDuration = 1000;
public SpeedScroller(Context context) {
super(context);
}
public SpeedScroller(Context context, Interpolator interpolator) {
super(context, interpolator);
}
@Override
public void startScroll(int startX, int startY, int dx, int dy, int duration) {
// Ignore received duration, use fixed one instead
super.startScroll(startX, startY, dx, dy, mDuration);
}
@Override
public void startScroll(int startX, int startY, int dx, int dy) {
// Ignore received duration, use fixed one instead
super.startScroll(startX, startY, dx, dy, mDuration);
}
public void setmDuration(int time) {
mDuration = time;
}
public int getmDuration() {
return mDuration;
}
}

 

这个类写好之后就可以直接引用了,在需要用到的Activity里:

mypager = (ViewPager) parentView.findViewById(R.id.News_pager);
mypager.setPageTransformer(true, new ZoomOutPageTransformer());
pagerAdapter = new MyFragmentPagerAdapter(getChildFragmentManager(), imageList,context);
mypager.setAdapter(pagerAdapter);
SpeedScroller mScroller;
try {
Field mField = ViewPager.class.getDeclaredField("mScroller");
mField.setAccessible(true);
mScroller = new SpeedScroller(mypager.getContext(),new LinearInterpolator());
mField.set(mypager, mScroller);
mScroller.setmDuration(500);//ms
} catch (Exception e) {
e.printStackTrace();
}

首先绑定组件,然后设置动画(下面将给出7种不同的动画风格)

mypager.setPageTransformer(true, new ZoomOutPageTransformer());

注意这句:
mScroller = new SpeedScroller(mypager.getContext(),new LinearInterpolator());

SpeedScroller方法里的第二个参数是插值器,我们也有很多种

AccelerateDecelerateInterpolator   在动画开始与介绍的地方速率改变比较慢,在中间的时候加速
AccelerateInterpolator                     在动画开始的地方速率改变比较慢,然后开始加速
AnticipateInterpolator                      开始的时候向后然后向前甩
AnticipateOvershootInterpolator     开始的时候向后然后向前甩一定值后返回最后的值
BounceInterpolator                          动画结束的时候弹起
CycleInterpolator                             动画循环播放特定的次数,速率改变沿着正弦曲线
DecelerateInterpolator                    在动画开始的地方快然后慢
LinearInterpolator                            以常量速率改变
OvershootInterpolator                      向前甩一定值后再回到原来位置

注意哦,我不是Activity而是Fragment,所以我的adapter是FragmentPagerAdapter,如果你是Activity那就用PagerAdapter就行了

(这不是我们的重点哦)
mScroller.setmDuration(500);最后再这个方法里设置切换的时机长就行了,单位是毫秒(viewpager被广泛应用于广告轮播图,此处正好需要它)

 




接下来给大家码7种不同的动画风格:(在你的项目里新建以下类就行了)

1、深入浅出DepthPageTransformer

import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
public class DepthPageTransformer implements PageTransformer {
private static float MIN_SCALE = 0.5f;
/**
* position参数指明给定页面相对于屏幕中心的位置。它是一个动态属性,会随着页面的滚动而改变。当一个页面填充整个屏幕是,它的值是0,
* 当一个页面刚刚离开屏幕的右边时
* ,它的值是1。当两个也页面分别滚动到一半时,其中一个页面的位置是-0.5,另一个页面的位置是0.5。基于屏幕上页面的位置
* ,通过使用诸如setAlpha()、setTranslationX()、或setScaleY()方法来设置页面的属性,来创建自定义的滑动动画。
*/
@Override
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
if (position < -1) { // [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha(0);
view.setTranslationX(0);
} else if (position <= 0) { // [-1,0]
// Use the default slide transition when
// moving to the left page
view.setAlpha(1);
view.setTranslationX(0);
view.setScaleX(1);
view.setScaleY(1);
} else if (position <= 1) { // (0,1]
// Fade the page out.
view.setAlpha(1 - position);
// Counteract the default slide transition
view.setTranslationX(pageWidth * -position);
// Scale the page down (between MIN_SCALE and 1)
float scaleFactor = MIN_SCALE + (1 - MIN_SCALE)
* (1 - Math.abs(position));
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
} else { // (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha(0);
view.setScaleX(1);
view.setScaleY(1);
}
}
}

 

2、立方体CubeTransformer
import com.nineoldandroids.view.ViewHelper;
import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
public class CubeTransformer implements PageTransformer {
/**
* position参数指明给定页面相对于屏幕中心的位置。它是一个动态属性,会随着页面的滚动而改变。当一个页面填充整个屏幕是,它的值是0,
* 当一个页面刚刚离开屏幕的右边时,它的值是1。当两个也页面分别滚动到一半时,其中一个页面的位置是-0.5,另一个页面的位置是0.5。基于屏幕上页面的位置
* ,通过使用诸如setAlpha()、setTranslationX()、或setScaleY()方法来设置页面的属性,来创建自定义的滑动动画。
*/
@Override
public void transformPage(View view, float position) {
if (position <= 0) {
//从右向左滑动为当前View
//设置旋转中心点;
ViewHelper.setPivotX(view, view.getMeasuredWidth());
ViewHelper.setPivotY(view, view.getMeasuredHeight() * 0.5f);
//只在Y轴做旋转操作
ViewHelper.setRotationY(view, 90f * position);
} else if (position <= 1) {
//从左向右滑动为当前View
ViewHelper.setPivotX(view, 0);
ViewHelper.setPivotY(view, view.getMeasuredHeight() * 0.5f);
ViewHelper.setRotationY(view, 90f * position);
}
}
}



3、旋转RotateTransformer
import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
import com.nineoldandroids.view.ViewHelper;
public class RotateTransformer implements PageTransformer {
/**
* page当然值得就是滑动中德那个view,position这里是float,不是平时理解的int位置信息,而是当前滑动状态的一个表示,
* 比如当滑动到正全屏时
* ,position是0,而向左滑动,使得右边刚好有一部被进入屏幕时,position是1,如果前一夜和下一页基本各在屏幕占一半时
* ,前一页的position是-0.5,后一页的posiotn是0.5,所以根据position的值我们就可以自行设置需要的alpha,x/y信息。
*/
@Override
public void transformPage(View view, float position) {
if (position < -1) {
} else if (position <= 0) {
ViewHelper.setScaleX(view, 1 + position);
ViewHelper.setScaleY(view, 1 + position);
ViewHelper.setRotation(view, 360 * position);
} else if (position <= 1) {
ViewHelper.setScaleX(view, 1 - position);
ViewHelper.setScaleY(view, 1 - position);
ViewHelper.setRotation(view, 360 * position);
} else {
}
}
}



4、左右折叠AccordionTransformer
import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
import com.nineoldandroids.view.ViewHelper;
public class AccordionTransformer implements PageTransformer {
@Override
public void transformPage(View view, float position) {
if (position < -1) {
ViewHelper.setPivotX(view, view.getMeasuredWidth() * 0.5f);
ViewHelper.setPivotY(view, view.getMeasuredHeight() * 0.5f);
ViewHelper.setScaleX(view, 1);
} else if (position <= 0) {
ViewHelper.setPivotX(view, view.getMeasuredWidth());
ViewHelper.setPivotY(view, 0);
ViewHelper.setScaleX(view, 1 + position);
} else if (position <= 1) {
ViewHelper.setPivotX(view, 0);
ViewHelper.setPivotY(view, 0);
ViewHelper.setScaleX(view, 1 - position);
} else {
ViewHelper.setPivotX(view, view.getMeasuredWidth() * 0.5f);
ViewHelper.setPivotY(view, view.getMeasuredHeight() * 0.5f);
ViewHelper.setScaleX(view, 1);
}
}
}

 

5、右上角进入InRightUpTransformer
import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
public class InRightUpTransformer implements PageTransformer {
@Override
public void transformPage(View view, float position) {
int pageHeight = view.getHeight();
if (position < -1) {
view.setAlpha(1);
view.setTranslationY(0);
} else if (position <= 0) {
view.setTranslationY(pageHeight * -position);
view.setAlpha(1 + position);
// Android 3.1以下版本的用下面方法;
// ViewHelper.setTranslationY(view, pageHeight * -position);
// ViewHelper.setAlpha(view, 1 + position);
} else if (position <= 1) {
view.setTranslationY(view.getHeight() * -position);
view.setAlpha(1 - position);
// Android 3.1以下版本的用下面方法;
// ViewHelper.setTranslationY(view, pageHeight * -position);
// ViewHelper.setAlpha(view, 1 - position);
} else {
view.setTranslationY(0);
view.setAlpha(1);
}
}
}



6、右下角进入InRightDownTransformer
import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
public class InRightDownTransformer implements PageTransformer {
@Override
public void transformPage(View view, float position) {
int pageHeight = view.getHeight();
if (position < -1) {
view.setAlpha(1);
view.setTranslationY(0);
} else if (position <= 0) {
view.setTranslationY(pageHeight * position);
view.setAlpha(1 + position);
// Android 3.1以下版本的用下面方法;
// ViewHelper.setTranslationY(view, pageHeight * -position);
// ViewHelper.setAlpha(view, 1 + position);
} else if (position <= 1) {
view.setTranslationY(view.getHeight() * position);
view.setAlpha(1 - position);
// Android 3.1以下版本的用下面方法;
// ViewHelper.setTranslationY(view, pageHeight * -position);
// ViewHelper.setAlpha(view, 1 - position);
} else {
view.setTranslationY(0);
view.setAlpha(1);
}
}
}



7、淡入淡出ZoomOutPageTransformer
import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;
public class ZoomOutPageTransformer implements PageTransformer {
private static float MIN_SCALE = 0.85f;
private static float MIN_ALPHA = 0.5f;
@Override
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
int pageHeight = view.getHeight();
if (position < -1) { // [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha(0);
view.setTranslationX(0);
} else if (position <= 1) { // [-1,1]
// Modify the default slide transition to
// shrink the page as well
float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position));
float vertMargin = pageHeight * (1 - scaleFactor) / 2;
float horzMargin = pageWidth * (1 - scaleFactor) / 2;
if (position < 0) {
view.setTranslationX(horzMargin - vertMargin / 2);
} else {
view.setTranslationX(-horzMargin + vertMargin / 2);
}
// Scale the page down (between MIN_SCALE and 1)
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
// Fade the page relative to its size.
view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE)
/ (1 - MIN_SCALE) * (1 - MIN_ALPHA));
} else { // (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha(0);
view.setTranslationX(0);
}
}
}

最后,原谅我不会录制短片,截图出来的效果不咋地,于是没附上图片。
我也是一名新手,文章写的不好请见谅,希望和大家一起进步~

源码点击这里

 

人已赞赏
Android文章

Android开发深拷贝JSON.parse(JSON.stringify(data))

2020-1-24 16:07:59

Android文章

Android开发一键换全局字体时重启但不退出activity的方法

2020-1-25 2:25:16

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
有新消息 消息中心
搜索