《疯狂Android讲义》 -- Android 动画系列之补间（Tween）动画

前言

         Android除了支持逐帧动画之外，也提供了对补间(Tween)动画的支持。补间动画就是指开发者只需指定动画开始、动画结束等“关键帧”，而动画变化的“中间帧”由系统计算并补齐。这也是把Tween动画翻译为“补间动画”的原因。

Tween动画与Interpolator

         下图可作为补间动画的示意图。

         从上图可以看出，对于补间动画而言，开发者无须“逐一”定义动画过程中的每一帧，它只要定义动画开始、结束的关键帧，并指定动画的持续时间即可。

         从上图可以看出，补间动画所定义的开始帧、结束帧其实只是一些简单的变化，比如图形大小的缩放、旋转角度的改变等。Android使用Animation代表抽象的动画类，它包含如下几个子类。

• AlphaAnimation：透明度改变的动画。创建该动画时要指定动画开始时的透明度、结束时的透明度和动画持续时间。其中透明度可从0变化到1.
• ScaleAnimation：大小缩放的动画。创建该动画时要指定动画开始时的缩放比(以X、Y轴的缩放参数来表示)、结束时的缩放比(以X、Y轴的缩放参数来表示)，并指定动画持续时间。由于缩放时以不同点为中心的缩放效果并不相同，因此指定缩放动画时还要通过pivotX、pivotY来指定“缩放中心”的坐标。
• TranslateAnimation：位移变化的动画。创建该动画时只要指定动画开始时的位置(以X，Y坐标来表示)、结束时的位置(以X、Y坐标来表示)，并指定动画持续时间即可。
• RotateAnimation：旋转动画。创建该动画时只要指定动画开始时的旋转角度、结束时的旋转角度，并指定动画持续时间即可。由于旋转时以不同点为中心的旋转效果并不相同，因此指定旋转动画时还要通过pivotX、pivotY来指定“旋转轴心”的坐标。

         一旦为补间动画指定了三个必要信息，Android就会根据动画的开始帧、结束帧、动画持续时间计算出需要在中间“补入”多少帧，并计算所有补入帧的图形。当用户浏览补间动画时，他眼中看到的依然是“逐帧动画”。

         为了控制在动画期间需要动态“补入”多少帧，具体在动画运行的哪些时刻补入帧，需要借助于Interpolator。

         Interpolator根据特定算法计算出整个动画所需要动态插入帧的密度和位置。简单地说，Interpolatorf负责控制动画的变化速度，这就使得基本的动画效果(Alpha、Scale、Translate、Rotate)能以匀速变化、加速、减速、抛物线速度等各种速度变化。

         Interpolator是一个接口，它定义了所有Interpolator都需要实现的方法： float getInterpolation(float input)，开发者完全可以通过实现Interpolator来控制动画的变化速度。

         Android为Interpolator提供了如下几个实现类，分别用于实现不同的动画变化速度。

• LinearInterpolator：动画以均匀的速度改变。
• AccelerateInterpolator：在动画开始的地方改变速度较慢，然后开始加速。
• AccelerateDecelerateInterpolator：在动画开始、结束的地方改变速度较慢，在中间的时候加速。
• CycleInterpolator：动画循环播放特定的次数，变化速度按正弦曲线改变。
• DecelerateInterpolator：在动画开始的地方改变速度较快，然后开始减速。

         为了在动画资源文件中指定补间动画所使用的Interpolator，定义补间动画的<set.../>元素支持一个android:interpolator属性，该属性的属性值可指定为Android默认支持的Interpolator。例如：

         其实上面的写法很有规律，它们就是把系统提供的Interpolator实现类的类名的驼峰写法改为下划线写法即可。

         一旦在程序中通过AnimationUtils得到了代表补间动画的Animation之后，接下来就可调用View的startAnimation(Anim anim)方法开始对该View执行动画了。

位置、大小、旋转度、透明度改变的补间动画

         虽然Android允许在程序中创建Animation对象，但实际上一般都会采用动画资源文件来定义补间动画。下面就以示例来介绍补间动画。动画资源文件放在/res/anim/目录下，下面代码的 anim-image就是一个图片对象 。

位置动画

         位置变化动画资源文件如下：

   
   

    
    

     
     <?xml version="1.0" encoding="utf-8"?>
    
    
    
    

     
     <translate xmlns:android="http://schemas.android.com/apk/res/android"
    
    
    
    

     
         android:fromXDelta="0.0"
    
    
    
    

     
         android:fromYDelta="10.0"
    
    
    
    

     
         android:toXDelta="100.0"
    
    
    
    

     
         android:toYDelta="200.0">
    
    
    
    

     
      
    
    
    
    

     
     </translate>
    
    
   
   

         Java调用动画代码如下：

   
   

    
    

     
      TranslateAnimation translateAnimation = (TranslateAnimation) AnimationUtils.loadAnimation(this,R.anim.translate);
    
    
    
    

     
      translateAnimation.setDuration(3000);
    
    
    
    

     
      translateAnimation.setInterpolator(new LinearInterpolator());
    
    
    
    

     
      anim_image.startAnimation(translateAnimation);
    
    
   
   

