渲染缓冲区,今天很想探讨一些缓冲填充的技术。其实也不算什么技术,我们可以理解为画画。我们打开一张纸,然后在画面上填充我们想要的东西。首先让我了解一下,as3.0提供了BitmapData和Graphics类,这两种类为我们提供了一些操作位图的数据。
好,看看如何去实现我们的位图填充。
|
新建一个类,名为Map类,地图类继承Sprite类,作为它的子类。
package
{
import flash.display.Sprite;
import flash.display.*;
import flash.events.*;
import flash.geom.*;
public class Map extends Sprite
{
}
}
{
import flash.display.Sprite;
import flash.display.*;
import flash.events.*;
import flash.geom.*;
public class Map extends Sprite
{
}
}
接下来,加入构造函数:
package
{
import flash.display.Sprite;
import flash.display.*;
import flash.events.*;
import flash.geom.*;
public class Map extends Sprite
{
public function Map(mapdata:BitmapData,mapX:Number,mapY:Number)
{
}
}
}
{
import flash.display.Sprite;
import flash.display.*;
import flash.events.*;
import flash.geom.*;
public class Map extends Sprite
{
public function Map(mapdata:BitmapData,mapX:Number,mapY:Number)
{
}
}
}
我们简单分析一下,这个地图类,地图类包括的属性有地图数据,图的数据,有地图的坐标,宽度等等。
这个类中,我们引入一个创建图的方法。
public function CreateMap(bufferwidth:Number,bufferheight:Number):void
这个方法带三个参数,bufferwidth是指缓冲区的宽度,
bufferheight指缓冲区的高度
然后,我们所做的事情,包括,创建一个渲染的缓冲区,指定他的大小
如:
buffer=new BitmapData(bufferwidth,bufferheight,false,0xFFFFFFFF);//设置缓冲区
这样就可以指定了一个填充的缓冲区。
复制像素到缓冲区:
由 于缓冲区 上面的域并没有什么信息数据,为了能让这个缓冲区有内容,我们使用复制像素的做法,复制我们所需要的像素。他就像一个“回”上面的口字可以看作我们的视 框,而下面就是一张底图,每次我们移动图形的时候,复制的仅仅是我们所看到区域,填充的区域仅仅是我们规定的缓冲区大小。这样做法,有利于我们的内存使 用。
如:
buffer.copyPixels(mapdata,new Rectangle(rect.x,rect.y,bufferwidth,bufferheight),new Point(0,0));//矩形的坐标变化,会裁剪出不同的位图数据
看一下完整的代码:
public function CreateMap(bufferwidth:Number,bufferheight:Number):void
{
buffer=new BitmapData(bufferwidth,bufferheight,false,0xFFFFFFFF);//设置缓冲区
buffer.fillRect(new Rectangle(0,0,bufferwidth,bufferheight),0x0000FF00);//填充缓冲区
trace(rect.y);
if (rect.x<0 )
{
rect.x=0;
}
trace(mapWidth);
if (rect.x+buffer.width>mapWidth)
{
rect.x=mapWidth-buffer.width;
}
if (rect.y<=0)
{
rect.y=0;
}
if (rect.y+buffer.height>mapHeight)
{
rect.y=mapHeight-buffer.height;
}
buffer.copyPixels(mapdata,new Rectangle(rect.x,rect.y,bufferwidth,bufferheight),new Point(0,0));//矩形的坐标变化,会裁剪出不同的位图数据
FillMap(buffer);//填充位图数据
}
{
buffer=new BitmapData(bufferwidth,bufferheight,false,0xFFFFFFFF);//设置缓冲区
buffer.fillRect(new Rectangle(0,0,bufferwidth,bufferheight),0x0000FF00);//填充缓冲区
trace(rect.y);
if (rect.x<0 )
{
rect.x=0;
}
trace(mapWidth);
if (rect.x+buffer.width>mapWidth)
{
rect.x=mapWidth-buffer.width;
}
if (rect.y<=0)
{
rect.y=0;
}
if (rect.y+buffer.height>mapHeight)
{
rect.y=mapHeight-buffer.height;
}
buffer.copyPixels(mapdata,new Rectangle(rect.x,rect.y,bufferwidth,bufferheight),new Point(0,0));//矩形的坐标变化,会裁剪出不同的位图数据
FillMap(buffer);//填充位图数据
}
当中还有个判断区域,这个移动区域不能超出我们最大底图的宽度和高度。
填充位图
对于缓冲区并不能显示到我们的窗口里面,为了显示到我们的窗口,我们还要将其数据填充到窗口里面。我们所使用的是Graphics 类包提供给我们的一些简单的方法。如
public function FillMap(data:BitmapData):void
{
sprite.graphics.clear();
sprite.graphics.beginBitmapFill(data,null,false,false);
sprite.graphics.drawRect(0,0,data.width,data.height);
sprite.graphics.endFill();
addChild(sprite);
}
{
sprite.graphics.clear();
sprite.graphics.beginBitmapFill(data,null,false,false);
sprite.graphics.drawRect(0,0,data.width,data.height);
sprite.graphics.endFill();
addChild(sprite);
}
完整代码:
package
{
import flash.display.Sprite;
import flash.display.*;
import flash.events.*;
import flash.geom.*;
public class Map extends Sprite
{
private var mapWidth:Number;//地图的宽度
private var mapHeight:Number;//地图高度
private var mapX:Number;//地图的x坐标
private var mapY:Number;//地图的y坐标
private var mapArray:Array;
private var mapdata:BitmapData;
public var sprite:Sprite=new Sprite();//做一个容器使用
public var rect:Rectangle;//地图的矩形外形
public var bitmap:Bitmap;
private var buffer:BitmapData;//缓冲区
public function Map(mapdata:BitmapData,mapX:Number,mapY:Number)
{
this.mapdata=mapdata;
//this.mapX=mapX;
//this.mapY=mapY;
this.mapWidth=mapdata.width;
this.mapHeight=mapdata.height;
bitmap=new Bitmap(mapdata);
rect=bitmap.getRect(bitmap);//获取地图的矩形
}
public function get MapInfo():BitmapData
{
return mapdata;
}
public function CreateMap(bufferwidth:Number,bufferheight:Number):void
{
buffer=new BitmapData(bufferwidth,bufferheight,false,0xFFFFFFFF);//设置缓冲区
buffer.fillRect(new Rectangle(0,0,bufferwidth,bufferheight),0x0000FF00);//填充缓冲区
trace(rect.y);
if (rect.x<0 )
{
rect.x=0;
}
trace(mapWidth);
if (rect.x+buffer.width>mapWidth)
{
rect.x=mapWidth-buffer.width;
}
if (rect.y<=0)
{
rect.y=0;
}
if (rect.y+buffer.height>mapHeight)
{
rect.y=mapHeight-buffer.height;
}
buffer.copyPixels(mapdata,new Rectangle(rect.x,rect.y,bufferwidth,bufferheight),new Point(0,0));//矩形的坐标变化,会裁剪出不同的位图数据
FillMap(buffer);//填充位图数据
}
public function FillMap(data:BitmapData):void
{
sprite.graphics.clear();
sprite.graphics.beginBitmapFill(data,null,false,false);
sprite.graphics.drawRect(0,0,data.width,data.height);
sprite.graphics.endFill();
addChild(sprite);
}
}
}
{
import flash.display.Sprite;
import flash.display.*;
import flash.events.*;
import flash.geom.*;
public class Map extends Sprite
{
private var mapWidth:Number;//地图的宽度
private var mapHeight:Number;//地图高度
private var mapX:Number;//地图的x坐标
private var mapY:Number;//地图的y坐标
private var mapArray:Array;
private var mapdata:BitmapData;
public var sprite:Sprite=new Sprite();//做一个容器使用
public var rect:Rectangle;//地图的矩形外形
public var bitmap:Bitmap;
private var buffer:BitmapData;//缓冲区
public function Map(mapdata:BitmapData,mapX:Number,mapY:Number)
{
this.mapdata=mapdata;
//this.mapX=mapX;
//this.mapY=mapY;
this.mapWidth=mapdata.width;
this.mapHeight=mapdata.height;
bitmap=new Bitmap(mapdata);
rect=bitmap.getRect(bitmap);//获取地图的矩形
}
public function get MapInfo():BitmapData
{
return mapdata;
}
public function CreateMap(bufferwidth:Number,bufferheight:Number):void
{
buffer=new BitmapData(bufferwidth,bufferheight,false,0xFFFFFFFF);//设置缓冲区
buffer.fillRect(new Rectangle(0,0,bufferwidth,bufferheight),0x0000FF00);//填充缓冲区
trace(rect.y);
if (rect.x<0 )
{
rect.x=0;
}
trace(mapWidth);
if (rect.x+buffer.width>mapWidth)
{
rect.x=mapWidth-buffer.width;
}
if (rect.y<=0)
{
rect.y=0;
}
if (rect.y+buffer.height>mapHeight)
{
rect.y=mapHeight-buffer.height;
}
buffer.copyPixels(mapdata,new Rectangle(rect.x,rect.y,bufferwidth,bufferheight),new Point(0,0));//矩形的坐标变化,会裁剪出不同的位图数据
FillMap(buffer);//填充位图数据
}
public function FillMap(data:BitmapData):void
{
sprite.graphics.clear();
sprite.graphics.beginBitmapFill(data,null,false,false);
sprite.graphics.drawRect(0,0,data.width,data.height);
sprite.graphics.endFill();
addChild(sprite);
}
}
}
copyPixels (sourceBitmapData:BitmapData , sourceRect:Rectangle , destPoint:Point , alphaBitmapData:BitmapData = null, alphaPoint:Point = null, mergeAlpha:Boolean = false):void
为没有拉伸、旋转或色彩效果的图像之间的像素处理提供一个快速例程。
|
clear ():
|