Erasing portion of a rotating BitmapData using AS 3

This is just a little experiment I was doing when working on a new game “Bomb Blitz 2″, the code works fine, but I’m still trying to make it work in my game engine. I hope you can find it usefull.

Here’s the full code, place it in the main timeline and execute it.

?View Code ACTIONSCRIPT
import fl.motion.MatrixTransformer;
 
var eraser:Shape = new Shape();
eraser.graphics.beginFill(0x000000);
eraser.graphics.drawCircle(20, 20, 20);
eraser.graphics.endFill();
 
var toolsize:Number = (eraser.width);
var basepoint:Point = new Point(0, 0);
 
 
var circle:Shape = new Shape();
circle.graphics.beginFill(0x000000);
circle.graphics.drawCircle(500, 500, 500);
circle.graphics.endFill();
 
//draw the picture to the stage
var bg_bmp:Bitmap = new Bitmap();
var bg_bmd:BitmapData = new BitmapData(1000, 1000,true, 0x00FFFFFF);
bg_bmp.bitmapData = bg_bmd;
bg_bmp.smoothing = true;
bg_bmd.draw(circle);
addChild(bg_bmp);
 
var erase_bmd:BitmapData = new BitmapData(toolsize, toolsize, true, 0xFFFFFFFF);
erase_bmd.draw(eraser);
erase_bmd.copyChannel(erase_bmd, erase_bmd.rect, basepoint, 1, 8);
 
//listeners
stage.addEventListener(MouseEvent.MOUSE_MOVE, onMove);
stage.addEventListener(MouseEvent.MOUSE_DOWN, onDown);
stage.addEventListener(MouseEvent.MOUSE_UP, onUp);
stage.addEventListener(Event.ENTER_FRAME, update);
this.addChild(eraser);
 
var erasing:Boolean;
var DtempX,DtempY;
var angle = 0;
function update(ev:Event)
{
	var m:Matrix = bg_bmp.transform.matrix;
 
	m.identity();
 
	angle -= 0.1;
	//trace(angle);
	//MatrixTransformer.rotateAroundInternalPoint( m, 500, 500, -angle );
	m.translate(-500, -500);
	m.rotate(angle*(Math.PI/180));
	m.translate(500, 500);
 
	bg_bmp.transform.matrix = m;
}
 
function onDown(ev:MouseEvent)
{
    Mouse.hide();
    erasing = true;
    erase();
}
 
function onUp(ev:MouseEvent)
{
    Mouse.show();
    erasing = false;
}
 
function onMove(ev:MouseEvent)
{   
    eraser.x = (mouseX - (toolsize * .5));
    eraser.y = (mouseY - (toolsize * .5));
 
    if (erasing)
    {
        erase();
    }
}
 
function erase()
{
    var offset:Point = new Point(bg_bmp.mouseX - (toolsize * .5), bg_bmp.mouseY - (toolsize * .5));
	//trace("x "+bg_bmp.mouseX+" y "+bg_bmp.mouseY);
    var drawRect:Rectangle = new Rectangle(offset.x, offset.y, toolsize, toolsize);
	bg_bmd.copyPixels(bg_bmd, drawRect, offset, erase_bmd);
}

Rotating BitmapData around a given Point with Matrix

Here is the code I’m using to rotate a BitmapData around a given Point with Matrix.
To see how it works you can copy it directly to your main timeline and execute it.

We are creating a Bitmap object to contain the BitmapData object, then we create a circle Shape with a 500 pixels radius, and we draw the circle on the BitmapData object.
In this example I’m rotating the circle’s bitmapdata image around his center point that is x: 500 and y: 500.

In the update function you can see the code I’m using to rotate the bitmapData. I’m using a method provided by a class called MatrixTransformer.
You can see an alternative way to rotate a bitmapdata in the commented code.

?View Code ACTIONSCRIPT
import fl.motion.MatrixTransformer;
 
var bg_bmp:Bitmap = new Bitmap();//create the Bitmap to contain the BitmapData
var bg_bmd:BitmapData = new BitmapData(1000, 1000,true, 0x00FFFFFF);
 
bg_bmp.bitmapData = bg_bmd;
bg_bmp.smoothing = true;
 
var circle:Shape = new Shape();//create a circle shape used to get the BitmapData to roatate
circle.graphics.beginFill(0x000000);
circle.graphics.drawCircle(500, 500, 500);
circle.graphics.endFill();
circle.graphics.lineStyle (2, 0xffffff);
circle.graphics.moveTo (1000, 1000);
circle.graphics.lineTo (0, 0);
circle.graphics.moveTo (0, 1000);
circle.graphics.lineTo (1000, 0);
 
bg_bmd.draw(circle);
addChild(bg_bmp);
 
stage.addEventListener(Event.ENTER_FRAME, update);
 
var angle = 0;
 
function update(ev:Event)
{
     var m:Matrix = bg_bmp.transform.matrix;
 
     m.identity();
 
     angle += 0.1;
     MatrixTransformer.rotateAroundInternalPoint( m, 500, 500, -angle );
     /*m.translate(-500, -500);
     m.rotate(angle*(Math.PI/180));
     m.translate(500, 500);*/
 
     bg_bmp.transform.matrix = m;
 
}

Here you can see the code in action:

Let me see if you know how to improve it, or a better way to do it.
You could notice a little misplacement in the rotation, any comments will be higly appreciated.

New game Bomb blitz released

A fast higly addicting action casual game with a retro pixel style with 8-bit sound FX. Inspired by the old Commodore game “Blitz 16″ mixed with the classic flash game “Helicopter”.

Play it now

You control an airplane flying over a city.
Drop the bomb to destroy city buildings, you can drop one bomb at time.
Avoid enemy airplanes patrolling the sky.
Bonus point for destroying planes or killing men at work.

CONTROL KEYS:
SPACE BAR to control the plane.
X to drop a bomb.

WATCH OUT: YOU CAN DROP ONLY ONE BOMB AT TIME.

The game have been officially sponsored by www.rivalsaga.com and starting from today 16/10/08 it’s available here.

Let’s play.

At the moment you can play the game on too, one of the best flash game portals (and not only) out there.

Play it on Newgrounds.com

Here you can find the sponsored game to download it and put it in your website.

Opening the game lab!

The mitomane’s game lab is officially open.

Let’s play again!