Android动画效果（补间动画Tween与帧动画Frame）

最新推荐文章于 2023-02-02 15:20:34 发布

rorntuck7

最新推荐文章于 2023-02-02 15:20:34 发布

阅读量495

点赞数

分类专栏： Andriod

本文链接：https://blog.csdn.net/rorntuck7/article/details/54091326

版权

Andriod 专栏收录该内容

49 篇文章 0 订阅

订阅专栏

Android动画主要包含补间动画（Tween）View Animation、帧动画（Frame）Drawable Animation、以及属性动画Property Animation。下面依次介绍一下各个动画。

1. 补间动画（Tween）

Tween动画，通过对View的内容进行一系列的图形变换 (包括平移、缩放、旋转、改变透明度)来实现动画效果。动画效果的定义可以采用XML来做也可以采用编码来做。Tween动画有4种类型：

动画的类型	Xml定义动画使用的配置节点	编码定义动画使用的类
渐变透明度动画效果	AlphaAnimation
渐变尺寸缩放动画效果	ScaleAnimation
画面位置移动动画效果	TranslateAnimation
画面旋转动画效果	RotateAnimation

我们可以为每一个动画设置动画插入器，Android自带的几种动画插入器：

AccelerateInterpolator	加速，开始时慢中间加速
DecelerateInterpolator	减速，开始时快然后减速
AccelerateDecelerateInterolator	先加速后减速，开始结束时慢，中间加速
AnticipateInterpolator	反向，先向相反方向改变一段再加速播放
AnticipateOvershootInterpolator	反向加超越，先向相反方向改变，再加速播放，会超出目的值然后缓慢移动至目的值
BounceInterpolator	跳跃，快到目的值时值会跳跃，如目的值100，后面的值可能依次为85，77，70，80，90，100
CycleIinterpolator	循环，动画循环一定次数，值的改变为一正弦函数：Math.sin(2* mCycles* Math.PI* input)
LinearInterpolator	线性，线性均匀改变
OvershottInterpolator	超越，最后超出目的值然后缓慢改变到目的值

1.1预备知识：

抽象类Animation是一个实现androidUI界面动画效果的API，Animation是补间动画的基类，它的直接子类AlphaAnimation, RotateAnimation, ScaleAnimation, TranslateAnimation,AnimationSet,提供了一系列的动画效果，可以进行淡入淡出、旋转、缩放、动画集等，这些效果可以应用在绝大多数的控件中。

1.2AlphaAnimation实现淡入淡出的动画效果

//方式一通过代码的方式定义透明度动画

  Animation alphaAnimation=new AlphaAnimation(1, (float) 0.0);
                alphaAnimation.setDuration(1000);//设置动画持续时间为3秒
                alphaAnimation.setFillAfter(true);//设置动画结束后保持当前的位置（即不返回到动画开始前的位置）
                imgShow.startAnimation(alphaAnimation);

//方式二通过在xml中定义透明度动画
第一步：定义xml动画文件：alpha.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.1"
        android:duration="3000"
        android:fillAfter="true"
        android:repeatCount="2">
    </alpha>
</set>

第二步：加载xml动画文件并将其设置到指定的View上

  Animation alphaAnimation2 = AnimationUtils.loadAnimation(MainActivity.this, alphas);//加载Xml文件中的动画
  imgShow.startAnimation(alphaAnimation2);

1.3.RotateAnimation实现旋转的动画效果

