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);//创建画布

则可以看到透明的效果。