flash与位图:常用的技巧（一）

最近看了很多外国人写的as代码，发现在与flash 位图结合创造可以发挥很多不错的效果。这些效果常常利用了位图的特性来制 作一些比较炫耀的效果。例如粒子效果，位图变形等。位图魅力相当有吸引力，下面我将会记录最近一些笔记。只是一些总结。 首先，在很多粒子效果代码当中会发现一种简单思路模式，这个结构套路比较简单。程序里面首先会创建一个画布，定义一个帧循环监听器。（画布用于绘制图形粒子，而帧循环就是不断刷新画面。）

package 
{
	import flash.events.Event;
	import flash.display.BitmapData;
	import flash.display.Bitmap;
	import flash.display.Sprite;
	import flash.display.PixelSnapping;
	import flash.display.BlendMode;
	public class Main extends Sprite
	{
		private var canvas:BitmapData;
		public function Main()
		{
			init();
		}
		private function init():void
		{
			canvas = new BitmapData(550,400,false,0x0);//创建画布
			addChild(new Bitmap(canvas));

			addEventListener(Event.ENTER_FRAME,update);
		}

		
		private function update(event:Event):void
		{
			canvas.lock();
			canvas.fillRect(canvas.rect, 0x0);
            
			canvas.unlock();
		}

	}
}

定义完结构后，我们写一种比较简单的粒子结构模型，这个模型定义的东西也很少，属性只是有x,y ,vx ,vy ，他们分别是，x坐标，y坐标，速率变化vx，速率变化vy。这个类记录了粒子数据轨迹数据。

//基本的粒子模型
class Particle
{
	public var vx:Number = 0;
	public var vy:Number = 0;
	public var x:Number = 0;
	public var y:Number = 0;
	public function Particle()
	{

	}
}

在这个模板套路基础上，接下来，我们需要在帧循环里面，为其创建一些粒子，然后让其产生动画的效果。创建粒子的行为，通过使用循环的方法产生一组粒子。为了让画布显示出内容，调用setPixel 设置像素后会呈现出一些内容在不停向下移动。

package {	import flash.events.Event;	import flash.display.BitmapData;	import flash.display.Bitmap;	import flash.display.Sprite;	import flash.display.PixelSnapping;	import flash.display.BlendMode;	public class Main extends Sprite	{		private var canvas:BitmapData;		private var particleList:Array = [];		private var maxHeight:Number = 400;		private var g:Number = 0.95;		public function Main()		{			init();		}		private function init():void		{			canvas = new BitmapData(550,400,false,0x0);//创建画布			addChild(new Bitmap(canvas));			addEventListener(Event.ENTER_FRAME,update);		}		//添加粒子		private function addParticle(x:Number,y:Number,vx:Number,vy:Number):void		{			var p:Particle=new Particle();			p.x = x;			p.y = y;			p.vx = vx;			p.vy = vy;			particleList.push(p);		}		private function update(event:Event):void		{			canvas.lock();			canvas.fillRect(canvas.rect, 0x0);			//运动			var len:int = particleList.length;			for (var i:int=0; i<len; i++)			{				var p:Particle = particleList[i] as Particle;				if (p==null)				{					continue;				}				p.vy +=  g;				p.y +=  p.vy;				canvas.setPixel(p.x, p.y, 0xffffff);				canvas.setPixel(p.x, p.y+1, 0xffffff);				canvas.setPixel(p.x, p.y+2, 0xffffff);				canvas.setPixel(p.x, p.y+3, 0xffffff);				//边界处理				if (p.y > maxHeight)				{					particleList.splice(i,1);				}			}			canvas.unlock();			for (var j:int=0; j<5; j++)			{				addParticle(Math.random()*550,0,0,0);			}		}	}}//基本的粒子模型
class Particle
{
	public var vx:Number = 0;
	public var vy:Number = 0;
	public var x:Number = 0;
	public var y:Number = 0;
	public function Particle()
	{

	}
}

基本的代码量不多，但是你会发现这种结构非常普通和常见，在一些小实验当中，经常会结合这种套路模型来做一些粒子特效。如果希望把黑色底去掉，那么将位图设置透明，并且将setPixel---》改成setPixel32 位canvas.setPixel32(p.x, p.y, 0xffffffff);canvas.setPixel32(p.x, p.y+1, 0xffffffff);这样

canvas = new BitmapData(550,400,true,0x0);//创建画布

则可以看到透明的效果。