Android逐幀動畫

逐幀動畫簡單介紹：

逐幀動畫【Frame Animation】，即順序播放事先做好的圖像，跟電影類似 ，也叫Drawable Animation動畫，是最簡單最直觀動畫類型。有兩種實現方式。

逐幀動畫XML資源文件方式

這個是最常用的方式，在res/drawable目錄下新建動畫XML文件，如下所示 

一、在res/drawable文件夾下新建animation-list的XML實現幀動畫

1、首先在res/drawable文件夾下添加img00-img24共25張圖片

2、新建frame_anim.xml

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

    <!-- animation-list 幀動畫 -->
    <!-- android:oneshot的值爲 false代表播放多次，true代表只播放一次 -->
    <!-- duration代表每張圖片的播放時間 ,定義一個持續時間爲50毫秒的動畫幀 -->

    <item
        android:drawable="@mipmap/img00"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img01"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img02"
        android:duration="50" />
    <item
        android:drawable="@mipmap/img03"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img04"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img05"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img06"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img07"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img08"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img09"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img10"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img11"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img12"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img13"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img14"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img15"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img16"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img17"
        android:duration="50" />
    <item
        android:drawable="@mipmap/img18"
        android:duration="50" />
    <item
        android:drawable="@mipmap/img19"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img20"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img21"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img22"
        android:duration="50" />
    <item
        android:drawable="@mipmap/img23"
        android:duration="50" />

    <item
        android:drawable="@mipmap/img24"
        android:duration="50" />
</animation-list>

3、在activity_main.xml中添加控件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.startimes.animation.MainActivity">

    <ImageView
        android:id="@+id/mImageView"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_gravity="center"
        android:layout_marginTop="20dp" />


    <Button
        android:id="@+id/startButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Start" />

    <Button
        android:id="@+id/stopButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Stop" />
</LinearLayout>

4、在代碼中獲取並開啓幀動畫

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private ImageView mImageView;
    private Button startButton;
    private Button stopButton;
    private AnimationDrawable animationDrawable;

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

        mImageView = (ImageView) findViewById(R.id.mImageView);
        startButton = (Button) findViewById(R.id.startButton);
        stopButton = (Button) findViewById(R.id.stopButton);

        startButton.setOnClickListener(this);
        stopButton.setOnClickListener(this);
        XMLStartFrameAnimation();
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.startButton:
                if (animationDrawable!=null){
                    animationDrawable.start();
                }
                break;

            case R.id.stopButton:
                if (animationDrawable!=null&&animationDrawable.isRunning()){
                    animationDrawable.stop();
                }
                break;

            default:
                break;
        }
    }


    public void XMLStartFrameAnimation(){
        animationDrawable = (AnimationDrawable) getResources().getDrawable(R.drawable.animation_list);
        mImageView.setBackground(animationDrawable);
    }
}

二、通過代碼實現幀動畫

public void startCodeFrameAnimation(){
    animationDrawable = new AnimationDrawable();
    // 爲AnimationDrawable添加動畫幀
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img00), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img01), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img02), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img03), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img04), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img05), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img06), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img07), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img08), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img09), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img10), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img11), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img12), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img13), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img14), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img15), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img16), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img17), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img18), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img19), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img20), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img21), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img22), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img23), 50);
    animationDrawable.addFrame(
            getResources().getDrawable(R.mipmap.img24), 50);
    // 設置爲循環播放
    animationDrawable.setOneShot(false);
    mImageView.setBackground(animationDrawable);
}