本文转自：http://vlinux.iteye.com/blog/472855

相信有Android手机的人都玩过一款Kuba的游戏（没玩过的我推荐去玩一下），里面用手指接触到屏幕后产生的爆炸效果确实增加了游戏的不少色彩。那么这个是怎么做出来的呢？

很明显，这个效果应该是一个动画序列图实现的，即Frame-by-Frame动画。Android实现Frame-by-Frame动画我会的有两种方法：

1、animation-list配置，预先将一个动画按照每帧分解成的多个图片所组成的序列。然后再在Android的配置文件中将这些图片配置到动画里面。

Xml代码

1. <animation-listxmlns:android="http://schemas.android.com/apk/res/android"
2. android:oneshot="false">
3. <itemandroid:drawable="@drawable/explode1"android:duration="50"/>
4. <itemandroid:drawable="@drawable/explode2"android:duration="50"/>
5. <itemandroid:drawable="@drawable/explode3"android:duration="50"/>
6. <itemandroid:drawable="@drawable/explode4"android:duration="50"/>
7. </animation-list>

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"    android:oneshot="false">    <item android:drawable="@drawable/explode1" android:duration="50" />    <item android:drawable="@drawable/explode2" android:duration="50" />    <item android:drawable="@drawable/explode3" android:duration="50" />    <item android:drawable="@drawable/explode4" android:duration="50" /></animation-list>

但是由此带来的不便也是显而易见的：drawable目录下拥挤了过多的动画帧文件。如果游戏大起来，动画效果丰富，那么drawable目录下将拥有数量庞大的图片文件，这将是开发人员的灾难(见下图)。

2、AnimationDrawable动画。其实我们发现，我们完全可以将同一动画序列的每帧图片都合并到一个大的图片中去，然后读取图片的时候按照约定好的宽、高去读就能准确的将该帧图片精确的读出来了。下图是小雪行走序列图。

将序列图读出并且转化为动画的核心代码为

Java代码

1. animationDrawable=newAnimationDrawable();
2. Bitmap[]bitmaps=newBitmap[PlayerConst.PLAYER_XIAOXUE_WALK_FRAME];
3. for(intframe=0;frame<bitmaps.length;frame++){
4. Bitmapbitmap=Bitmap.createBitmap(xiaoxueWalkSerBitmap,
5. frame*PlayerConst.PLAYER_XIAOXUE_WALK_WIDTH,
6. lay*PlayerConst.PLAYER_XIAOXUE_WALK_HEIGHT,
7. PlayerConst.PLAYER_XIAOXUE_WALK_WIDTH,
8. PlayerConst.PLAYER_XIAOXUE_WALK_HEIGHT);
9. animationDrawable.addFrame(newBitmapDrawable(bitmap),100);
10. }//for,每层有PLAYER_XIAOXUE_WALK_FRAME帧
11. animationDrawable.setOneShot(false);
12. setBackgroundDrawable(animationDrawable);

animationDrawable = new AnimationDrawable();Bitmap[] bitmaps = new Bitmap[PlayerConst.PLAYER_XIAOXUE_WALK_FRAME];for (int frame = 0; frame < bitmaps.length; frame++) {Bitmap bitmap = Bitmap.createBitmap(xiaoxueWalkSerBitmap, frame*PlayerConst.PLAYER_XIAOXUE_WALK_WIDTH, lay*PlayerConst.PLAYER_XIAOXUE_WALK_HEIGHT, PlayerConst.PLAYER_XIAOXUE_WALK_WIDTH,PlayerConst.PLAYER_XIAOXUE_WALK_HEIGHT);animationDrawable.addFrame(new BitmapDrawable(bitmap),100);}// for,每层有 PLAYER_XIAOXUE_WALK_FRAME 帧animationDrawable.setOneShot(false);setBackgroundDrawable(animationDrawable);

具体例子可以从附件中找到。

