每次blitting之前如何清除位图?
How do I clear the bitmap each time before blitting?
我对 blitting 还很陌生,我仍在努力理解这个过程。在我的 View
对象中,我的构造函数中有这个;
this.bcg = new BitmapData(800,600,false,0x000000);
this.canvas = new Bitmap(bcg);
然后我把它添加到舞台上;
addChild(canvas);
然后在我的主游戏循环中,我遍历一个嵌套数组以 blit 复制 rect
类型 BitmapData
对象;
if (array[i][j] !=0) {
canvas.bitmapData.copyPixels(rect, rect.rect, new Point(i, j));
}
我想也许我可以通过在循环之前将背景 blitting 回到 canvas
来做到这一点;
canvas.bitmapData.copyPixels(bcg, bcg.rect, new Point(0, 0));
但这不起作用。我已经尝试四处寻找这个问题的答案,但是很难找到任何关于 AS3 中 blitting 的深入信息。
我想做的是清除位图上的所有像素,然后仅使用我的背景重新开始,bcg
。我在循环之前尝试这样做;
this.bcg = new BitmapData(800,600,false,0x000000);
this.canvas = new Bitmap(bcg);
但我最终得到了一个完全黑屏,而且我的 rect
都没有被 blit 到 canvas
。
我知道我现在做错了什么了。
这有效;
this.bcg = new BitmapData(800,600,false,0x000000);
canvas.bitmapData.copyPixels(bcg, bcg.rect, new Point(0, 0));
我不得不重新声明 bcg
, 然后 将其 blit 到 canvas
。因为我的 rect
对象被 blit 到 bcg
,对吗?我正在使用创建位图;
this.canvas = new Bitmap(bcg);
所以 canvas 持有对 bcg
的引用?
这是一个简单的位图发送示例:
private var m_bg:BitmapData = new BitmapData( 400, 300, false, 0xffff0000 ); // simple solid red colour
private var m_canvas:BitmapData = new BitmapData( 400, 300, true, 0x00000000 ); // the canvas that we're drawing into
private var m_obj:BitmapData = new BitmapData( 20, 20, false, 0xff00ff00 ); // simple green square
private var m_objDrawPos:Point = new Point; // where we'll draw our obj
private var m_objDir:Point = new Point; // the direction that our obj is moving in
private var m_objSpeed:Number = 20.0; // the speed of our obj
public function Main()
{
// create the bitmap for our canvas and add it to the stage
var b:Bitmap = new Bitmap( this.m_canvas );
this.addChild( b );
// set our initial direction
this.m_objDir.setTo( 1.0, 1.0 ); // diagonal right
// add our enter frame
this.addEventListener( Event.ENTER_FRAME, this._onEnterFrame );
}
private function _onEnterFrame( e:Event ):void
{
// move our object by changing it's draw position
this.m_objDrawPos.x += this.m_objDir.x * this.m_objSpeed;
this.m_objDrawPos.y += this.m_objDir.y * this.m_objSpeed;
// simple bounds change, to reflect the object
if ( this.m_objDrawPos.x < 0 || this.m_objDrawPos.x + this.m_obj.width > this.m_canvas.width )
this.m_objDir.x *= -1;
if ( this.m_objDrawPos.y < 0 || this.m_objDrawPos.y + this.m_obj.height > this.m_canvas.height )
this.m_objDir.y *= -1;
// copy our this.m_bg - this will erase all previous changes
// NOTE: depending on what your bg is, you can all use fillRect() if it's a solid colour
// NOTE: passing new Point() as the destPoint, will mean that our bg will always be drawn
// in the top-left of the canvas. As this never changes - you can keep this as a variable
this.m_canvas.copyPixels( this.m_bg, this.m_bg.rect, new Point );
// copy our object to its new position
this.m_canvas.copyPixels( this.m_obj, this.m_obj.rect, this.m_objDrawPos );
}
关于块传输,您需要了解的是作为 destPoint
传入的位置决定了您正在块传输的 BitmapData
的左上角位置 - 可以将其视为普通 DisplayObject
- (0,0)
的 x
和 y
表示它绘制在左上角,而 (canvas.width - obj.width, canvas.height - obj.height)
表示它绘制在底部对。
为了让您的生活更轻松,请创建一个简单的 class 来为您存储所有这些数据。类似于:
public class BlitObj
{
/************************************************************/
private var m_bmd:BitmapData = null; // our BitmapData graphics
private var m_offset:Point = null; // the offset (how we manage the reference point)
private var m_drawPos:Point = null; // our draw position for when we're blitting the object
private var m_position:Point = null; // the position of our object, in relation to the reference point
/************************************************************/
/**
* The position of the BlitObj, in relation to the reference point
*/
public function get position():Point { return this.m_position; }
/**
* The BitmapData graphics that we're going to blit
*/
public function get blitGraphics():BitmapData { return this.m_bmd; }
/**
* The position to blit this BlitObj at (top-left corner)
*/
public function get blitDestPos():Point { return this.m_drawPos; }
/************************************************************/
/**
* Creates a new BlitObj
* @param bmd The graphics for this BlitObj
* @param offset The offset to our registration point
*/
public function BlitObj( bmd:BitmapData, offset:Point = null )
{
this.m_bmd = bmd;
this.m_offset = ( offset == null ) ? new Point : offset;
this.m_drawPos = new Point( -this.m_offset.x, -this.m_offset.y );
this.m_position = new Point;
}
/**
* Sets the position of the BlitObj (in relation to its reference point)
* @param x The x position of the object
* @param y The y position of the object
*/
public function setPos( x:Number, y:Number ):void
{
this.m_position.setTo( x, y );
this.m_drawPos.setTo( x - this.m_offset.x, y - this.m_offset.y ) ;
}
}
blitting 时要注意的一件事是 class 所做的,它处理 offset
。当您向 copyPixels()
函数提供 destPoint
时,它是在绘制之前放置 BitmapData
左上角的位置。但是,通常您希望对象具有与左上角不同的参考点(例如,圆的参考点位于中间)。这可以让你处理。
// create our circle graphics with their registration point in the center
var circleBMD:BitmapData = ...; // get the graphics for your circle
var circle:BlitObj = new BlitObj( circleBMD, new Point( circleBMD.width * 0.5, circleBMD.height * 0.5 ) );
circle.setPos( this.stage.stageWidth * 0.5, this.stage.stageHeight * 0.5 ); // center it on the stage
// now you can draw it:
canvas.copyPixels( circle.blitGraphics, circle.blitGraphics.rect, circle.blitDestPos );
我对 blitting 还很陌生,我仍在努力理解这个过程。在我的 View
对象中,我的构造函数中有这个;
this.bcg = new BitmapData(800,600,false,0x000000);
this.canvas = new Bitmap(bcg);
然后我把它添加到舞台上;
addChild(canvas);
然后在我的主游戏循环中,我遍历一个嵌套数组以 blit 复制 rect
类型 BitmapData
对象;
if (array[i][j] !=0) {
canvas.bitmapData.copyPixels(rect, rect.rect, new Point(i, j));
}
我想也许我可以通过在循环之前将背景 blitting 回到 canvas
来做到这一点;
canvas.bitmapData.copyPixels(bcg, bcg.rect, new Point(0, 0));
但这不起作用。我已经尝试四处寻找这个问题的答案,但是很难找到任何关于 AS3 中 blitting 的深入信息。
我想做的是清除位图上的所有像素,然后仅使用我的背景重新开始,bcg
。我在循环之前尝试这样做;
this.bcg = new BitmapData(800,600,false,0x000000);
this.canvas = new Bitmap(bcg);
但我最终得到了一个完全黑屏,而且我的 rect
都没有被 blit 到 canvas
。
我知道我现在做错了什么了。
这有效;
this.bcg = new BitmapData(800,600,false,0x000000);
canvas.bitmapData.copyPixels(bcg, bcg.rect, new Point(0, 0));
我不得不重新声明 bcg
, 然后 将其 blit 到 canvas
。因为我的 rect
对象被 blit 到 bcg
,对吗?我正在使用创建位图;
this.canvas = new Bitmap(bcg);
所以 canvas 持有对 bcg
的引用?
这是一个简单的位图发送示例:
private var m_bg:BitmapData = new BitmapData( 400, 300, false, 0xffff0000 ); // simple solid red colour
private var m_canvas:BitmapData = new BitmapData( 400, 300, true, 0x00000000 ); // the canvas that we're drawing into
private var m_obj:BitmapData = new BitmapData( 20, 20, false, 0xff00ff00 ); // simple green square
private var m_objDrawPos:Point = new Point; // where we'll draw our obj
private var m_objDir:Point = new Point; // the direction that our obj is moving in
private var m_objSpeed:Number = 20.0; // the speed of our obj
public function Main()
{
// create the bitmap for our canvas and add it to the stage
var b:Bitmap = new Bitmap( this.m_canvas );
this.addChild( b );
// set our initial direction
this.m_objDir.setTo( 1.0, 1.0 ); // diagonal right
// add our enter frame
this.addEventListener( Event.ENTER_FRAME, this._onEnterFrame );
}
private function _onEnterFrame( e:Event ):void
{
// move our object by changing it's draw position
this.m_objDrawPos.x += this.m_objDir.x * this.m_objSpeed;
this.m_objDrawPos.y += this.m_objDir.y * this.m_objSpeed;
// simple bounds change, to reflect the object
if ( this.m_objDrawPos.x < 0 || this.m_objDrawPos.x + this.m_obj.width > this.m_canvas.width )
this.m_objDir.x *= -1;
if ( this.m_objDrawPos.y < 0 || this.m_objDrawPos.y + this.m_obj.height > this.m_canvas.height )
this.m_objDir.y *= -1;
// copy our this.m_bg - this will erase all previous changes
// NOTE: depending on what your bg is, you can all use fillRect() if it's a solid colour
// NOTE: passing new Point() as the destPoint, will mean that our bg will always be drawn
// in the top-left of the canvas. As this never changes - you can keep this as a variable
this.m_canvas.copyPixels( this.m_bg, this.m_bg.rect, new Point );
// copy our object to its new position
this.m_canvas.copyPixels( this.m_obj, this.m_obj.rect, this.m_objDrawPos );
}
关于块传输,您需要了解的是作为 destPoint
传入的位置决定了您正在块传输的 BitmapData
的左上角位置 - 可以将其视为普通 DisplayObject
- (0,0)
的 x
和 y
表示它绘制在左上角,而 (canvas.width - obj.width, canvas.height - obj.height)
表示它绘制在底部对。
为了让您的生活更轻松,请创建一个简单的 class 来为您存储所有这些数据。类似于:
public class BlitObj
{
/************************************************************/
private var m_bmd:BitmapData = null; // our BitmapData graphics
private var m_offset:Point = null; // the offset (how we manage the reference point)
private var m_drawPos:Point = null; // our draw position for when we're blitting the object
private var m_position:Point = null; // the position of our object, in relation to the reference point
/************************************************************/
/**
* The position of the BlitObj, in relation to the reference point
*/
public function get position():Point { return this.m_position; }
/**
* The BitmapData graphics that we're going to blit
*/
public function get blitGraphics():BitmapData { return this.m_bmd; }
/**
* The position to blit this BlitObj at (top-left corner)
*/
public function get blitDestPos():Point { return this.m_drawPos; }
/************************************************************/
/**
* Creates a new BlitObj
* @param bmd The graphics for this BlitObj
* @param offset The offset to our registration point
*/
public function BlitObj( bmd:BitmapData, offset:Point = null )
{
this.m_bmd = bmd;
this.m_offset = ( offset == null ) ? new Point : offset;
this.m_drawPos = new Point( -this.m_offset.x, -this.m_offset.y );
this.m_position = new Point;
}
/**
* Sets the position of the BlitObj (in relation to its reference point)
* @param x The x position of the object
* @param y The y position of the object
*/
public function setPos( x:Number, y:Number ):void
{
this.m_position.setTo( x, y );
this.m_drawPos.setTo( x - this.m_offset.x, y - this.m_offset.y ) ;
}
}
blitting 时要注意的一件事是 class 所做的,它处理 offset
。当您向 copyPixels()
函数提供 destPoint
时,它是在绘制之前放置 BitmapData
左上角的位置。但是,通常您希望对象具有与左上角不同的参考点(例如,圆的参考点位于中间)。这可以让你处理。
// create our circle graphics with their registration point in the center
var circleBMD:BitmapData = ...; // get the graphics for your circle
var circle:BlitObj = new BlitObj( circleBMD, new Point( circleBMD.width * 0.5, circleBMD.height * 0.5 ) );
circle.setPos( this.stage.stageWidth * 0.5, this.stage.stageHeight * 0.5 ); // center it on the stage
// now you can draw it:
canvas.copyPixels( circle.blitGraphics, circle.blitGraphics.rect, circle.blitDestPos );