My project loads SWF files using the Loader class, and then loads Sprite objects from those child files. Each sprite has a specific green color, and I want to substitute all pixels of one color for transparent ones.
I can re-compile these Sprites as objects of the BitmapData class, to simplify things, but I'm looking for any way that avoids operating the objects pixel-by-pixel. I'm guessing that I can use some kind of bitmap filter, but I'm just not familiar enough with ActionScript to know specifics.
try threshold with bitmapData of that Sprite.
Before After √
var bmd:BitmapData = new BitmapData(sprite.width, sprite.height, true, 0x0);
bmd.draw(sprite);
bmd.threshold(bmd, bmd.rect, new Point(), "==", 0xff00ff00); // 0xff00ff00 = GREEN
you may change the green color, also you are free to setting more range of colours to be transparented, for example, some kind of detecting smooth corners like this:
just need to play with operation argument of threshold, i used "==", but many others available.
refrences :
Adobe
Doc
Related
I got an swf that has SimpleButtons in the stage, and I need to get the bitmap or bitmapdata information from the button states.
When I load the symbol, it seems that no matter what composes the button states, they are all shapes, at least that's what I get in the expression panel.
So, how can I get the bitmap or bmpdata from a Shape?.
Thanks.
You can use BitmapData#draw() to get BitmapData from any DisplayObject. BitmapData is raster, so be aware you will lose features of the vector Shape
var bd:BitmapData = new BitmapData( shape.width, shape.height );
bd.draw( shape );
If you're targeting FP 11.6 I'd use the method graphics.readGraphicsData as explained here http://www.bytearray.org/?paged=6
I'm trying to see how Starling could benefit the applications I build using as3. My knowledge thus far of Starling is that it only uses bitmap objects not symbol objects. How do I take a BitmapData class and create an starling Image out of it.
This bitmap was a symbol in flash that was converted into bitmap. It then had its properties modified to export for as3
Say there is a Ship BitmapData class in a swc.
According to Starlings documentation of how it handles other bitmap like a png, I would think I should be able to do this.
var myShip:Image = Image.fromBitmap(new Ship());
This of course doesn't work.
fromBitmap() expects to receive a bitmap object but here you are passing in a BitmapData Class. And Image class requires a texture.
Also your syntax is slightly incorrect.
NB. There is Texture.fromBitmap and Texture.fromBitmapData.
Although I haven't tried accessing assets from a swc you could try:
var myShip:Image = new Image(Texture.fromBitmapData(new Ship());
Perhaps try to get the Image appearing first before attempting to access the swc bitmapData
var bd:BitmapData = new BitmapData(100, 100, false, 0xFF0000);
var myShip:Image = new Image(Texture.fromBitmapData(bd);
addChild(myShip); //should display a red square
I am working on a 2D AS3 project, where the different layers are rendered via Stage3D, in a single drawTriangles() call, as a single mesh.
(if you are familiar with the BunnyMark GPUSprite mini render engine, that will give you an idea: http://www.bytearray.org/?p=4074)
What I would like is to draw one of these entire 'render layers', with an overall alpha transparency value, that would apply to ALL triangles drawn, adding to their own alpha values.
IE I am not looking to change the alpha by using textures with alpha transparency or via having to go through setting each triangle separately to have the same alpha: I want a master switch that would affect the alpha value of everything that is drawn? ( something computationally cheap)
Is this possible? Perhaps via a Shader, or a setProgramConstantsFromVector command?
Well you could render your layer to a texture, then you could put this texture on the stage with the alpha you want, this way your whole layer would have the same alpha!
You can do this in two ways, the first way is to render it to a texture, and display that texture with Stage3D and create a shader that adjusts the alpha.
The second way is rendering it to a bitmapData, and displaying it on the normal stage. I'll give an example for this way:
var bmd:BitmapData = new BitmapData(renderWidth, renderHeight, true, 0);
var bit:Bitmap = new Bitmap(bmd);
bit.alpha = 0.5;
addChild(bit);
//In your render loop at the beginning
context3D.renderToBitmapData(bmd);
I'm trying to make a shape available for duplicating. Here's an explanation of what I've done, what I'm trying to do, and where I'm stuck:
Drew a shape manually in the Flash IDE (paintbrush).
Created a new movieclip containing the shape; exports as a class.
Instantiate the class (var mc:MovieClip = new shapeMovieClip()).
Add a reference to the shape in mc that I want (var myShape:Shape = mc.getChildAt(0) as Shape;
This works perfect and I now have my shape, but how can I duplicate it without instantiating the parent MovieClip class - is it possible?
I've tried creating a new shape and using the copyFrom() graphics method with no avail, I believe this method just copies draw calls when they're made on the referenced graphics and instead I just have a reference of a shape that's already been drawn.
Right now I'm extending the movieclip as a sprite instead, instantiating, pulling the shape from the parent and saving its reference, and then nulling the sprite. Does anyone know of a better, more lightweight, strategy for duplicating Shapes in this manner?
Basically depends on whether you need to scale your shapes. If you don't, and you can work it out with a fixed sized bitmap representation of the shape, then you will get much better performance drawing your shape to a BitmapData (it's called rasterisation) and instanciating Bitmap objects (as other commenters have pointed out). The code would go something like this:
var base:Sprite = new shapeMovieClip();
var bmd:BitmapData = new BitmapData(base.width, base.height, true, 0);
bmd.draw(base);
var clip1:Bitmap = new Bitmap(bmd);
var clip2:Bitmap = new Bitmap(bmd);
If you do need to scale the clips, you will get pixelation using bitmaps. When scaling down Bitmap.smoothing can help to some extent (also when rotating), but if you need to scale up, you will probably have to use some kind of mip-mapping. This is basically creating a few bitmaps of the shape at different scale levels, and then swap them depending on the current scale. Coding this has some complexity (using a helper parent to adjust the scale can help) but it will definitely perform better than using many shape symbols (with or without a sprite parent).
This is very old, but it still comes up high in Google, so I just wanted to share a true shape duplicating method:
var shapeonstage:Shape = shapeMadeInIDE;
var g:Vector.<IGraphicsData> = shapeonstage.graphics.readGraphicsData();
var shapecopy:Shape = new Shape();
shapecopy.graphics.drawGraphicsData(g)
And boom. It works. Had to share this because it would have helped me a looooong time ago and in so many ways.
UPDATE:
There is some clarification I'd like to add why you would want to use this method, for duplicating AND for storing references to Shapes that are within an swf.
If you target a Shape object on the stage or in a movie clip, the Flash Rendering engine does something strange. It will RECYCLE Shape objects to render new graphics thus making your Shape reference point to a COMPLETELY different rendering.
For example:
Create an fla with a movieclip.
Inside the movie clip make 10 frames.
On each frame, draw a different shape
In your code, get a reference to the shape (The Shape on Frame 1)
Draw and verify your shape (draw to a bitmap then put the bmp on stage)
Now let the flash engine play for 5 frames
Draw and verify your shape again
The second time you draw your shape without EVER reassigning your shape reference, will SOMETIMES yield a completely different shape.
Just know, this little quirk can leave you pulling your hair out if you don't know what you're looking for :)
As of right now. I have 3 objects. One BitMap that acts as my canvas. And 2 bitmapDatas. One is my buffer and another is my tiles. I am creating a tiling effect for a game. I would like to take my tile:BitMapData, and turn it into a custom object. reason being is I want each tile to be interactive. So I can click on each one. Is it possible to turn my bitMapData that represents a tile, into a custom object that has properties and methods. Sort of like a movie clip. and draw it into my buffer ?? Could I create a new class that extends bitMapData ?? Or would I have to get rid of the buffer and draw the tile objects directly into the BitMap ??
In other words, what is the best way to put Sprite or a tile into a BitMapData object or even a Bitmap.
First of all, BitmapData and Bitmap are not interchangeable. They are two very different things. The BitmapData class contains bitmap pixel data, and allows you to manipulate that pixel data, e.g. draw to it, change the color of particular pixels, et c. There is no way of displaying a BitmapData directly, i.e. by adding it to the display list.
The Bitmap class, on the other hand, is a DisplayObject, like MovieClips and Sprites, which you can add to the display list. It's single purpose is to render a BitmapData in the display list. In fact, it is not even interactive, so you cannot detect clicks directly on a Bitmap instance, for example.
On to your question: If you have a bitmap data that contains a tile sprite, and you want to draw that tile in another bitmapdata, you can use the BitmapData.draw() method, or the BitmapData.copyPixels() method. The latter is one of the fastest methods you can use on any BitmapData, so I would highly recommend it.
Depending on your particular application, it might not be beneficial to draw everything in a bitmap at all. It sounds as if you want to be able to detect click events on all the tiles, which makes me think that you would probably benefit from having them be separate DisplayObjects, e.g. Sprites.
If you want to, you can create a Tile class that extends Sprite, and draws a BitmapData using a bitmap fill. That way, you can have any properties you want, and also detect mouse events on the tile instances.
package
{
/* ... imports ... */
public class Tile extends Sprite
{
private var _solid : Boolean;
public function Tile(bmp : BitmapData, solid : Boolean)
{
this.graphics.beginBitmapFill(bmp, null, false, true);
this.graphics.drawRect(0, 0, bmp.width, bmp.height);
_solid = solid;
}
/**
* Sample custom property. Could be used to define whether a tile
* is solid, e.g. the player cannot pass it.
*/
public function get isSolid() : Boolean
{
return _solid;
}
}
}
This class could simply be instantiated for every tile in your game, passing in the bitmap data that should be drawn in the tile. You could also listen for events on such a tile instance.
var tile : Tile;
tile = new Tile(myBitmapData, false);
tile.x = 200;
tile.y = 200;
tile.addEventListener(MouseEvent.CLICK, handleTileClick);
addChild(tile);
This way, you don't have to use the Bitmap class at all to render the tiles. They can be added directly to the display list.
I figure a better solution for when you want to select certain parts of the tile without effecting the position of the sprite itself
theMatrix.translate(30,0);
this.graphics.beginBitmapFill(tileImage,theMatrix);
//this.graphics.drawRect(0, 0,tWidth ,tHeight );
this.graphics.endFill();
Your right, leave drawRect at 0, 0. using Matrix.Translate, allows you to move the positioning of what part of the tile you want, without affecting the sprite position itself.