主要属性及说明：
repeatCount 重复次数
fromDegrees为动画起始时物件的角度:
当角度为负数——表示逆时针旋转
当角度为正数——表示顺时针旋转
(负数fromDegrees——toDegrees正数:顺时针旋转)
(负数fromDegrees——toDegrees负数:逆时针旋转)
(正数fromDegrees——toDegrees正数:顺时针旋转)
(正数fromDegrees——toDegrees负数:逆时针旋转)
toDegrees属性为动画结束时物件旋转的角度可以大于360度
pivotX,pivotY 为动画相对于物件的X、Y坐标的开始位.说明：以上两个属性值从0%-100%中取值,50%为物件的X或Y方向坐标上的中点位置。
实例：
//方式一通过代码的方式定义旋转动画

     Animation rotateAnimation = new RotateAnimation(0, -180);
     rotateAnimation.setDuration(2000);//设置动画持续时间为3秒
     rotateAnimation.setFillAfter(true);//设置动画结束后保持当前的位置（即不返回到动画开始前的位置）
     imgShow.startAnimation(rotateAnimation);

//方式二通过在xml中定义旋转动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
    android:fromDegrees="0"
    android:toDegrees="45"
    android:duration="3000"
    android:fillAfter="true">
</rotate>
</set>

Animation rotateAnimation2=AnimationUtils.loadAnimation(MainActivity.this, rotates);//加载Xml文件中的动画
imgShow.startAnimation(rotateAnimation2);

1.4.ScaleAnimation实现缩放动画效果

主要属性及说明：
fromXScale（浮点型）属性为动画起始时X坐标上的缩放尺寸
fromYScale（浮点型）属性为动画起始时Y坐标上的缩放尺寸
toXScale（浮点型）属性为动画结束时X坐标上的缩放尺寸
toYScale（浮点型）属性为动画结束时Y坐标上的缩放尺寸
说明: 以上四种属性值
0.0表示收缩到没有
1.0表示正常无缩放
值小于1.0表示收缩
值大于1.0表示放大
pivotX（浮点型）属性为动画相对于物件的X坐标的开始位置
pivotY（浮点型）属性为动画相对于物件的Y坐标的开始位置
说明:
以上两个属性值从0%-100%中取值
50%为物件的X或Y方向坐标上的中点位置
duration（长整型）属性为动画持续时间。说明: 时间以毫秒为单位
fillAfter（布尔型）属性当设置为true，该动画转化在动画结束后被应用
实例：
//方式一通过代码的方式定义缩放动画

 Animation scaleAnimation = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f);
 scaleAnimation.setDuration(2000);//设置动画持续时间为3秒
 scaleAnimation.setFillAfter(true);//设置动画结束后保持当前的位置（即不返回到动画开始前的位置）
 scaleAnimation.setRepeatCount(3);
 imgShow.startAnimation(scaleAnimation);

//方式二通过在xml中定义缩放动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:fromXScale="0.5"
        android:toXScale="1.0"
        android:fromYScale="1.0"
        android:toYScale="1.0"
        android:duration="3000"
        android:fillAfter="true"
    >
    </scale>
</set>

Animation rotateAnimation2=AnimationUtils.loadAnimation(MainActivity.this, scales);//加载Xml文件中的动画
imgShow.startAnimation(rotateAnimation2);

1.5. TranslateAnimation实现位移动画效果

//方式一通过代码的方式定义位移动画

  Animation translateAnimation = new TranslateAnimation(0, 100, 0, 100);
  translateAnimation.setDuration(3000);//设置动画持续时间为3秒
  translateAnimation.setFillAfter(true);//设置动画结束后保持当前的位置（即不返回到动画开始前的位置）
  imgShow.startAnimation(translateAnimation);

第二步：加载xml动画文件并将其设置到指定的View上

 Animation rotateAnimation2=AnimationUtils.loadAnimation(MainActivity.this, translates);//加载Xml文件中的动画
 imgShow.startAnimation(rotateAnimation2);

1.6.AnimationSet实现多种动画混合效果

定义动画集主要用到了AnimationSet类，该类可以添加多个补间动画啊。

//方式一通过代码的方式定义动画集

