图片爆炸效果

原创 2010年05月25日 12:54:00

这个需求是昨天碰到的,怎么说呢,怪怪的,主要是想不出可以模拟爆炸效果的公式。
先来看Demo:


OK,接下去看下具体实现过程:

01.import gs.TweenLite;
02.import gs.easing.Bounce;
03.var img:TmpImage=new TmpImage();
04.var bpd_source:BitmapData=new BitmapData(img.width,img.height,true,0);
05.bpd_source.draw(img);
06.  
07.var blockSize:uint=3;
08.var numWidth:uint=Math.ceil(img.width/blockSize);
09.var numHeight:uint=Math.ceil(img.height/blockSize);
10.var numTotal:uint=numWidth*numHeight;
11.var pt:Point = new Point(0, 0);
12.var ary_blocks:Array=[];
13.var sp:Sprite=new Sprite();
14.init();
15.function init() {
16.    btn1.txt.text="Explode";
17.    btn2.txt.text="Recovery";
18.    btn1.addEventListener(MouseEvent.CLICK,explode);
19.    btn2.addEventListener(MouseEvent.CLICK,recovery);
20.    sp.x=100;
21.    sp.y=90;
22.    addChild(sp);
23.    initBitmap();
24.}
25.function initBitmap(){
26.    for (var i:uint=0; i<numTotal; i++) {
27.        var bmd_tmp:BitmapData=new BitmapData(blockSize,blockSize,true,0);
28.        var rect:Rectangle = new Rectangle(blockSize*(i%numWidth), blockSize*int(i/numWidth), blockSize*(i%numWidth+1), blockSize*(int(i/numWidth)+1));
29.        bmd_tmp.copyPixels(bpd_source, rect, pt);
30.        var bp:Bitmap=new Bitmap();
31.        bp.bitmapData=bmd_tmp;
32.        bp.x=blockSize*(i%numWidth);
33.        bp.y=blockSize*int(i/numWidth);
34.        bp.name=String(i);
35.        sp.addChild(bp);
36.        ary_blocks.push(bp);
37.    }
38.}
39.function explode(_e:MouseEvent) {
40.    for each(var obj:Bitmap in ary_blocks) {
41.        TweenLite.to(obj,rand(0.6,1.2),{x:rand(-100,300),y:rand(-90,240),ease:Bounce.easeIn});
42.    }
43.}
44.function recovery(_e:MouseEvent) {
45.    for each(var obj:Bitmap in ary_blocks) {
46.        TweenLite.to(obj,rand(0.6,1.2),{x:blockSize*(int(obj.name)%numWidth),y:blockSize*int(int(obj.name)/numWidth)});
47.    }
48.}
49.function rand(_min:Number,_max:Number):Number {
50.    return Math.random() * (_max-_min) + _min;
51.}

做法是先把图片转成Bitmap,然后嘛,把Bitmap分割成很多块BitmapData放入新的Bitmap,加入到显示容器里。
如果设置var blockSize=1,程序会直接崩溃哈哈。
在想办法把图片转换成点阵图,不过暂时没头绪,尝试了下Graphics来做,却不知道怎么拿到每个Point来位移=。=唉,还是不够了解Flash。。

猫商城首页楼层效果

本套系列课程由后盾网高薪就业班一线讲师坐镇主讲,精仿天猫商城前端首页,大牛手把手教你如何开发大型网站前端页面,诸多技巧,让你大呼过瘾!核心知识点:html、div+css、JavaScript、jquery 。
  • 2016年03月08日 15:17

坦克大战图片素材背景音乐

  • 2014年06月15日 12:05
  • 1.39MB
  • 下载

【Java_项目篇<1>】--JAVA实现坦克大战游戏--子弹连发+爆炸效果(四)

前期相关文章【Java_项目篇】–JAVA实现坦克大战游戏–画出坦克(一) 【Java_项目篇】–JAVA实现坦克大战游戏–坦克移动+添加敌方坦克(二) 【Java_项目篇】–JAVA实现坦克大战...
  • qq_24653023
  • qq_24653023
  • 2016-08-22 21:07:54
  • 5313

坦克大战图片+音效版

  • 2014年08月21日 09:59
  • 1.94MB
  • 下载

图片爆炸效果

这个需求是昨天碰到的,怎么说呢,怪怪的,主要是想不出可以模拟爆炸效果的公式。先来看Demo:OK,接下去看下具体实现过程:view sourceprint?01.import gs.TweenLite...
  • shangmw
  • shangmw
  • 2010-05-25 12:54:00
  • 767

Java坦克大战 (五) 之产生敌方坦克和爆炸效果

本文来自:小易博客专栏。转载请注明出处:http://blog.csdn.net/oldinaction 在此小易将坦克大战这个项目分为几个版本,以此对J2SE的知识进行回顾和总结,希望这样...
  • oldinaction
  • oldinaction
  • 2014-09-03 08:27:59
  • 4186

经典<em>坦克大战</em>J2ME版源码(实现<em>爆炸效果</em>,坦克履带转动)

经典<em>坦克大战</em>的JAVAME 重制版(适合javaME初学者交流),还未完成敌方坦克,我方坦克实现移动中履带转动效果,子弹消泥土墙,子弹穿河,子弹打击墙壁<em>爆炸效果</em>,对坦克地图帧...
  • 2018年04月20日 00:00

Java坦克大战 (七) 之图片版

本文来自:小易博客专栏。转载请注明出处:http://blog.csdn.net/oldinaction 在此小易将坦克大战这个项目分为几个版本,以此对J2SE的知识进行回顾和总结,希望这样...
  • oldinaction
  • oldinaction
  • 2014-09-18 11:56:13
  • 2872

<em>爆炸</em>系列音效<em>素材</em>

Android游戏开发的爆炸音效,便于大家能找到<em>素材</em>,成功...<em>坦克大战图片</em>+音效版 立即下载 上传者: Archie_w...unity3d各种<em>爆炸效果</em> 立即下载 上传者: lululau8 ...
  • 2018年04月18日 00:00

Java实现坦克大战【升级版】

笔者去各地打了一圈酱油,又忙一些离职换房子的事情,
  • sparrow00004
  • sparrow00004
  • 2014-08-22 16:09:34
  • 1679
收藏助手
不良信息举报
您举报文章:图片爆炸效果
举报原因:
原因补充:

(最多只允许输入30个字)