带动画的新手指导页

我们的项目都会有几张图片做为用户第一次使用APP的展示页面，是为了给APP或者公司做一个宣传，或者增加用户对APP的第一印象。这样一来那指导页面的设计其实还是有一定的作用，但是图片展示的内容却是我们程序员无法控制的，那我们就给它来点动画，让它更好看吧。好了下面上图：

这是个ViewPager，然后加3张图片。动画也非常简单，使用了系统的setPageTransformer回调。好了接下来上代码：

 // 转场动画
 vp_guide.setPageTransformer(false, new ViewPager.PageTransformer() {
      // 最小缩放系数
      private static final float MIN_SCALE = 0.85f;
      // 最小透明度
      private static final float MIN_ALPHA = 0.5f;

      @Override
      public void transformPage(View page, float position) {
          int width = page.getWidth();
          int height = page.getHeight();

          if (position < -1){
              page.setAlpha(0);
          }else if(position <= 1){
          // 计算最小缩放系数在MIN_SCALE - 1之间
              float scaleFactor = Math.max(MIN_SCALE,1 - Math.abs(position));  

              float vertMargin = height * (1- scaleFactor) / 2; //计算缩放后的高
              float horzMargin = width * (1 - scaleFactor) / 2; //计算缩放后的宽

              if (position < 0){
               page.setTranslationX(horzMargin - vertMargin / 2); // 设置水平移动距离(右滑)
              }else{
               page.setTranslationX(-horzMargin + vertMargin / 2); // 设置向左水平移动距离(左滑)
              }
              page.setScaleX(scaleFactor); //设置水平方向缩放比例
              page.setScaleY(scaleFactor); //设置竖直方向缩放比例
              //这个是设置透明的，但是会有一层白茫茫的模糊层很不好看
              //page.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE) / (1 - MIN_SCALE) * (1 - MIN_ALPHA));
          }else{
              page.setAlpha(0);
          }
      }
  });

注释很清楚了，其实还有更炫的效果，这里我就不做了，大家可以参考下面这篇博文：
Reference：
http://blog.csdn.net/wei_smile/article/details/51167220#comments