3、SurfaceView动画。也许你很快就发现，前两个动画都必须依赖View才能展示，并且每个View只能展示一个动画。而在游戏中不可能只有一动画，更恐怖的是很多动画都是随机产生的，并不是事先约定好的，而动态创建／删除View的代价非常高，并不适合做高性能的游戏。这个时候你需要的是SurfaceView。

在SurfaceView中的动画有一点是和前边两种动画有区别的：那就是画布上所有的一切都必须自己亲自打理。在前边几个基于Animation的动画你只需关心当前动画的序列即可，其他都由系统帮你处理完毕。而在SurfaceView中，你就是那个处理程序，所有的一切包括背景都必须有你来亲自打理。

为此我写了一个框架专门来处理这个琐事，框架只有两个类：AnimationDraw和DrawRunning。其中AnimationDraw则是一个动画类，它负责描述当前动画元素的位置、当前播放到第几帧、每帧的延时是多少、是否重复播放等。

Java代码

1. importjava.util.Date;
3. importandroid.graphics.Bitmap;
5. /**
6. *动画绘画元素
7. *@authorvlinux
8. *
9. */
10. publicclassAnimationDraw{
12. protectedfloatx;
13. protectedfloaty;
14. protectedBitmap[]bitmaps;
15. protectedlongduration;
17. protectedLonglastBitmapTime;
18. protectedintstep;
19. protectedbooleanrepeat;
21. /**
22. *动画构造函数-for静态图片
23. *@paramx:X坐标<br/>
24. *@paramy:Y坐标<br/>
25. *@parambitmap:显示的图片<br/>
26. *@paramduration:图片显示的时间<br/>
27. */
28. publicAnimationDraw(floatx,floaty,Bitmapbitmap,longduration){
29. Bitmap[]bitmaps={bitmap};
30. this.x=x;
31. this.y=y;
32. this.bitmaps=bitmaps;
33. this.duration=duration;
34. this.repeat=true;
35. lastBitmapTime=null;
36. step=0;
37. }
39. /**
40. *动画构造函数
41. *@paramx:X坐标<br/>
42. *@paramy:Y坐标<br/>
43. *@parambitmap:显示的图片<br/>
44. *@paramduration:图片显示的时间<br/>
45. *@paramrepeat:是否重复动画过程<br/>
46. */
47. publicAnimationDraw(floatx,floaty,Bitmap[]bitmaps,longduration,booleanrepeat){
48. this.x=x;
49. this.y=y;
50. this.bitmaps=bitmaps;
51. this.duration=duration;
52. this.repeat=repeat;
53. lastBitmapTime=null;
54. step=0;
55. }
58. publicBitmapnextFrame(){
60. if(step>=bitmaps.length){
61. //判断step是否越界
62. if(!repeat){
63. returnnull;
64. }else{
65. lastBitmapTime=null;
66. }//if
67. }//if
69. if(null==lastBitmapTime){
70. //第一次执行
71. lastBitmapTime=newDate().getTime();
72. returnbitmaps[step=0];
73. }//if
75. //第X次执行
76. longnowTime=System.currentTimeMillis();
77. if(nowTime-lastBitmapTime<=duration){
78. //如果还在duration的时间段内,则继续返回当前Bitmap
79. //如果duration的值小于0,则表明永远不失效,一般用于背景
80. returnbitmaps[step];
81. }//if
82. lastBitmapTime=nowTime;
83. returnbitmaps[step++];//返回下一Bitmap
84. }
86. publicfloatgetX(){
87. returnx;
88. }
90. publicfloatgetY(){
91. returny;
92. }
94. }

