Android动画之帧动画和补间动画

Android系统提供三种动画：帧动画、补间动画和属性动画。这里先分析总结帧动画和补间动画。

FrameAnimation

帧动画，通俗来说就是按照图片动作顺序依次播放来形成动画，创建帧动画可以用 xml 定义，也可直接使用代码创建。

应用场景：较为复杂的个性化动画效果。使用时一定要避免使用尺寸较大的图片，否则会引起OOM。

1.在 res/drawable 文件夹下创建一个 drawable 文件，使用 animation-list 标签：

<?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/pic_1"
        android:duration="100" />
    <item
        android:drawable="@drawable/pic_2"
        android:duration="100" />
    <item
        android:drawable="@drawable/pic_3"
        android:duration="100" />
</animation-list>

然后在 Activity 中使用获取该 drawable 文件对应的 AnimationDrawable

//获取Frame动画文件对应的AnimationDrawable
mAnimationDrawable = (AnimationDrawable) getResources().getDrawable(R.drawable.frame_animator);
//设置AnimationDrawable为图片的背景
imageView.setBackground(mAnimationDrawable);

//开启动画
mAnimationDrawable.start();
//停止动画
mAnimationDrawable.stop();

2.代码创建帧动画

//代码创建Frame动画
AnimationDrawable mAnimationDrawable = new AnimationDrawable();
//设置动画循环播放，true为动画只播放一次
mAnimationDrawable.setOneShot(false);
mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.pic_1),100);
mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.pic_2),100);
mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.pic_3),100);

imageView.setBackground(mAnimationDrawable);

//开启
mAnimationDrawable.start();
//停止
mAnimationDrawable.stop();

TweenAnimation

补间动画，主要有以下几种：

位移动画(Translation)

缩放动画(Scale)

旋转动画(Rotate)

透明度动画(Alpha)

组合动画

不同的补间动画有各自特有的属性，以位移动画为例：

1.在 res/anim 下创建一个xml文件 translation_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1200"
    android:startOffset ="0"
    android:fillBefore = "true"
    android:fillAfter = "false"
    android:fillEnabled= "false"
    android:repeatMode = "reverse"
    android:repeatCount = "5"
    android:interpolator = "@android:anim/accelerate_interpolator"

    <!--水平方向动画开始的位置-->
    android:fromXDelta="0"
    <!--垂直方向动画开始的位置-->
    android:fromYDelta="0"
    <!--水平方向动画结束的位置-->
    android:toXDelta="100"
    <!--垂直方向动画结束的位置-->
    android:toYDelta="100">
    

然后在 Activity 中获取该 xml 文件对应的 TranslateAnimation，将其设置到想要设置位移动画的 View 上

private void translation(){
    //获取在anim下定义的动画文件
    TranslateAnimation translateAnimation = (TranslateAnimation) AnimationUtils.loadAnimation(this, R.anim.translation_anim);
    //设置并开启动画
    ivImage.startAnimation(translateAnimation);    
}

2.代码中创建位移动画，使用 Animation 的子类 TranslateAnimation

//代码创建位移动画
private void translation(){
    //表示相对View自身原点(View左上角)像素偏移量
    TranslateAnimation translateAnimation = new TranslateAnimation(0,100,0,100);
    //设置动画持续时间
    translateAnimation.setDuration(1200);
    //设置动画重复模式
    translateAnimation.setRepeatMode(Animation.REVERSE);
    //设置动画重复次数
    translateAnimation.setRepeatCount(3);
    translateAnimation.setFillAfter(true);
    //设置动画插值器
    translateAnimation.setInterpolator(this,android.R.anim.accelerate_interpolator);
    //translateAnimation.setInterpolator(new AccelerateInterpolator());
    
    ivImage.startAnimation(translateAnimation);    
}

组合动画使用 AnimationSet 来实现，可使用 xml 定义组合动画，也可以使用代码创建组合动画。

1.在 res/anim 下创建一个 xml 文件 combine_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1200">

    <!--透明度动画-->
    <alpha
        android:repeatMode="reverse"
        android:repeatCount="10"
        android:fromAlpha="1"
        android:toAlpha="0.5" />

    <!--旋转动画-->
    <rotate
        android:repeatMode="reverse"
        android:repeatCount="10"
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="360" />

    <!--缩放动画-->
    <scale
        android:repeatMode="reverse"
        android:repeatCount="10"
        android:fromXScale="1"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="2"
        android:toYScale="2" />
</set>

然后在 Activity 中获取该 xml 文件对应的 AnimationSet，将其设置到想要设置动画的 View 上

private void combine(){
    AnimationSet animationSet = (AnimationSet) AnimationUtils.loadAnimation(this,R.anim.combine_anim);
    ivImage.startAnimation(animationSet);
}

2.代码创建组合动画，使用 Animation 的子类 AnimationSet 创建 AnimationSet 对象，将要组合的动画按序添加到 AnimationSet 中

//代码创建组合动画
private void combine(){
    AnimationSet animationSet = new AnimationSet(true);
    AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f,0.5f);
    alphaAnimation.setRepeatMode(Animation.REVERSE);
    alphaAnimation.setRepeatCount(3);
    RotateAnimation rotateAnimation = new RotateAnimation(0,360,
            Animation.RELATIVE_TO_SELF,0.5f,
            Animation.RELATIVE_TO_SELF,0.5f);
    rotateAnimation.setRepeatMode(Animation.REVERSE);
    rotateAnimation.setRepeatCount(3);
    ScaleAnimation scaleAnimation = new ScaleAnimation(1,2,1,2,
            Animation.RELATIVE_TO_SELF,0.5f,
            Animation.RELATIVE_TO_SELF,0.5f);
    scaleAnimation.setRepeatMode(Animation.REVERSE);
    scaleAnimation.setRepeatCount(3);

    animationSet.addAnimation(alphaAnimation);
    animationSet.addAnimation(rotateAnimation);
    animationSet.addAnimation(scaleAnimation);

    animationSet.setDuration(1200);
    ivImage.startAnimation(animationSet);
}