Android学习笔记——动画（Animation）

最新推荐文章于 2023-04-18 18:17:54 发布

原创最新推荐文章于 2023-04-18 18:17:54 发布 · 769 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #Animation

android 专栏收录该内容

11 篇文章

订阅专栏

本文深入探讨了Android动画的实现方式与分类，包括补间动画和帧动画的使用方法，通过具体实例展示了如何利用XML和代码实现渐变、缩放、旋转等动画效果，同时介绍了动画的通用属性与插值器的概念。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、Android动画简介。

Amination动画是一个android UI界面动画效果的API，可以实现淡入淡出，缩放，旋转，平移等效果。这些效果可以用在绝大多数的控件中。

二、Android动画分类。

Animation动画一般来说可以分为两类：补间动画，帧动画。

1、补间动画（Tweened Animation）

补间动画提供了4种效果：

名称	解释
Alpha	渐变
Scale	缩放
Rotate	旋转
Translate	平移

一个View 可以设置多个动画效果，既可以同时设置，也可以让这些动画效果有一个先后顺序。

2、帧动画（Frame-to-Frame Animation）

帧动画可以创建一个drawable 的序列，按照一定的规则逐个播放这些drawable.

三、具体实现步骤

1、Tweened Animation

Tweeted Animation 可以用两种方式来实现：

1.用XML的方式实现。
2.用代码方式实现

1）.用XML的方式实现：

XML方式实现是一种相对简单快捷且清晰明了的方式，通常来说写动画都推荐使用这种方式。
引用方式：

ImageView imageView = (ImageView)findViewById(R.id.image);
Animation aim = AnimationUtils.loadAnimation(this, R.anim.first_anim);
imageView.startAnimation(aim);

XML定义的动画放在/res/anim/文件夹内，XML文件的根元素可以为 < alpha > , < scale >,< translate >,< rotate >,interpolator 元素或< set >(表示以上几个动画的集合，set内可以嵌套其他的标签)。
默认情况下，所有动画是同时进行的，可以通过startOffset属性设置各个动画的开始偏移（开始时间）来达到动画顺序播放的效果。

例1：实现一个渐变动画：
/**
* 本例对一个TextView： mTvTest1实现了一个渐变动画：mTvTest1的文字从完全不透明经过500毫秒的时间变成完全透明，然后再慢慢变回回到完全不透明的状态，重复10次。
* 其中：
* fromeAlpha 表示的是开始时的透明度，1表示完全不透明，0表示完全透明
* toAlpha 表示的是结束时的透明度 ,1表示完全不透明，0表示完全透明
* repeatMode表示重复的方式，重复的方式有两种，一种是reverse，表示倒序回放，一种是restart，表示重复播放。repeatMode必须和repeatCount在一起使用才有意义。
* repeatCount表示重复的次数，
* duration 表示从开始透明度到结束透明度所经历的时间。
* fillBefore 值为true时表示动画结束后回到动画之前的状态。
* fillAfter 值为true时表示动画结束后保持动画结束之后的状态。
*/

文件1：first_anim.xml（位于res/anim/first_anim.xml，如果res下没有anim这个文件夹，新建一个。）

< ?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.0"  
    android:repeatMode="reverse"
    android:repeatCount = "10"
    android:fillBefore="true"  
    android:duration="500"  />   
< /set>

文件：MainActivity.java

package test.abby.com.animtest;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TextView;

    public class MainActivity extends AppCompatActivity {

private TextView mTvTest1;
private TextView mTvTest2;
private TextView mTvTest3;
private TextView mTvTest4;

@Override
protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        bindView();
        initAnimation();
    }

    private void bindView(){
        mTvTest1 = (TextView) findViewById(R.id.text1);
        mTvTest2 = (TextView) findViewById(R.id.text2);
        mTvTest3 = (TextView) findViewById(R.id.text3);
        mTvTest4 = (TextView) findViewById(R.id.text4);
    }

    private void initAnimation(){
        Animation anim = AnimationUtils.loadAnimation(this,R.anim.first_anim);
        mTvTest1.setAnimation(anim);
    }

}

文件三：activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="test.abby.com.animtest.MainActivity">

<TextView
    android:id="@+id/text1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!" />

<TextView
    android:id="@+id/text2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!" />


<TextView
    android:id="@+id/text3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!" />


<TextView
    android:id="@+id/text4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello World!" />
</LinearLayout>

例2，实现一个缩放动画：