import java.util.Date;import android.graphics.Bitmap;/** * 动画绘画元素 * @author vlinux * */public class AnimationDraw {protected float x;protected float y;protected Bitmap[] bitmaps;protected long duration;protected Long lastBitmapTime;protected int step;protected boolean repeat;/** * 动画构造函数-for静态图片 * @param x:X坐标<br/> * @param y:Y坐标<br/> * @param bitmap:显示的图片<br/> * @param duration:图片显示的时间<br/> */public AnimationDraw(float x, float y, Bitmap bitmap, long duration) {Bitmap[] bitmaps = {bitmap};this.x = x;this.y = y;this.bitmaps = bitmaps;this.duration = duration;this.repeat = true;lastBitmapTime = null;step = 0;}/** * 动画构造函数 * @param x:X坐标<br/> * @param y:Y坐标<br/> * @param bitmap:显示的图片<br/> * @param duration:图片显示的时间<br/> * @param repeat:是否重复动画过程<br/> */public AnimationDraw(float x, float y, Bitmap[] bitmaps, long duration, boolean repeat) {this.x = x;this.y = y;this.bitmaps = bitmaps;this.duration = duration;this.repeat = repeat;lastBitmapTime = null;step = 0;}public Bitmap nextFrame() {if (step >= bitmaps.length) {// 判断step是否越界if( !repeat ) {return null;} else {lastBitmapTime = null;}//if}// ifif (null == lastBitmapTime) {// 第一次执行lastBitmapTime = new Date().getTime();return bitmaps[step = 0];}// if// 第X次执行long nowTime = System.currentTimeMillis();if (nowTime - lastBitmapTime <= duration) {// 如果还在duration的时间段内,则继续返回当前Bitmap// 如果duration的值小于0,则表明永远不失效,一般用于背景return bitmaps[step];}// iflastBitmapTime = nowTime;return bitmaps[step++];// 返回下一Bitmap}public float getX() {return x;}public float getY() {return y;}}

DrawRunning则是一个负责画图的线程，它是程序的核心。

Java代码

1. importjava.util.ArrayList;
2. importjava.util.Iterator;
3. importjava.util.List;
5. importandroid.graphics.Bitmap;
6. importandroid.graphics.Canvas;
7. importandroid.view.SurfaceHolder;
9. /**
10. *绘画线程
11. *
12. *@authorvlinux
13. *
14. */
15. publicclassDrawRunningimplementsRunnable{
17. privateList<AnimationDraw>animationDraws;//所有需要画动画的集合
18. privateList<AnimationDraw>buffers;//缓存前台传入需要展示的动画
19. privateSurfaceHoldersurfaceHolder;
20. privatebooleanrunning;
22. publicDrawRunning(SurfaceHoldersurfaceHolder){
23. this.surfaceHolder=surfaceHolder;
24. animationDraws=newArrayList<AnimationDraw>();
25. buffers=newArrayList<AnimationDraw>();
26. running=true;
27. }
29. @Override
30. publicvoidrun(){
31. //TODOAuto-generatedmethodstub
32. while(running){
33. synchronized(surfaceHolder){
34. Canvascanvas=null;
35. try{
36. canvas=surfaceHolder.lockCanvas(null);
37. doDraw(canvas);
38. }finally{
39. if(null!=canvas){
40. surfaceHolder.unlockCanvasAndPost(canvas);
41. }//if
42. }//try
43. }//syn
44. }//while
45. }
47. privatevoiddoDraw(Canvascanvas){
48. synchronized(this){
49. //检查缓存中是否有需要加入的动画
50. if(!buffers.isEmpty()){
51. animationDraws.addAll(buffers);//加入animationDraws
52. buffers.clear();//清空缓存
53. }//if
54. }//syn
55. if(animationDraws.isEmpty()){
56. return;//如果animationDraws里面是空的那就不用画了
57. }//if
58. //---这里开始绘画
59. Iterator<AnimationDraw>bombIt=animationDraws.iterator();
60. while(bombIt.hasNext()){
61. AnimationDrawbomb=bombIt.next();
62. BitmapnextFrame=bomb.nextFrame();
63. if(null==nextFrame){
64. //下一Frame为null，说明动画序列已经结束
65. //该动画已经完成，从动画集合中删除
66. bombIt.remove();
67. continue;//while
68. }//if
69. canvas.drawBitmap(nextFrame,bomb.getX(),bomb.getY(),null);
70. }//while
71. }
73. publicvoidaddAnimationDraw(AnimationDrawbomb){
74. synchronized(this){
75. //尽量减少这个的同步响应时间，因为这个方法是前台响应的
76. //多0.1秒都会直接反应到用户感知
77. buffers.add(bomb);//将需要显示动画的内容加入到缓存
78. }//syn
79. }
81. publicvoidstopDrawing(){
82. running=false;
83. }
85. }

import java.util.ArrayList;import java.util.Iterator;import java.util.List;import android.graphics.Bitmap;import android.graphics.Canvas;import android.view.SurfaceHolder;/** * 绘画线程 *  * @author vlinux *  */public class DrawRunning implements Runnable {private List<AnimationDraw> animationDraws;//所有需要画动画的集合private List<AnimationDraw> buffers;//缓存前台传入需要展示的动画private SurfaceHolder surfaceHolder;private boolean running;public DrawRunning(SurfaceHolder surfaceHolder) {this.surfaceHolder = surfaceHolder;animationDraws = new ArrayList<AnimationDraw>();buffers = new ArrayList<AnimationDraw>();running = true;}@Overridepublic void run() {// TODO Auto-generated method stubwhile (running) {synchronized (surfaceHolder) {Canvas canvas = null;try {canvas = surfaceHolder.lockCanvas(null);doDraw(canvas);} finally {if (null != canvas) {surfaceHolder.unlockCanvasAndPost(canvas);}// if}// try}// syn}// while}private void doDraw(Canvas canvas) {synchronized(this) {//检查缓存中是否有需要加入的动画if( !buffers.isEmpty() ) {animationDraws.addAll(buffers);//加入animationDrawsbuffers.clear();//清空缓存}//if}//synif( animationDraws.isEmpty() ) {return;//如果animationDraws里面是空的那就不用画了}//if//---这里开始绘画Iterator<AnimationDraw> bombIt = animationDraws.iterator();while (bombIt.hasNext()) {AnimationDraw bomb = bombIt.next();Bitmap nextFrame = bomb.nextFrame();if (null == nextFrame) {//下一Frame为null，说明动画序列已经结束//该动画已经完成，从动画集合中删除bombIt.remove();continue;//while}// ifcanvas.drawBitmap(nextFrame, bomb.getX(), bomb.getY(), null);}// while}public void addAnimationDraw(AnimationDraw bomb) {synchronized(this) {//尽量减少这个的同步响应时间，因为这个方法是前台响应的//多0.1秒都会直接反应到用户感知buffers.add(bomb);//将需要显示动画的内容加入到缓存}//syn}public void stopDrawing() {running = false;}}

值得注意的是，我用了一个缓存和两个synchronized来提高前台的响应以及确保对集合类、SurfaceHolder的正确操作。

例子可以见附件。

• 大小: 8 KB

• 描述: 小雪行走序列图
• 大小: 38 KB

• PlayerDemo.tar.gz (57.8 KB)
• 描述: 例子2
• 下载次数: 425

• TouchBombDemo.tar.gz (680.9 KB)
• 描述: 例子3
• 下载次数: 490

更多相关文章

1. 获取相册图片及路径
2. Android(安卓)5.0 技术新趋势
3. android4.0.3 修改启动动画和开机声音
4. Android(安卓)实现自定义的卫星式菜单（弧形菜单）View
5. android 加载网络图片 SkImageDecoder::Factory returned null
6. Android学习笔记19：ImageView实现图片适屏与裁剪
7. Android(安卓)动画各种实现，包括帧动画、补间动画和属性动画的总
8. android中-使用2D动画 — 图形处理(Canvas基础)
9. Android(安卓)属性动画（一）

随机推荐

1. 《Android经验分享》周刊第6期
2. Android NFC技术（三）——初次开发Android N
3. android代码审查工具---lint工具的使用
4. android 深入研究ratingbar自定义
5. 如何看待Android今后的发展
6. Android短信蠕虫XXshenqi分析
7. Qt on Android：资源文件系统qrc与assets
8. android gallery和Animation组合使用， 看
9. Android安装busybox
10. Android（1.1-4.2） platform 开发包【全版本