android开发步步为营之13：frame animation实现自动播放和手动播放

游戏开发过程中，动画肯定是需要的，Android动画Animation有两种，一种叫Tween Animation展现渐变效果，比如从大到小，从暗到明，旋转，从一个位置移动到另外一个位置，第二种叫Frame Animation就是电影一帧帧播放的效果，今天我们来学习第二种电影放映效果。第一种下次再介绍，先学习理论。

public class

AnimationDrawable

extends DrawableContainer

implements Animatable Runnable

java.lang.Object

android.graphics.drawable.Drawable

android.graphics.drawable.DrawableContainer

android.graphics.drawable.AnimationDrawable

Class Overview

An object used to create frame-by-frame animations, defined by a series of Drawable objects, which can be used as a View object's background.

The simplest way to create a frame-by-frame animation is to define the animation in an XML file, placed in the res/drawable/ folder, and set it as the background to a View object. Then, call start() to run the animation.

An AnimationDrawable defined in XML consists of a single <animation-list> element, and a series of nested <item> tags. Each item defines a frame of the animation. See the example below.

spin_animation.xml file in res/drawable/ folder:

<!-- Animation frames are wheel0.png -- wheel5.png files inside the

res/drawable/ folder -->

<animation-list android:id="selected" android:oneshot="false">

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

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

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

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

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

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

</animation-list>

Here is the code to load and play this animation.

// Load the ImageView that will host the animation and

// set its background to our AnimationDrawable XML resource.

ImageView img = (ImageView)findViewById(R.id.spinning_wheel_image);

img.setBackgroundResource(R.drawable.spin_animation);

// Get the background, which has been compiled to an AnimationDrawable object.

AnimationDrawable frameAnimation = (AnimationDrawable) img.getBackground();

// Start the animation (looped playback by default).

frameAnimation.start();

好，开始我们的实验，这里实验我最近开发完成的刷卡支付的动画功能。这个动画展现的是从插入刷卡器到刷卡支付。连续的动画图片我就不给出来了。

第一步、res\anim文件夹创建动画xml文件howtousepos.xml

说明： android:oneshot="false"表示允许动画循环，true表示不允许循环，android:duration 表示这一帧的持续时间，单位毫秒

<?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/cha_1"

android:duration="400"/>

<item

android:drawable="@drawable/cha_2"

android:duration="100"/>

<item

android:drawable="@drawable/cha_3"

android:duration="200"/>

<item

android:drawable="@drawable/cha_4"

android:duration="1000"/>

<item

android:drawable="@drawable/shua_1"

android:duration="1000"/>

<item

android:drawable="@drawable/shua_2"

android:duration="100"/>

<item

android:drawable="@drawable/shua_3"

android:duration="100"/>

<item

android:drawable="@drawable/shua_4"

android:duration="100"/>

<item

android:drawable="@drawable/shua_5"

android:duration="100"/>

<item

android:drawable="@drawable/shua_6"

android:duration="100"/>

<item

android:drawable="@drawable/shua_7"

android:duration="300"/>

</animation-list>

第二步、设计页面res\layout\animationtest.xml

<?xml version="1.0" encoding="utf-8"?>

<!-- 手机POS支付 -->

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

>

<ImageView

android:id="@+id/imgAnimation"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentLeft="true"

android:layout_alignParentTop="true"

/>

<Button

android:id="@+id/btnAnimation"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentLeft="true"

android:layout_below="@+id/imgAnimation"

android:text="停止动画" />

</RelativeLayout>

第三步、设计Activity AnimationActivity.java

/**

*

*/

package com.figo.helloworld;

import android.util.Log;

import android.view.View;

import android.view.View.OnClickListener;

import android.app.Activity;

import android.graphics.drawable.AnimationDrawable;

import android.os.AsyncTask;

import android.os.Bundle;

import android.view.ViewTreeObserver.OnPreDrawListener;

import android.view.animation.AlphaAnimation;

import android.view.animation.Animation;

import android.view.animation.RotateAnimation;

import android.view.animation.ScaleAnimation;

import android.view.animation.TranslateAnimation;

import android.widget.Button;

import android.widget.ImageView;

import android.widget.Toast;

/**

* @author zhuzhifei 版权所有

*

*/

public class AnimationActivity extends Activity {

private ImageView imgAnimation;

AnimationDrawable animation;

Button btnAnimation;

private Animation myAnimation_Alpha;

private Animation myAnimation_Scale;

private Animation myAnimation_Translate;

private Animation myAnimation_Rotate;

@Override

protected void onCreate(Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onCreate(savedInstanceState);

setContentView(R.layout.animationtest);

imgAnimation = (ImageView) findViewById(R.id.imgAnimation);

// 设置图片资源

imgAnimation.setImageResource(R.anim.howtousepos);

animation = (AnimationDrawable) imgAnimation.getDrawable();

// 也可以通过设置背景的方法，推荐使用setImageResource，因为使用setBackgroundResource

// 发现第二次的动画速度会加快

// imgAnimation.setBackgroundResource(R.anim.howtousepos);

// animation = (AnimationDrawable) imgAnimation.getBackground();

// 方法一、通过addOnPreDrawListener实现自动执行动画

// imgAnimation.getViewTreeObserver().addOnPreDrawListener(preDrawListener);

// 方法二、通过Runnable实现自动执行动画

imgAnimation.post(new Runnable() {

@Override

public void run() {

animation.start();

}

});

// 方法三、通过按钮点击事件实现手动执行动画

btnAnimation = (Button) findViewById(R.id.btnAnimation);

btnAnimation.setOnClickListener(new OnClickListener() {

public void onClick(View v) {

if (animation != null && animation.isRunning() == true) {

animation.stop();

btnAnimation.setText("开始动画");

} else {

animation.start();

btnAnimation.setText("停止动画");

}

}

});

}

OnPreDrawListener preDrawListener = new OnPreDrawListener() {

@Override

public boolean onPreDraw() {

//animation = (AnimationDrawable) imgAnimation.getDrawable();

animation.start();

return true; // 必须要有这个true返回

}

};

}

第四步、运行效果