Android Animation 動畫Demo（Frame逐幀動畫）

標籤：android   動畫   frame逐幀動畫   

上一篇介紹了Animation動畫其一：Tween補間動畫。

這篇文章接下來介紹Animation另一種動畫形式：Frame逐幀動畫。

Frame動畫是一系列圖片按照一定的順序展示的過程，和放電影的機制很相似，我們稱為逐幀動畫。Frame動畫可以被定義在XML檔案中，也可以完全編碼實現(後面會給出這兩種實現方式的原始碼Demo)。

下面分別介紹：

一、定義在xml中實現：

實現：

原始碼：

布局檔案：main.xml:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:background="#ffffff"    android:orientation="vertical" >    <TextView        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="10dp"        android:gravity="center_horizontal"        android:text="以xml檔案的形式實現Frame動畫"        android:textColor="#000000"        android:textSize="20sp" />    <ImageView        android:id="@+id/image"        android:layout_width="match_parent"        android:layout_height="300dp"        android:layout_marginBottom="5dp"        android:layout_marginLeft="5dp"        android:layout_marginRight="5dp"        android:layout_marginTop="5dp" />    <Button        android:id="@+id/startButton"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="播放逐幀動畫"        android:textColor="#000000" />    <Button        android:id="@+id/stopButton"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="停止逐幀動畫"        android:textColor="#000000" /></LinearLayout>

frame.xml:

<?xml version="1.0" encoding="UTF-8"?><animation-list xmlns:android="http://schemas.android.com/apk/res/android" > <!-- android:oneshot如果定義為true的話，此動畫只會執行一次，如果為false則一直迴圈。 -->    android:oneshot="false" >    <!-- 指定每一幀是使用的圖片,及播放時間 -->    <item        android:drawable="@drawable/f1"        android:duration="500">    </item>    <item        android:drawable="@drawable/f2"        android:duration="500">    </item>    <item        android:drawable="@drawable/f3"        android:duration="500">    </item></animation-list>

FrameDemoActivity:

package com.zhy.com;import android.app.Activity;import android.graphics.drawable.AnimationDrawable;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;import android.widget.ImageView;/** *  逐幀動畫Frame動畫執行個體 *  */public class FrameDemoActivity extends Activity {private Button startBtn;// 開始動畫按鈕private Button stopBtn;// 停止動畫按鈕private ImageView imageView;// 顯示圖片private AnimationDrawable anim;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.main);// 執行個體化控制項startBtn = (Button) findViewById(R.id.startButton);stopBtn = (Button) findViewById(R.id.stopButton);imageView = (ImageView) findViewById(R.id.image);// 指定動畫的幀的列表imageView.setBackgroundResource(R.anim.frame);// AnimationDrawable--與逐幀動畫相關的Drawableanim = (AnimationDrawable) imageView.getBackground();// 按鈕事件startBtn.setOnClickListener(new OnClickListener() {public void onClick(View v) {// 開始動畫anim.start();}});stopBtn.setOnClickListener(new OnClickListener() {public void onClick(View v) {anim.stop();// 停止播放}});}}

二、直接代碼編碼的形式實現：

實現：

原始碼：

布局檔案：

activity_main:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:background="#ffffff"    android:orientation="vertical" >    <TextView        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="10dp"        android:gravity="center_horizontal"        android:text="在代碼中直接編碼的形式實現Frame動畫"        android:textColor="#000000"        android:textSize="20sp" />    <ImageView        android:id="@+id/image"        android:layout_width="match_parent"        android:layout_height="300dp"        android:layout_marginBottom="5dp"        android:layout_marginLeft="5dp"        android:layout_marginRight="5dp"        android:layout_marginTop="5dp" />    <Button        android:id="@+id/startButton"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="播放逐幀動畫"        android:textColor="#000000" />    <Button        android:id="@+id/stopButton"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="停止逐幀動畫"        android:textColor="#000000" /></LinearLayout>

MainActivity:

package com.framedemo2;import android.app.Activity;import android.graphics.drawable.AnimationDrawable;import android.graphics.drawable.Drawable;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;import android.widget.ImageView;public class MainActivity extends Activity implements OnClickListener {private Button startBtn;// 開始動畫按鈕private Button stopBtn;// 停止動畫按鈕private ImageView imageView;// 顯示圖片private AnimationDrawable anim;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);// 執行個體化控制項startBtn = (Button) findViewById(R.id.startButton);stopBtn = (Button) findViewById(R.id.stopButton);imageView = (ImageView) findViewById(R.id.image);anim = new AnimationDrawable();startBtn.setOnClickListener(this);stopBtn.setOnClickListener(this);for (int i = 1; i <= 3; i++) {// 根據資源名稱和目錄擷取R.java中對應的資源IDint id = getResources().getIdentifier("f" + i, "drawable",getPackageName());// 根據資源ID擷取到Drawable對象Drawable drawable = getResources().getDrawable(id);// 將此幀添加到AnimationDrawable中anim.addFrame(drawable, 300);}anim.setOneShot(false); // 如果設定為false，則只會播放一次，不會迴圈播放。 imageView.setBackgroundDrawable(anim); // 將動畫設定為ImageView背景}@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.startButton:anim.start();break;case R.id.stopButton:anim.stop();break;default:break;}}}

下面提供以上兩種實現方式的原始碼，供讀者參考使用：

以xml形式實現逐幀動畫的原始碼：

點擊下載源碼

直接以編碼的方式實現逐幀動畫的原始碼：

點擊下載源碼