Android中常用的两种动画写法

在Android中常用的两种动画，一种是补间动画(Tween Animation)，另一种是帧动画(Frame Animation)。用一张图片实现的是补间动画；定义给出两个关键帧，通过一些算法将给定属性值在给定的时间内在两个关键帧间渐变是帧动画，一般两种动画的写法如下：

一、补间动画(Tween Animation)

主要分为： 渐变alpha
旋转rotate
平移translate
缩放scale

res/anim/XXXX.xml ---> 根节点<set>

三个要素：起始状态、终止状态、动画时长

一般写法：

1.使用xml文档+Java代码的方式实现

1.新建文件夹res/anim/splash_anim.xml

文档内容事例如下：

下面的set集合节点下仅放了一种动画（渐变动画）可以同时加入多种动画，并加入相关属性

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

2.   在activity_splash.xml布局文件中添加动画容器

<RelativeLayout 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"
    tools:context=".SplashActivity" 
    android:background="@drawable/splash"

    android:id="@+id/rl_splash_animcontainer"
    >
</RelativeLayout>

  RelativeLayout   animContainer;

animContainer = (RelativeLayout) findViewById(R.id.rl_splash_animcontainer);

3.  在onCreate方法中对动画进行初始化，定义方法 initAnim();

private void initAnim() {
Animation anim = AnimationUtils.loadAnimation(this, R.anim.splash_anim);
animContainer.startAnimation(anim);

}

2.纯Java代码实现

1.首先定义一个动画容器，例如res/layout/activity_splash.xml，给该布局添加一个id

示例如下：

<RelativeLayout 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"
    tools:context="com.example.zhihuihn.SplashActivity" 
    android:background="@drawable/splash_bg_newyear"
    android:id="@+id/rl_splash_container">

    <ImageView 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/splash_horse_newyear"/>

</RelativeLayout>

2. 在activity中进行相关的view申明定义，可通过黄油刀，或者findViewById的方式，这里采用黄油刀进行绑定

@Bind(R.id.rl_splash_container)
RelativeLayout animContainer;
3. 在onCreate方法中进行动画的启动（使用黄油刀记得也要在此绑定）

ButterKnife.bind(this);
        startAnim();

实现自定义的startAnim()方法

下面通过Java代码添加了三种动画，注意动画的根节点是AnimationSet集合

private void startAnim() {

AnimationSet set=new AnimationSet(false);//此处为动画集合，传false为不共享动画差补器，每个动画独立

RotateAnimation rotate=new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f,Animation.RELATIVE_TO_SELF, 0.5f);
rotate.setDuration(2000);//动画时间
rotate.setFillAfter(true);//保持动画播放结束后的状态

ScaleAnimation scale=new ScaleAnimation(0, 1, 0, 1, Animation.RELATIVE_TO_SELF, 0.5f,  Animation.RELATIVE_TO_SELF, 0.5f);
scale.setDuration(2000);
scale.setFillAfter(true);

AlphaAnimation alpha=new AlphaAnimation(0, 1);
alpha.setDuration(2000);
alpha.setFillAfter(true);

set.addAnimation(rotate);//将动画分别添加到集合
set.addAnimation(scale);
set.addAnimation(alpha);

animContainer.startAnimation(set);//启动动画

}

二、帧动画(Frame Animation)

写法如下：

1）在res文件夹创建drawable文件夹(我们可以将xml文件放置于drawable或anim目录，官方文档上是放到了drawable中)。在drawable文件夹下用一个xml文件来描述帧动画。根元素为animation-list。根元素中添加item节点，每一个item代表帧动画中的一帧。每一个item中有两个属性：
android:drawable 该帧所显示的图像
android:duration 该帧的时长
例子：
<animation-list  xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/web_loading_1" android:duration="200"/>
    <item android:drawable="@drawable/web_loading_2" android:duration="200"/>
    <item android:drawable="@drawable/web_loading_3" android:duration="200"/>
</animation-list>


2）将写好的帧动画放到ImageView中呈现。默认的时候，此时ImageView中显示的帧动画的第一帧。
3）从ImageView中将帧动画取出。取出时使用getDrawable方法，该方法的返回值为Drawable类型。需要将得到的Drawable对象强转为AnimationDrawable对象后，调用start方法，启动帧动画。

ivLogo = (ImageView) findViewById(R.id.iv_splash_logo);

Drawable d = ivLogo.getDrawable();
((AnimationDrawable)d).start(); 

示例如下：

1. res/drawable/xxx_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/web_loading_1" android:duration="200"/>
    <item android:drawable="@drawable/web_loading_2" android:duration="200"/>
    <item android:drawable="@drawable/web_loading_3" android:duration="200"/>
</animation-list>

2. res/layout/activity_splash.xml

<RelativeLayout 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: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=".SplashActivity" >

    <ImageView 
        android:id="@+id/iv_splash_logo"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_centerInParent="true"
        android:src="@drawable/xxx_anim"
        />  
    
</RelativeLayout>

3. public class SplashActivity extends Activity {
ImageView  ivLogo;

      AnimationDrawable  animDrawable;

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

1.  if (animDrawable.isRunning()) {  
2.                     animDrawable.stop();  
3.                 }else {  
4.                     animDrawable.start();  
5.                 }  

1.  ivLogo = (ImageView) findViewById(R.id.iv_splash_logo);
2.         /** 
3. * ivLogo里面显示帧动画   
4.          * 这里设置的是setBackgroundResource，那么你获取的时候通过getBackground 
5.          */  
6.          ivLogo.setBackgroundResource(R.drawable.xxx_anim);  
7.        animDrawable = (AnimationDrawable)ivLogo.getBackground();  

1.         /** 
2.          * 在xml里面通过src来设置跟在代码里面使用setImageResource获取的时候通过getDrawable 
3.          * 例如：animationIV2.setImageResource(R.anim.load_animation_2);是一样的 
4.  *下面是在xml文档的src不设置资源，通过代码设置资源，再使用getDrawable()方法取出动画
   
5.          */  
6.         ivLogo = (ImageView)findViewById(R.id.iv_splash_logo);  
7. 
   
8.         ivLogo.setImageResource(R.anim.xxx_anim);  
9.        animDrawable = (AnimationDrawable)ivLogo.getDrawable();  
10.      

}

}