转自:http://blog.csdn.net/allen315410/article/details/44200623

ViewPager作为Android最常用的的组件之一，相信大家在项目中会频繁的使用到的，例如利用ViewPager制作引导页、轮播图，甚至做整个app的表现层的框架等等。

Android3.0以下不支持切换动画

但是在Android 3.0（API 11）以下的ViewPager是比较死板的，不支持动画特效的，这也就让ViewPager在切换的时候达不到很好的用户体验，下面就是Android3.0以下不添加动画的ViewPager的实现代码以及效果演示：

[java] view plaincopyprint?

 

1. public class MainActivity extends Activity {  
2.   
3.     private ViewPager mViewPager;  
4.     private int[] imgRes = new int[] { R.drawable.guide_image1, R.drawable.guide_image2, R.drawable.guide_image3 };  
5.     private List<ImageView> imgList = new ArrayList<ImageView>();  
6.   
7.     @Override  
8.     protected void onCreate(Bundle savedInstanceState) {  
9.         super.onCreate(savedInstanceState);  
10.         requestWindowFeature(Window.FEATURE_NO_TITLE);  
11.         setContentView(R.layout.activity_main);  
12.         mViewPager = (ViewPager) findViewById(R.id.viewpager);  
13.         mViewPager.setAdapter(new PagerAdapter() {  
14.   
15.             @Override  
16.             public boolean isViewFromObject(View arg0, Object arg1) {  
17.                 return arg0 == arg1;  
18.             }  
19.   
20.             @Override  
21.             public int getCount() {  
22.                 return imgRes.length;  
23.             }  
24.   
25.             @Override  
26.             public Object instantiateItem(ViewGroup container, int position) {  
27.                 ImageView mImageView = new ImageView(MainActivity.this);  
28.                 mImageView.setBackgroundResource(imgRes[position]);  
29.                 mImageView.setScaleType(ScaleType.CENTER_CROP);  
30.                 imgList.add(mImageView);  
31.                 container.addView(mImageView);  
32.                 return mImageView;  
33.             }  
34.   
35.             @Override  
36.             public void destroyItem(ViewGroup container, int position, Object object) {  
37.                 container.removeView(imgList.get(position));  
38.             }  
39.         });  
40.     }  
41. }  

上面是最简单的ViewPager使用的Demo，运行如下，看起来很普通很死板：

支持Android3.0以上的官方方法

[java] view plaincopyprint?

 

1. public void setPageTransformer(boolean reverseDrawingOrder, PageTransformer transformer){...}  

其中第一个参数boolean类型设置true就好，第二个参数PageTransformer就是我们自定义好的动画效果：

[java] view plaincopyprint?

 

1. mViewPager = (ViewPager) findViewById(R.id.viewpager);  
2. mViewPager.setPageTransformer(true, new ZoomOutPageTransformer());  

其中ZoomOutPageTransformer的代码来自于google的training文档中，英文好的朋友可以直接进入文档查看，链接是

[java] view plaincopyprint?

 

1. public class ZoomOutPageTransformer implements ViewPager.PageTransformer {  
2.     private static final float MIN_SCALE = 0.85f;  
3.     private static final float MIN_ALPHA = 0.5f;  
4.   
5.     public void transformPage(View view, float position) {  
6.         int pageWidth = view.getWidth();  
7.         int pageHeight = view.getHeight();  
8.   
9.         if (position < -1) { // [-Infinity,-1)  
10.             // This page is way off-screen to the left.  
11.             view.setAlpha(0);  
12.   
13.         } else if (position <= 1) { // [-1,1]  
14.             // Modify the default slide transition to shrink the page as well  
15.             float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position));  
16.             float vertMargin = pageHeight * (1 - scaleFactor) / 2;  
17.             float horzMargin = pageWidth * (1 - scaleFactor) / 2;  
18.             if (position < 0) {  
19.                 view.setTranslationX(horzMargin - vertMargin / 2);  
20.             } else {  
21.                 view.setTranslationX(-horzMargin + vertMargin / 2);  
22.             }  
23.   
24.             // Scale the page down (between MIN_SCALE and 1)  
25.             view.setScaleX(scaleFactor);  
26.             view.setScaleY(scaleFactor);  
27.   
28.             // Fade the page relative to its size.  
29.             view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE) / (1 - MIN_SCALE) * (1 - MIN_ALPHA));  
30.   
31.         } else { // (1,+Infinity]  
32.             // This page is way off-screen to the right.  
33.             view.setAlpha(0);  
34.         }  
35.     }  
36. }  

