Android动画浅析

前言

在应用的开发中，动画是必不可少的一部分，否则很多视觉效果会显得特别突兀。今天我们就来了解一下Android中的动画库。

动画的分类

Android平台为我们提供了两类动画，Tween（补间动画）动画和Frame（帧）动画。Tween动画是通过对场景中的对象不断进行图像变换（平移、缩放、旋转等）来产生动画效果的；Frame动画则是顺序播放事先做好的每帧图像，类似于快速的幻灯片一样。

补间动画

Alpha：透明度动画

  AlphaAnimation alphaAnimation = new AlphaAnimation(0.3f, 1.0f) ;
        alphaAnimation.setDuration(1000);

<?xml version="1.0" encoding="utf-8"?>  
    <!-- 透明度 -->  
    <alpha  xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromAlpha="1"  
        android:toAlpha="0"   
        android:duration="1000"  
        />  

Scale：缩放动画

        ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f, 0.5f, 1.0f, 0.5f,0.5f, 0.5f);
        scaleAnimation.setDuration(1000);

<?xml version="1.0" encoding="utf-8"?>  
 
    <!-- 缩放 -->  
    <scale  xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromXScale="1"   
        android:fromYScale="1"   
        android:toXScale="0.5"   
        android:toYScale="0.5"   
        android:pivotX="0.5"  
        android:pivotY="0.5"  
        android:duration="3000"   
        /> 

Translate：位移动画

        TranslateAnimation translateAnimation = new TranslateAnimation(0, 100, 0, 100) ;
        translateAnimation.setDuration(1000);

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

 <!-- 移动 -->  
    <translate   xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromXDelta="0"  
        android:fromYDelta="0"  
        android:toXDelta="100"  
        android:toYDelta="100"   
        android:duration="000"   
        />  

Rotate：旋转动画

  RotateAnimation rotateAnimation = new RotateAnimation(0, 360) ;
        rotateAnimation.setDuration(1000);

<?xml version="1.0" encoding="utf-8"?>  
    <!-- 旋转 -->  
    <rotate  xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromDegrees="0"  
        android:toDegrees="360"  
        android:pivotX="50%"  
        android:pivotY="50%"   
        android:duration="1000"   
        /> 

帧动画

帧动画可以想象为一部很短的电影，他由数量有限的关键帧组成，当这个帧动画时这些关键帧快速的切换，从而达到动画的效果。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">
    <item android:drawable="@drawable/p1" android:duration="200" />
    <item android:drawable="@drawable/p2" android:duration="200" />
    <item android:drawable="@drawable/p3" android:duration="200" />
    <item android:drawable="@drawable/p4" android:duration="200" />
    <item android:drawable="@drawable/p5" android:duration="200" />
    <item android:drawable="@drawable/p6" android:duration="200" />
    <item android:drawable="@drawable/p7" android:duration="800" />
    <item android:drawable="@drawable/p8" android:duration="200" />
    <item android:drawable="@drawable/p9" android:duration="200" />
    <item android:drawable="@drawable/p10" android:duration="200" />
    <item android:drawable="@drawable/p11" android:duration="200" />
</animation-list>

 // 通过逐帧动画的资源文件获得AnimationDrawable示例    
AnimationDrawable frameAnim = (AnimationDrawable) getResources().getDrawable(R.drawable.my_frame_anim);
// 把AnimationDrawable设置为myView的背景
myView.setBackgroundDrawable(frameAnim);

动画的插值器(Interpolator)

在补间动画中，我们一般只定义首帧和尾帧，然后由系统自动生成中间帧，生成中间帧的这个过程可以成为“插值”。插值器的作用是告诉动画某个属性（比如颜色的渐变）如何随时间变化 ，在duration周期内每个时刻对应的属性值。下面是几种常见的插值器：

