【Frame Animation 逐帧动画】

  1、  本文要完成的任务有：

多张连续图片组成常见的动画效果（暂时有5种）

按钮控制动画的播放与停止

  2、 效果展示图如下：

  3、 任务具体实现：

1--->首先我们要准备一系列连续的图片，选择其中一组图片如下：

    

   

2--->需要在res/drawable目录下新建一个名为frame_animation_02.xml文件，内容如下：

<span style="font-family:Comic Sans MS;font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false" >

    <!--
    	根标签为animation-list，其中oneshot代表着是否只展示一遍，设置为false会不停的循环播放动画  
    	根标签下，通过item标签对动画中的每一个图片进行声明  
    	android:duration 表示展示所用的该图片的时长，单位是毫秒
    -->

    <item
        android:drawable="@drawable/loading_f03"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f04"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f05"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f06"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f07"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f08"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f09"
        android:duration="100"/>
    <item
        android:drawable="@drawable/loading_f10"
        android:duration="100"/>

</animation-list></span>

3--->在布局文件中加入一个IamgeView图片控件用来显示动画，不加任何代码，动画会自动播放，如下：

<span style="font-family:Comic Sans MS;font-size:18px;">    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/frame_animation_02"
        android:layout_marginTop="100dp"
        android:layout_centerHorizontal="true"/></span>

4--->如果我们想在代码中控制动画的播放与停止，就需要一个特别的类型AnimationDrawable，播放与停止代码如下：

<span style="font-family:Comic Sans MS;font-size:18px;">	//播放动画
	private void playAnimation(){
		AnimationDrawable animationDrawable = (AnimationDrawable) imageView.getDrawable();
		animationDrawable.start();
	}
	
	//停止动画
	private void stopAnimation(){
		AnimationDrawable animationDrawable = (AnimationDrawable) imageView.getDrawable();
		animationDrawable.stop();
	}</span>

5--->本文中播放了5组常见的帧动画，所以使用了数组，轮流播放，代码如下：

<span style="font-family:Comic Sans MS;font-size:18px;">	private int[] animationDrawableIds = {
			R.drawable.frame_animation_01,
			R.drawable.frame_animation_02,
			R.drawable.frame_animation_03,
			R.drawable.frame_animation_04,
			R.drawable.frame_animation_05
	}; 


	//播放下一组动画
	private void setNextAnimationDrawable(){
		currentIndex++;
		if(currentIndex == animationDrawableIds.length){
			currentIndex = 0;
		}
		//设置动画
		imageView.setImageResource(animationDrawableIds[currentIndex]);
		//播放动画
		playAnimation();
	}</span>

02_FrameAnimation逐帧动画Demo下载