另外Google文档中还提供了另外一个动画的实现方式，我暂且把源码附在下面：

[java] view plaincopyprint?

 

1. public class DepthPageTransformer implements ViewPager.PageTransformer {  
2.     private static final float MIN_SCALE = 0.75f;  
3.   
4.     public void transformPage(View view, float position) {  
5.         int pageWidth = view.getWidth();  
6.   
7.         if (position < -1) { // [-Infinity,-1)  
8.             // This page is way off-screen to the left.  
9.             view.setAlpha(0);  
10.   
11.         } else if (position <= 0) { // [-1,0]  
12.             // Use the default slide transition when moving to the left page  
13.             view.setAlpha(1);  
14.             view.setTranslationX(0);  
15.             view.setScaleX(1);  
16.             view.setScaleY(1);  
17.   
18.         } else if (position <= 1) { // (0,1]  
19.             // Fade the page out.  
20.             view.setAlpha(1 - position);  
21.   
22.             // Counteract the default slide transition  
23.             view.setTranslationX(pageWidth * -position);  
24.   
25.             // Scale the page down (between MIN_SCALE and 1)  
26.             float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position));  
27.             view.setScaleX(scaleFactor);  
28.             view.setScaleY(scaleFactor);  
29.   
30.         } else { // (1,+Infinity]  
31.             // This page is way off-screen to the right.  
32.             view.setAlpha(0);  
33.         }  
34.     }  
35. }  

两种方式的所实现的效果如下所示，一是ZoomOutPageTransformer，二是DepthPageTransformer

        

兼容Android3.0以下的版本

[java] view plaincopyprint?

 

1. public class DepthPageTransformer implements ViewPager.PageTransformer {  
2.     private static final float MIN_SCALE = 0.75f;  
3.   
4.     public void transformPage(View view, float position) {  
5.         int pageWidth = view.getWidth();  
6.   
7.         if (position < -1) {  
8.             // view.setAlpha(0);  
9.             ViewHelper.setAlpha(view, 0);  
10.         } else if (position <= 0) {  
11.             // view.setAlpha(1);  
12.             ViewHelper.setAlpha(view, 1);  
13.             // view.setTranslationX(0);  
14.             ViewHelper.setTranslationX(view, 0);  
15.             // view.setScaleX(1);  
16.             ViewHelper.setScaleX(view, 1);  
17.             // view.setScaleY(1);  
18.             ViewHelper.setScaleY(view, 1);  
19.         } else if (position <= 1) {  
20.             // view.setAlpha(1 - position);  
21.             ViewHelper.setAlpha(view, 1 - position);  
22.             // view.setTranslationX(pageWidth * -position);  
23.             ViewHelper.setTranslationX(view, pageWidth * -position);  
24.             float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position));  
25.             // view.setScaleX(scaleFactor);  
26.             ViewHelper.setScaleX(view, scaleFactor);  
27.             // view.setScaleY(scaleFactor);  
28.             ViewHelper.setScaleY(view, scaleFactor);  
29.         } else {  
30.             // view.setAlpha(0);  
31.             ViewHelper.setAlpha(view, 0);  
32.         }  
33.     }  
34. }  

为了好理解，我没有将Google提供的源码删除，而是注释掉了，方便大家进行比较阅读，然而即使这样使用了NineOldAndroids对我们的动画源码进行了改造，当我们打开一个Android2.3的模拟器运行一下的时候发现，没有起到效果，也就是这个动画效果并没有执行，在模拟器上运行的ViewPager滑动的效果还是原始默认的左右来回切换的动画，这又是怎么回事呢？为止，我们需要打开ViewPager的源码进行阅读一下了，既然是在mViewPager.setPageTransformer(true, new DepthPageTransformer());这句代码没有起到效果，那么我们就点进去查看一下setPageTransformer这个方法的源码，源码如下：

[java] view plaincopyprint?

 