大小缩放动画

         大小缩放动画资源文件如下：

   
   

    
    

     
     <?xml version="1.0" encoding="utf-8"?>
    
    
    
    

     
     <scale xmlns:android="http://schemas.android.com/apk/res/android"
    
    
    
    

     
         android:fromXScale="1.0"
    
    
    
    

     
         android:fromYScale="1.0"
    
    
    
    

     
         android:pivotX="50%"
    
    
    
    

     
         android:pivotY="50%"
    
    
    
    

     
         android:toXScale="0.01"
    
    
    
    

     
         android:toYScale="0.01">
    
    
    
    

     
      
    
    
    
    

     
     </scale>
    
    
   
   

         Java调用动画代码如下：

   
   

    
    

     
      ScaleAnimation scaleAnimation = (ScaleAnimation) AnimationUtils.loadAnimation(this,R.anim.scale);
    
    
    
    

     
      scaleAnimation.setDuration(3000);
    
    
    
    

     
      anim_image.startAnimation(scaleAnimation);
    
    
   
   

旋转动画

         旋转动画资源文件如下：

   
   

    
    

     
     <?xml version="1.0" encoding="utf-8"?>
    
    
    
    

     
     <rotate xmlns:android="http://schemas.android.com/apk/res/android"
    
    
    
    

     
         android:fromDegrees="0"
    
    
    
    

     
         android:pivotX="50%"
    
    
    
    

     
         android:pivotY="50%"
    
    
    
    

     
         android:toDegrees="18000">
    
    
    
    

     
      
    
    
    
    

     
     </rotate>
    
    
   
   

         Java调用动画代码如下：

   
   

    
    

     
      RotateAnimation rotateAnimation = (RotateAnimation) AnimationUtils.loadAnimation(this,R.anim.rotate);
    
    
    
    

     
      rotateAnimation.setInterpolator(new LinearInterpolator());
    
    
    
    

     
      rotateAnimation.setDuration(3000);
    
    
    
    

     
      anim_image.startAnimation(rotateAnimation);
    
    
   
   

透明度变化动画

         透明度动画资源文件如下：

   
   

    
    

     
     <?xml version="1.0" encoding="utf-8"?>
    
    
    
    

     
     <alpha xmlns:android="http://schemas.android.com/apk/res/android"
    
    
    
    

     
         android:duration="3000"
    
    
    
    

     
         android:fromAlpha="1.0"
    
    
    
    

     
         android:toAlpha="0.1">
    
    
    
    

     
      
    
    
    
    

     
     </alpha>
    
    
   
   

         Java调用动画代码如下：

   
   

    
    

     
      AlphaAnimation alphaAnimation = (AlphaAnimation) AnimationUtils.loadAnimation(this,R.anim.alpha);
    
    
    
    

     
      alphaAnimation.setFillAfter(true);
    
    
    
    

     
      alphaAnimation.setDuration(3000);
    
    
    
    

     
      anim_image.startAnimation(alphaAnimation);
    
    
   
   

集合动画

         集合动画资源文件如下：

   
   

    
    

     
     <?xml version="1.0" encoding="utf-8"?>
    
    
    
    

     
     <set xmlns:android="http://schemas.android.com/apk/res/android"
    
    
    
    

     
         android:duration="3000"
    
    
    
    

     
         android:interpolator="@android:anim/linear_interpolator">
    
    
    
    

     
      
    
    
    
    

     
         <!--定义缩放变换-->
    
    
    
    

     
         <scale
    
    
    
    

     
             android:fillAfter="true"
    
    
    
    

     
             android:fromXScale="1.0"
    
    
    
    

     
             android:fromYScale="1.0"
    
    
    
    

     
             android:pivotX="50%"
    
    
    
    

     
             android:pivotY="50%"
    
    
    
    

     
             android:toXScale="0.01"
    
    
    
    

     
             android:toYScale="0.01" />
    
    
    
    

     
      
    
    
    
    

     
         <!--定义透明度的变化-->
    
    
    
    

     
         <alpha
    
    
    
    

     
             android:fromAlpha="1"
    
    
    
    

     
             android:toAlpha="0.05" />
    
    
    
    

     
      
    
    
    
    

     
         <!--定义旋转变换-->
    
    
    
    

     
         <rotate
    
    
    
    

     
             android:fromDegrees="0"
    
    
    
    

     
             android:pivotX="50%"
    
    
    
    

     
             android:pivotY="50%"
    
    
    
    

     
             android:toDegrees="1800" />
    
    
    
    

     
      
    
    
    
    

     
     </set>
    
    
   
   

         Java调用动画代码如下：

   
   

    
    

     
      Animation animation = AnimationUtils.loadAnimation(this, R.anim.anim);
    
    
    
    

     
      anim_image.startAnimation(animation);
    
    
   
   

参考资料

• 《疯狂Android讲义》书籍
•  http://blog.csdn.net/airsaid/article/details/51591239#translate属性