AnimationSet animationSet=new AnimationSet(true);//定义一个动画集，并设定所有的动画使用一个动画插入其
Animation translateAnimation2=AnimationUtils.loadAnimation(MainActivity.this, translates);//加载Xml文件中的动画
Animation alphaAnimation2=AnimationUtils.loadAnimation(MainActivity.this, alphas );//加载Xml文件中的动画
Animation rotateAnimation2=AnimationUtils.loadAnimation(MainActivity.this, rotates);//加载Xml文件中的动画
Animation scaleAnimation2=AnimationUtils.loadAnimation(MainActivity.this, scales);//加载Xml文件中的动画
animationSet.addAnimation(translateAnimation2);
animationSet.addAnimation(alphaAnimation2);
animationSet.addAnimation(rotateAnimation2);
animationSet.addAnimation(scaleAnimation2);
imgShow.startAnimation(animationSet);

2. 帧动画（Frame）

逐帧动画（Frame-by-frame Animations）从字面上理解就是一帧挨着一帧的播放图片，就像放电影一样。和补间动画一样可以通过xml实现也可以通过java代码实现。

具体实现过程
1.）在res/drawable目录下一个文件framelist.xml，内容如下：

<?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/a01" android:duration="200"/>
    <item android:drawable="@drawable/a02" android:duration="200"/>
    <item android:drawable="@drawable/a03" android:duration="200"/>
    <item android:drawable="@drawable/a04" android:duration="200"/>
    <item android:drawable="@drawable/a05" android:duration="200"/>
    <item android:drawable="@drawable/a06" android:duration="200"/>
    <item android:drawable="@drawable/a07" android:duration="200"/>
    <item android:drawable="@drawable/a08" android:duration="200"/>
    <item android:drawable="@drawable/a09" android:duration="200"/>
</animation-list>

根节点是animation-list（动画列表），里面有一个或者多个item节点组成，oneshot属性表示是否只播放一次，true表示只会播放一次，false表示一直循环播放，内部用item节点声明一个动画帧，android:drawable指定此帧动画所对应的图片资源，android:druation代表此帧持续的时间，整数，单位为毫秒。

注意:

之前使用eclipse或者Android ADT开发的时候，文件可以放在res/anim和res/drawable两个文件夹下面，虽然谷歌推荐放在res/drawable文件夹下但是不会报错，在使用Android studio时候就没那么幸运了，如果不放在res/drawable文件夹下面会报错

2.）用ImageView控件作为动画载体来显示动画

 <ImageView
   android:id="@+id/animation_iv"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_gravity="center"
   android:layout_margin="10dp"
   android:src="@drawable/lottery_animlist" />

这个时候我们运行一下，发现动画没有运行而是停留在第一帧，那是因为AnimationDrawable播放动画是依附在window上面的，而在Activity onCreate方法中调用时Window还未初始化完毕，所有才会停留在第一帧，要想实现播放必须在onWindowFocusChanged中添加如下代码：

public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    imgShow.setImageResource(R.drawable.framelist);
    AnimationDrawable animationDrawable = (AnimationDrawable) imgShow.getDrawable();
    animationDrawable.start();
}

如果想要停止播放动画可以调用AnimationDrawable的stop方法

  imageView.setImageResource(R.drawable.framelist);
  AnimationDrawable animationDrawable = (AnimationDrawable) imageView.getDrawable();
  animationDrawable.stop();

3.)纯Java代码实现方式

AnimationDrawable anim = new AnimationDrawable();
    for (int i = 1; i <= 6; i++) {
    int id = getResources().getIdentifier("lottery_" + i, "drawable", getPackageName());
    Drawable drawable = getResources().getDrawable(id);
    anim.addFrame(drawable, 200);
    }
    anim.setOneShot(false);
    imageView.setImageDrawable(anim);
    anim.start();

4.）AnimationDrawable 几个常见的api

void start() - 开始播放动画
void stop() - 停止播放动画
addFrame(Drawable frame, int duration) - 添加一帧，并设置该帧显示的持续时间
void setOneShoe(boolean flag) - false为循环播放，true为仅播放一次
boolean isRunning() - 是否正在播放