1. public void setPageTransformer(boolean reverseDrawingOrder, PageTransformer transformer){  
2.     if (Build.VERSION.SDK_INT >= 11) {  
3.         boolean hasTransformer = transformer != null;  
4.         boolean needsPopulate = hasTransformer != (this.mPageTransformer != null);  
5.         this.mPageTransformer = transformer;  
6.         setChildrenDrawingOrderEnabledCompat(hasTransformer);  
7.         if (hasTransformer) {  
8.             this.mDrawingOrder = (reverseDrawingOrder ? 2 : 1);  
9.          } else {  
10.             this.mDrawingOrder = 0;  
11.         }  
12.         if (needsPopulate)   
13.             populate();  
14.         }  
15. }  

好了，源码一目了然，我们分析到在ViewPager中的setPageTransFormer这个方法中，首先判断了一下当前设备的Build.VERSION_SDK_INT>=11，也就是说当前设备是Android3.0以上系统的话，这个方法体执行没问题，但是若是3.0一下，那就抱歉，无法执行了。知道这个原因之后我们就需要解决这个问题了，我在这里修改了一下ViewPager的源码，修改ViewPager的源码之前，读者可以先去下载一份ViewPager的源码，然后拷贝到工程中，重新命名一下，将里面的if判断语句给删除了。以下就是我修改后的部分源码，命名为ViewPagerCompat：

[java] view plaincopyprint?

 

1. public void setPageTransformer(boolean reverseDrawingOrder, ViewPager.PageTransformer transformer) {  
2.     // if (Build.VERSION.SDK_INT >= 11) {  
3.     final boolean hasTransformer = transformer != null;  
4.     final boolean needsPopulate = hasTransformer != (mPageTransformer != null);  
5.     mPageTransformer = transformer;  
6.     setChildrenDrawingOrderEnabledCompat(hasTransformer);  
7.     if (hasTransformer) {  
8.         mDrawingOrder = reverseDrawingOrder ? DRAW_ORDER_REVERSE : DRAW_ORDER_FORWARD;  
9.     } else {  
10.         mDrawingOrder = DRAW_ORDER_DEFAULT;  
11.     }  
12.     if (needsPopulate)  
13.         populate();  
14.     // }  
15. }  

好，源码修改完毕，将您的源码中的ViewPager替换成这个修改后的源码ViewPagerCompat，那么ViewPager切换动画的效果就出现了。

[java] view plaincopyprint?

 

1. public void transformPage(View view, float position) {  
2.     ...  
3.     Log.i("TAG", "view = " + view + ",position = " + position);   
4.         ...  
5. }  

如上所示，我先在这个方法中打印出方法中的参数view对象和position的值，然后我们来看一下LOG的输出：

[java] view plaincopyprint?

 

1. /** 
2.  * ViewPager自定义旋转动画 
3.  *  
4.  * @author Vincent 
5.  *  
6.  */  
7. public class RotateDownTransformer implements PageTransformer {  
8.   
9.     // 旋转的最大角度为20度  
10.     private static final float MAX_ROTATE = 20.0f;  
11.     // 旋转过程中的角度  
12.     private float currentRotate;  
13.   
14.     @Override  
15.     public void transformPage(View view, float position) {  
16.         int pageWidth = view.getWidth();  
17.         Log.i("TAG", "view = " + view + ",position = " + position);  
18.         if (position < -1) {  
19.             ViewHelper.setRotation(view, 0);  
20.         } else if (position <= 0) {  
21.             // position范围[-1.0,0.0],此时A页动画移出屏幕  
22.             currentRotate = position * MAX_ROTATE;  
23.             // 设置当前页的旋转中心点，横坐标是屏幕宽度的1/2,纵坐标为屏幕的高度  
24.             ViewHelper.setPivotX(view, pageWidth / 2);  
25.             ViewHelper.setPivotY(view, view.getHeight());  
26.             ViewHelper.setRotation(view, currentRotate);  
27.         } else if (position <= 1) {  
28.             // position范围(0.0,1.0],此时B页动画移到屏幕  
29.             currentRotate = position * MAX_ROTATE;  
30.             // 设置当前页的旋转中心点，横坐标是屏幕宽度的1/2,纵坐标为屏幕的高度  
31.             ViewHelper.setPivotX(view, pageWidth / 2);  
32.             ViewHelper.setPivotY(view, view.getHeight());  
33.             ViewHelper.setRotation(view, currentRotate);  
34.         } else {  
35.             ViewHelper.setRotation(view, 0);  
36.         }  
37.     }  
38. }  

Android为ViewPager增加切换动画——使用属性动画

原文：http://www.cnblogs.com/wllearnandroid/p/5119115.html