android 系统默认支持AccelerateDecelerateInterpolator 、 AccelerateInterpolator 、 AnticipateInterpolator 、AnticipateOverShootInterpolator 、 BounceInterpolator 、 CycleInterpolator 、DecelerateInerpolator 、 LinearInterpolator 、 OverShootInterpolator 共 9 种插值器（若这些插值器不能满足需求，则可以自定义插值器）。

例如，一个alpha动画在一秒内从0.0f到1.0f变换，线性插值器的动画为匀速执行的。但是加速插值器的动画会随着时间的增加而越来越快。

插值器通过getInterpolation方法获得插值因子，插值因子的计算也在此函数中完成。例如线性插值器，它的动画则是匀速运动的，因此在它的getInterpolation函数中插值因子只跟时间相关，与其他因素无关。getInterpolation(int inpput)函数中的参数即动画执行的百分比，也可以认为是动画已经执行时间和动画周期的百分比。该值为0.0f 到 1.0f，即动画的开始到结束。

/**
 * An interpolator where the rate of change is constant
 *
 */
public class LinearInterpolator implements Interpolator {

    public LinearInterpolator() {
    }
    
    public LinearInterpolator(Context context, AttributeSet attrs) {
    }
    
    public float getInterpolation(float input) {
        return input;
    }
}

    public float getInterpolation(float input) {
        if (mFactor == 1.0f) {
            return input * input;
        } else {
            return (float)Math.pow(input, mDoubleFactor);
        }
    }

使用矩阵Matrix自定义动画

自定义动画时，我们主要就是覆写applyTransformation(float interpolatedTime, Transformation t) 方法，在方法是在动画执行时就是调用该方法来实现动画操作，我们在这里需要实现修改alpha, 缩放，平移等动画。interpolatedTime是由插值器计算出来的因子，由动画的执行百分比与插值器的策略计算而来，值为0.0f 到 1.0f。参数t为矩阵变换的封装类。在这里我们只讨论使用矩阵实现的自定义动画。例如，我们需要定制一个动画，是它能够在低于API 11 版本的系统里实现Y轴的旋转动画，android中的RorateAnimation动画只支持在Z轴上的旋转动画，这是我们就可以通过矩阵来实现。关于矩阵的资料，请移步，Android中图像变换Matrix的原理、代码验证和应用(一)，Android Matrix理论与应用详解，Android--Matrix图片变换处理。

/**
 * @author mrsimple
 */
public class RotateYAnimation extends Animation {

    private int halfWidth;

    private int halfHeight;
    // 使用Camera实现3D旋转
    Camera mCamera = new Camera();
    // 
    protected float mRotateY = 0.0f;

    /**
     * width，height为执行该动画的view的宽度、高度。后面两个参数为执行该动画的view的parent的宽度、高度
     */
    @Override
    public void initialize(int width, int height, int parentWidth,
            int parentHeight) {

        super.initialize(width, height, parentWidth, parentHeight);
        setDuration(2000);
        setFillAfter(true);

        halfWidth = width / 2;
        halfHeight = height / 2;
        setInterpolator(new LinearInterpolator());
    }

    // 设置旋转角度
    public void setRotateY(float rorateY) {
        mRotateY = rorateY;
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {

        final Matrix matrix = t.getMatrix();
        mCamera.save();
        // 使用Camera设置旋转的角度
        mCamera.rotateY(mRotateY * interpolatedTime);
        // 将旋转变换应用到matrix上
        mCamera.getMatrix(matrix);
        mCamera.restore();
        
        // 在变换前，将动画的中心点从默认的(0,0)移动(0, -halfHeight)
        matrix.preTranslate(0, -halfHeight);
        // 变换后再从(-halfWidth, -halfHeight)移动halfWidth,halfHeight，使之再次回到(0,0)
        matrix.postTranslate(0, halfHeight);

        // View view;
    }
}

               Button btn = new Button(MainActivity.this) ;
                btn.setText("RotateY");
                MyAnimation animation = new MyAnimation();
                animation.setRotateY(45f);
                animation.setDuration(2000);
		// 启动动画
                btn.startAnimation(animation);