Android 用Animation-list实现逐帧动画

最新推荐文章于 2026-06-22 19:25:46 发布

转载最新推荐文章于 2026-06-22 19:25:46 发布 · 261 阅读

标签

#android #动画

动画专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何在Android中使用帧动画实现图片顺序及倒序播放效果，包括资源准备、动画配置文件编写、布局文件设计及Activity代码实现。

第一步：先上图片素材，以下素材放到res/drawable目录下：<?xml version="1.0" encoding="utf-8"?>

图片素材：
文件名称：	icon1.png	icon2.png	icon3.png	icon4.png	icon5.png	icon6.png

第二步：上动画Animation-list帧布局文件，有2个，一个是按顺序显示动画，一个是倒序显示动画，文件存放在res/drawable目录下

顺序显示动画文件：animation1.xml

<?xml version="1.0" encoding="utf-8"?>  
<!--   
    根标签为animation-list，其中oneshot代表着是否只展示一遍，设置为false会不停的循环播放动画  
    根标签下，通过item标签对动画中的每一个图片进行声明  
    android:duration 表示展示所用的该图片的时间长度  
 -->  
<animation-list  
  xmlns:android="http://schemas.android.com/apk/res/android"  
  android:oneshot="true"  
  >  
    <item android:drawable="@drawable/icon1" android:duration="150"></item>  
    <item android:drawable="@drawable/icon2" android:duration="150"></item>  
    <item android:drawable="@drawable/icon3" android:duration="150"></item>  
    <item android:drawable="@drawable/icon4" android:duration="150"></item>  
    <item android:drawable="@drawable/icon5" android:duration="150"></item>  
    <item android:drawable="@drawable/icon6" android:duration="150"></item>  
</animation-list>

倒序显示动画文件：animation2.xml

<span style="color:#000066;"><?xml version="1.0" encoding="utf-8"?>  
<!--   
    根标签为animation-list，其中oneshot代表着是否只展示一遍，设置为false会不停的循环播放动画  
    根标签下，通过item标签对动画中的每一个图片进行声明  
    android:duration 表示展示所用的该图片的时间长度  
 -->  
<animation-list  
  xmlns:android="http://schemas.android.com/apk/res/android"  
  android:oneshot="true"  
  >  
    <item android:drawable="@drawable/icon6" android:duration="150"></item>  
    <item android:drawable="@drawable/icon5" android:duration="150"></item>  
    <item android:drawable="@drawable/icon4" android:duration="150"></item>  
    <item android:drawable="@drawable/icon3" android:duration="150"></item>  
    <item android:drawable="@drawable/icon2" android:duration="150"></item>  
    <item android:drawable="@drawable/icon1" android:duration="150"></item>  
</animation-list>  
</span>

第三步：上布局文件，放在res/layout目录下，文件名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:orientation="vertical">  
     
    <ImageView android:id="@+id/animationIV"  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:padding="5px"  
            android:src="@drawable/animation1"/>   
              
    <Button android:id="@+id/buttonA"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:padding="5px"  
        android:text="顺序显示" />  
      
    <Button android:id="@+id/buttonB"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:padding="5px"  
        android:text="停止" />  
      
    <Button android:id="@+id/buttonC"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:padding="5px"  
        android:text="倒序显示" />  
  
</LinearLayout>

第四步：上Activity文件，文件名：MainActivity.Java

<span style="color:#000066;">package org.shuxiang.test;  
  
import android.app.Activity;  
import android.graphics.drawable.AnimationDrawable;  
  
import android.os.Bundle;  
import android.view.View;  
import android.view.View.OnClickListener;  
import android.view.Window;  
import android.widget.Button;  
import android.widget.ImageView;  
  
public class Activity10 extends Activity  
{  
    private ImageView animationIV;  
    private Button buttonA, buttonB, buttonC;  
    private AnimationDrawable animationDrawable;  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        requestWindowFeature(Window.FEATURE_NO_TITLE);  
        setContentView(R.layout.test10);  
         
          
        animationIV = (ImageView) findViewById(R.id.animationIV);  
        buttonA = (Button) findViewById(R.id.buttonA);  
        buttonB = (Button) findViewById(R.id.buttonB);  
        buttonC = (Button) findViewById(R.id.buttonC);  
          
        buttonA.setOnClickListener(new OnClickListener()  
        {  
            @Override  
            public void onClick(View v) {  
                // TODO Auto-generated method stub  
                animationIV.setImageResource(R.drawable.animation1);  
                animationDrawable = (AnimationDrawable) animationIV.getDrawable();  
                animationDrawable.start();  
            }  
              
        });   
          
        buttonB.setOnClickListener(new OnClickListener()  
        {  
            @Override  
            public void onClick(View v) {  
                // TODO Auto-generated method stub  
                animationDrawable = (AnimationDrawable) animationIV.getDrawable();  
                animationDrawable.stop();  
            }  
              
        });  
          
        buttonC.setOnClickListener(new OnClickListener()  
        {  
            @Override  
            public void onClick(View v) {  
                // TODO Auto-generated method stub  
                animationIV.setImageResource(R.drawable.animation2);  
                animationDrawable = (AnimationDrawable) animationIV.getDrawable();  
                animationDrawable.start();  
            }             
        });          
    }  
}  
</span>