/**
* scale标签是缩放动画，可以实现动态调控件尺寸的效果，有下面几个属性：
* android:fromXScale 起始的X方向上相对自身的缩放比例，浮点值，比如1.0代表自身无变化，0.5代表起始时缩小一倍，2.0代表放大一倍；
* android:toXScale 结尾的X方向上相对自身的缩放比例，浮点值；
* android:fromYScale 起始的Y方向上相对自身的缩放比例，浮点值，
* android:toYScale 结尾的Y方向上相对自身的缩放比例，浮点值；
* android:pivotX 缩放起点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p，当为数值时，表示在当前View的左上角，即原点处加上50px，做为起始缩放点；如果是50%，表示在当前控件的左上角加上自己宽度的50%做为起始点；如果是50%p，那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标。（具体意义，后面会举例演示）
android:pivotY 缩放起点Y轴坐标，取值及意义和pivotX一样。
* 本例在上例的基础上，对mTvTest2实现了一个缩放动画，最终动画的效果为：mTvTest2用2000毫秒的时间，以自己的中心为放大中心，将自己扩大3倍，并且保持放大之后的样子。
**/

文件1：MainActivity.java(基本和上例一样，只有initAnimation()方法有些改动)

    private void initAnimation(){
    Animation anim = AnimationUtils.loadAnimation(this,R.anim.first_anim);
    mTvTest1.setAnimation(anim);

    Animation anim2 = AnimationUtils.loadAnimation(this,R.anim.scale_anim);
    mTvTest2.setAnimation(anim2);
}

文件2：scale_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
    android:fromXScale="1"
    android:fromYScale="1"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="3.0"
    android:toYScale="3.0"
    android:duration = "2000"
    android:fillAfter="true"/>
</set>

例3.实现一个旋转动画：

/**
*本例在例2的基础上对mTvTest3实现了一个旋转动画。具体动画效果为：
* pivotX 和 pivotY
**/

文件1. rotate_anim.xml

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

<rotate
    android:duration="2000"
    android:pivotY="50%"
    android:pivotX="50%"
    android:fromDegrees="90"
    android:toDegrees="-90"/>
</set>

文件2：MainActivity.java（和上例基本一致，仅对initAnimation做改动）

private void initAnimation(){
    Animation anim = AnimationUtils.loadAnimation(this,R.anim.first_anim);
    mTvTest1.setAnimation(anim);

    Animation anim2 = AnimationUtils.loadAnimation(this,R.anim.scale_anim);
    mTvTest2.setAnimation(anim2);

    Animation anim3 = AnimationUtils.loadAnimation(this,R.anim.rotate_anim);
    mTvTest3.setAnimation(anim3);
}

下面这些是几个动画都通用的属性：

android:duration        动画持续时间，以毫秒为单位 

android:fillAfter          如果设置为true，控件动画结束时，将保持动画最后时的状态

android:fillBefore       如果设置为true,控件动画结束时，还原到开始动画前的状态

android:repeatCount 重复次数，0表示不重复，1表示重复一次，infinite表示无限循环。

android:repeatMode  重复类型，有reverse和restart两个值，reverse表示倒序回放，restart表示重新放一遍，必须与repeatCount一起使用才能看到效果。

android:interpolator  设定插值器，其实就是指定的动作效果，比如弹跳效果等，具体的看下面的表格。

名称（interpolator）	解释
AccelerateDecelerateInterpolator	在动画开始与介绍的地方速率改变比较慢，在中间的时候加速
AccelerateInterpolator	在动画开始的地方速率改变比较慢，然后开始加速
AnticipateInterpolator	开始的时候向后然后向前甩
AnticipateOvershootInterpolator	开始的时候向后然后向前甩一定值后返回最后的值
BounceInterpolator	动画结束的时候弹起
CycleInterpolator	动画循环播放特定的次数，速率改变沿着正弦曲线
DecelerateInterpolator	在动画开始的地方快然后慢
LinearInterpolator	以常量速率改变
OvershootInterpolator	向前甩一定值后再回到原来位置

2）.用代码方式实现：

Tweened Animation 代码实现步骤主要包括以下几个:

创建一个AnimationSet对象（Animation子类）；
创建相应的Animation对象；
为Animation对象设置相应的数据；
将Animatin对象添加到AnimationSet对象当中；
使用控件对象开始执行AnimationSet；

创建AnimationSet有两种方式：
Android Developers中是这样写的：

AnimationSet(Context context, AttributeSet attrs)
//Constructor used when an AnimationSet is loaded from a resource.

AnimationSet(boolean shareInterpolator)
//Constructor to use when building an AnimationSet from code

***************** 未完待续 ****************