上一篇介绍了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; @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(); // 按钮事件 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; @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形式实现逐帧动画的源代码:
直接以编码的方式实现逐帧动画的源代码: