Android--逐帧动画

逐帧动画是一种常见的动画形式，原理就是在“连续的关键帧”中分解动画制作，使其连续播放而成动画。

废话说太多不好，还是直接上代码吧。

第一步：在res/drawable下添加图片资源

第二步：在res/drawable下新建xml文件，位置不要弄错了。

这里新建了两个动画布局文件，分别为animation，animation2具体代码如下

animation为按正序播放动画

<?xml version="1.0" encoding="utf-8"?>
<!--
    根标签为animation-list
    其中oneshot设置为true代表动画只播放一遍，设置为false会循环播放动画
    通过item标签对来声明动画中的图片资源
    android:duration 表示展示所用的该图片的时间长度
 -->
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false" >
    <item
        android:drawable="@drawable/pika1"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika2"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika3"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika4"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika5"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika6"
        android:duration="100" />
</animation-list>

animation2为倒序播放动画（其实就是item中的图片资源倒序排列而已）

<?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/pika6"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika5"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika4"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika3"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika2"
        android:duration="100" />
    <item
        android:drawable="@drawable/pika1"
        android:duration="100" />
</animation-list>

第三步：将动画布局文件赋给主页面布局文件中的图片控件（一切从简）

<?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"
    tools:context="com.example.thinkpad.animation.MainActivity">

    <ImageView android:id="@+id/animationIV"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:padding="5px"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/animation"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="50dp">
        <Button android:id="@+id/buttonA"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5px"
            android:text="顺序显示"
            android:layout_marginLeft="10dp"/>

        <Button android:id="@+id/buttonB"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5px"
            android:text="停止"
            android:layout_marginLeft="50dp"/>

        <Button android:id="@+id/buttonC"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5px"
            android:text="倒序显示"
            android:layout_marginLeft="50dp"/>
    </LinearLayout>

</LinearLayout>

第四步：主Activity中调用动画

public class MainActivity extends Activity {

    private ImageView animationIV;
    private Button buttonA,buttonB,buttonC;
    private AnimationDrawable animationDrawable;

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

    private void init() {
        animationIV = (ImageView) findViewById(R.id.animationIV);
        buttonA = (Button) findViewById(R.id.buttonA);
        buttonB = (Button) findViewById(R.id.buttonB);
        buttonC = (Button) findViewById(R.id.buttonC);
        buttonA.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                animationIV.setImageResource(R.drawable.animation);
                animationDrawable = (AnimationDrawable)animationIV.getDrawable();
                animationDrawable.start();
            }
        });
        buttonB.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                animationDrawable = (AnimationDrawable) animationIV.getDrawable();
                animationDrawable.stop();
            }

        });

        buttonC.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                animationIV.setImageResource(R.drawable.animation2);
                animationDrawable = (AnimationDrawable) animationIV.getDrawable();
                animationDrawable.start();
            }
        });
    }