Android Animation 动画Demo（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;// 開始动画button
	private Button stopBtn;// 停止动画button
	private ImageView imageView;// 显示图片
	private AnimationDrawable anim;

	@Override
	public 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--与逐帧动画相关的Drawable
		anim = (AnimationDrawable) imageView.getBackground();
		// button事件
		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;// 開始动画button
	private Button stopBtn;// 停止动画button
	private ImageView imageView;// 显示图片
	private AnimationDrawable anim;

	@Override
	protected 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中相应的资源ID
			int 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背景
	}

	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.startButton:

			anim.start();
			break;
		case R.id.stopButton:
			anim.stop();
			break;

		default:
			break;
		}
	}

}

以下提供以上两种实现方式的源码，供读者參考使用：

以xml形式实现逐帧动画的源码：

点击下载源代码

直接以编码的方式实现逐帧动画的源码：

点击下载源代码

版权声明：本文博客原创文章。博客，未经同意，不得转载。