Just a quick question:
which of the following method of create a sprite have quick rendering and less memory usage?
Add bitmap to the sprite
var sprite:Sprite = new Sprite();
var bitmap:Bitmap = new Bitmap();
sprite.addChild(bitmap);
vs
Draw rectangle and fill with bitmapData
var bitmapData:Bitmapdata = new BitmapData(100, 100);
var sprite:Sprite = new Sprite();
sprite.graphic.drawRec(0, 0, 100, 100);
sprite.graphic.beginFillBitmap(bitmapData:Bitmapdata);
sprite.graphic.endFill();
Thanks for any idea.
The first one is faster because vector rendering mathematics are required to fill your shape in the latter.
If you want noticeable (and I mean very noticeable) performance gains, you should have one Bitmap on the stage. What you do from there is store references to BitmapData to represent graphics, and sample those onto your one Bitmap via .copyPixels().
Example:
// This is the only actual DisplayObject that will hit the Stage.
var canvas:Bitmap = new Bitmap();
canvas.bitmapData = new BitmapData(500, 400);
addChild(canvas);
// Create some BitmapData and draw it to the canvas.
var rect:BitmapData = new BitmapData(40, 40, false, 0xFF0000);
canvas.bitmapData.copyPixels(rect, rect.rect, new Point(20, 20));
Related
I have a sprite that is drawn in random and complicated way. Pixels would be either transparent or not. And now I need to check if pixel new Point(10, -5) is transparent or not.
How can I do that ?
This is not for collision detection.
I also draw in the negative area of the sprite graphics. It is not centered.
Solution:
The main problem was the drawing in negative area. I figured it out myself:
var bitmapData: BitmapData = new BitmapData(sprite.width, sprite.height, true, 0x0);
var rect: Rectangle = sprite.getBounds(sprite);
var mat: Matrix = new Matrix();
mat.translate(-rect.left, -rect.top);
bitmapData.draw(sprite, mat);
bitmapData.getPixel32(xCoordToTest - rect.left, yCoordToTest - rect.top);
// etc
Create new BitmapData object and draw your sprite onto it. Then check desired BitmapData pixel.
var bitmapData:BitmapData = new BitmapData(mySprite.width,mySprite.height,true,0x00000000);
bitmapData.draw(mySprite);
bitmapData.getPixel32(10,5);
Just like SzRaPnEL says, draw your sprite into a BitmapData object with the 3rd parameter set to true (enabling transparency).
Then...
var pixelValue:uint = bitmapData.getPixel32(xCoordToTest, yCoordToTest);
var alphaValue:uint = pixelValue >> 24 & 0xFF;
According to the BitmapData online docs, that should work...
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/BitmapData.html#getPixel32()
I'm drawing bitmaps of movieclips which I then feed into my hittest function to test for collisions. However, I'm not quite sure how i would add to the code below to take into account and draw bitmaps for movieclips which have been scaled and/or rotated. The below code obviously only works for non-transformed movieclips. I've included in comments code which i've already tried but to no success.
When adding the drawn bitmap to the stage, no matter whether the movieclip in question is transformed or not, the drawn bitmap is "cut off" and incorrectly drawn - it appears to only draw a section of it. However, this does not particularly affect the collision testing for the non-transformed movieclips, but has an adverse effect on transformed movieclips.
All of the movieclips I want to be drawn have been created through the graphics property.
//for example:
var mymc:MovieClip = new MovieClip();
var g:Graphics = mymc.graphics;
g.moveTo(0,0);
g.lineTo(17.5,0);
g.lineTo(8.75,17.5);
g.lineTo(-8.75,17.5);
g.lineTo(0,0);
main code:
for each(var mc:MovieClip in impassable) {
//var bMatrix:Matrix = new Matrix();
//bMatrix.scale(mc.scaleX, mc.scaleY);
//bMatrix.rotate(mc.rotation * (Math.PI/180));
var bData:BitmapData = new BitmapData(mc.width, mc.height, true, 0);
//bData.draw(mc, bMatrix);
bData.draw(mc);
var bitmap:Bitmap = new Bitmap(bData);
bitmap.x = mc.x;
bitmap.y = mc.y;
var HitTest:Number = newCollision(bitmap, centerX, centerY, 13.7);
Any thoughts? thanks
This function will create a BitmapData clone of a DisplayObject, taking into account its transform matrix, though it doesn't take into account bitmap filters. (Based on this answer.)
function createBitmapClone(target:DisplayObject):BitmapData {
var targetTransform:Matrix = target.transform.concatenatedMatrix;
var targetGlobalBounds:Rectangle = target.getBounds(target.stage);
var targetGlobalPos:Point = target.localToGlobal(new Point());
// Calculate difference between target origin and top left.
var targetOriginOffset:Point = new Point(targetGlobalPos.x - targetGlobalBounds.left, targetGlobalPos.y - targetGlobalBounds.top);
// Move transform matrix so that top left of target will be at (0, 0).
targetTransform.tx = targetOriginOffset.x;
targetTransform.ty = targetOriginOffset.y;
var cloneData:BitmapData = new BitmapData(targetGlobalBounds.width, targetGlobalBounds.height, true, 0x00000000);
cloneData.draw(target, targetTransform);
return cloneData;
}
When you call successive transforms on a Matrix, the ordering is very important and can really mess things up.
Luckily there is a helper method that allows you to specify translation, rotation and scaling in one go and avoid those issues - createBox
For your case, something like this:
var matrix:Matrix = new Matrix();
matrix.createBox(mc.scaleX, mc.scaleY, mc.rotation*Math.PI/180, 0, 0);
(the two zeros are for x and y translation)
I want to draw my stage as a new bitmap.
How can I cut the top bar of the stage (height of my top bar is 100 pixels) and draw it as a new bitmap?
Well you could do this by adding everything you want in the bitmap to a sprite and then you do this:
var stageSprite:Sprite = new Sprite();
addChild(stageSprite);
//Creates the sprite you want to draw
stageSprite.addChild(objectsYouWantToDraw);
//Here you add the objects you want to draw to the sprite
var bmd:BitmapData = new BitmapData(stage.stageWidth, 100, true, 0);
var bit:Bitmap = new Bitmap(bmd);
addChild(bit);
//Create a bitmap with your size
bmd.draw(stageSprite);
//Draw the objects to a bitmap
You could optionally add a matrix if you want to get another portion of the screen.
var m:Matrix = new Matrix();
m.translate(-xOffset, -yOffset);
bmd.draw(stageSprite, m);
//Draw the objects to a bitmap with the offsets you want
I'm having a bit of a problem copying the masked only pixels from one bitmap onto another. Basically I'm masking bitmap A with bitmap B, which is working fine, but I'm unsure how to copy just the masked pixels onto Bitmap C which is the only one I want to keep.
//all this works fine
var _texture:Bitmap = new Bitmap(new Dirt_Bitmap);
var _mask:Bitmap = new Bitmap(new Mask_Bitmap);
var _planter:Bitmap = new Bitmap(new Planter_Bitmap);
_texture.cacheAsBitmap = _mask.cacheAsBitmap = true;
_texture.mask = _mask;
//This is where things get weird :[
var newBitmap:Bitmap = new Bitmap(new BitmapData(50, 50, true));
newBitmap.bitmapData.copyPixels(_texture.bitmapData, _texture.bitmapData.rect, new Point());
_planter.bitmapData.copyPixels(_newBitmap.bitmapData, _newBitmap.bitmapData.rect, new Point());
how would I go about just copying or drawing or maybe merg() just the masked texture so its copied over the planter graphic where the dirt should be? Any and all help will be greatly appreciated! :]
When you use copyPixels, you are actually copying the content of a bitmap without anything that's added by environment (no masking or transforms).
Use draw() instead.
Here's a sample:
var texture:Bitmap = new Bitmap(new BitmapData(200, 200, false, 0xFFFF0000));
var imageMask:Bitmap = new Bitmap(new BitmapData(200, 200, true, 0));
var rect:Rectangle = new Rectangle(0, 0, 10, 10);
imageMask.bitmapData.fillRect(rect, 0xFF000000);
rect.x = 50;
rect.y = 50;
imageMask.bitmapData.fillRect(rect, 0xFF000000);
texture.cacheAsBitmap = true;
imageMask.cacheAsBitmap = true;
texture.mask = imageMask;
addChild(imageMask);
addChild(texture);
var planter:Bitmap = new Bitmap(new BitmapData(200, 200, true, 0));
// that's it
planter.bitmapData.draw(texture);
addChild(planter);
planter.x = 100;
I have a movieclip on stage that I draw into a bitmap, how do I change the registration point, the code below produces bitmap with half chopped off:
var bitmapData:BitmapData = new BitmapData(mc.width, mc.height, true, 0x00FFFFFF);
var matrix:Matrix = new Matrix();
matrix.translate(0, -mc.height/2);
bitmapData.draw(mc, matrix);
var bitmap = new Bitmap(bitmapData);
addChild(bitmap);
I found this excellent article from Mike Chambers on bitmapData.hitTest and how to check for collisions after transformations have been made to the display objects, all sorted now:
http://www.mikechambers.com/blog/200...ion-detection/