How do I make transparent background to imported image in flash, because now i imported it and image has white box around it.
code for adding images to stage
var imageBD = (Math.floor(Math.random()*2))? new Trees() : new Rocks;
var bitmap:Bitmap = new Bitmap();
var BD:BitmapData = new BitmapData(imageBD.width, imageBD.height);
BD.draw(imageBD);
bitmap.bitmapData = BD;
bitmap.width = mRadius * 2 * mToPx;
bitmap.height = mRadius * 2 * mToPx;
bitmap.x = pxStartX;
bitmap.y = pxStartY;
this.addChild(bitmap);
obstacleImages.push(bitmap)
Since i'm mew i cannot post images so i'm giving you a link to image:http://prntscr.com/pugdl
You need to specifically tell the BitmapData (docs) object to be transparent.
In your case, replace this line:
var BD:BitmapData = new BitmapData(imageBD.width, imageBD.height);
...with this:
var BD:BitmapData = new BitmapData(imageBD.width, imageBD.height, true, 0x00000000);
Make sure the image itself has transparency. General file types for these kinds of images are PNG or GIF.
You shouldn't have to do anything for Flash to find the transparency.
Related
I wonder how I can create an "Adjust Color"-filter in AS3.
I created a red box in Photoshop (8x8px), saved it as a PNG-file, then I imported it to Flash. I converted the file to a MovieClip-symbol. I applied an "Adjust Color"-filter. With that I can change the color easily, but I want to get the same effect in AS3.
Does anyone have a clue on how?
Thanks:)
To change MovieClip color use ColorTransform class and transform.colortransform property of the MovieClip:
var ct:ColorTransform = new ColorTransform();
ct.color = 0xCFFF54;
yourMovieClip.transform.colorTransform = ct;
Advanced method
Using this method you can change brightness, contrast, etc.
import fl.motion.AdjustColor;
var adjustColor:AdjustColor = new AdjustColor();
adjustColor.brightness = 50;
adjustColor.contrast = 50;
adjustColor.saturation = 50;
adjustColor.hue = 50;
var matrix:Array = adjustColor.CalculateFinalFlatArray();
var colorMatrix:ColorMatrixFilter = new ColorMatrixFilter(matrix);
yourMovieClip.filters = [colorMatrix];
i've testing some code in using createjs + box2dweb, i exported a vector ball in blue color drawn by flash cs 6, here is part of the code.
var birds = (function() {
var spawn = function() {
//circle = new lib.ball1();
//var birdBMP = new createjs.Bitmap("images/bird.png");
var birdBMP = new lib.ball1();
birdBMP.x = Math.round(Math.random()*500);
birdBMP.y = -30;
birdBMP.regX = 60.75; // important to set origin point to center of your bitmap
birdBMP.regY = 60.75;
birdBMP.snapToPixel = true;
birdBMP.mouseEnabled = false;
stage.addChild(birdBMP);
box2d.createBird(birdBMP);
}
return {
spawn: spawn
}
})();
here i want to do change the color of the blue ball, how can i do that?
******updated*******
inclucde js
change code
birdBMP.cache(0, 0, 121.5, 121.5);
colorRan1 = Math.round(Math.random()*255);
colorRan2 = Math.round(Math.random()*255);
colorRan3 = Math.round(Math.random()*255);
birdBMP.filters = [
new createjs.ColorFilter(0,0,0,1, colorRan1,colorRan2,colorRan3,0)
];
birdBMP.updateCache();
I don't know too much about the createjs Flash Extension, but I highly suspect, that from the Flash Export there is also no way to simply "change" a color - you have probably three options:
1) ColorMatrixFilter - this involves caching ect. and I wouldn't recommend this for your purpose.
2) Draw another ball in the desired color and change the Bitmap to that other (differently colored) ball.
3) Or if it is a simple shape you can use the exported lib.ball1() method and extend it with a color-parameter. - In that case you would also have to change the references bitmap/shape, if you want to change the color post-creation.
I've got problem with transparent using PNGEncoder class. When I encode BitmapData to png and use it as source of my Image, it looks terrible. I attach example. There are two images - first colorful and above him white with alpha gradient.
Image before save
Image after save
I've used some other libraries like AsPngEncoder, but it didn't help. It's code I use:
var bd:BitmapData = new BitmapData(container.width, container.height, true, 0xffffff);
bd.draw(container);
var pngenc:PNGEncoder = new PNGEncoder();
var pngByteArray:ByteArray = pngenc.encode(bd);
container.source = pngByteArray;
var fl:File = File.applicationStorageDirectory.resolvePath("./images/file.png");
var fs:FileStream = new FileStream();
fs.open(fl, FileMode.WRITE);
fs.writeBytes(pngByteArray);
fs.close();
Try to use new Flash Player 11.3 feature
http://help.adobe.com/en_US/as3/dev/WS4768145595f94108-17913eb4136eaab51c7-8000.html
I have a number of objects (represented as DisplayObjects) that i wish to blend with eachother.
However behind these objects there is a background that i do not want to involve in the blending.
So basically i want to blend these objects with eachother and afterwards use the result of this blending as a new DisplayObject (for example to put it on top of a randomly colored background).
So what i have is:
var obj1:DisplayObject = getFirstObj();
var obj2:DisplayObject = getSecObj();
var background:DisplayObject = getBackground();
obj1.blendMode = BlendMode.ADD;
obj2.blendMode = BlendMode.ADD;
A first attempt i tried was putting these objects into a common DisplayObjectContainer hoping that blending mode would only be relative to all objects contained by the same DisplayObjectContainer, but this does not seem to be the case.
var objectsPool:Sprite = new Sprite();
objectsPool.addChild( obj1 );
objectsPool.addChild( obj2 );
addChild( background );
addchild( objectsPool );
So that diddent get me anywhere.
Any help is appreciated.
EDIT: changed DisplayObjectContainer to Sprite in the last code snippet
If you put the objects into a container, and remove it from the stage, you can then draw it with the BitmapData class and create a new Bitmap object representing the combination. This will have a transparent background, and it's blendMode will be normal, allowing you to use it on the background.
var obj1:DisplayObject = getFirstObj();
var obj2:DisplayObject = getSecObj();
var background:DisplayObject = getBackground();
obj1.blendMode = BlendMode.ADD;
obj2.blendMode = BlendMode.ADD;
var objectsPool:DisplayObjectContainer = new DisplayObjectContainer();
objectsPool.addChild( obj1 );
objectsPool.addChild( obj2 );
var bmd:BitmapData = new BitmapData(objectsPool.width,objectsPool.height,true,0);
bmd.draw(objectsPool);
var drawnObject:Bitmap = new Bitmap(bmd);
addChild( background );
addchild( drawnObject );
(untested code, good luck)
Rather going to the effort of drawing a Bitmap yourself, there are options that cause Flash to rasterize a layer and it's children automatically. Try:
container.cacheAsBitmap = true;
or try:
container.blendMode = "layer";
or try:
container.filters = [new GlowFilter(0,0,0,0)];
Any of those options should cause the children to render into a Bitmap under the hood, invalidating their individual blend modes/effects on the background.
I want to randomly set the color for a MovieClip in ActionScript 3. How would I go about doing so?
Example with some colors in a array:
var colorArray:Array = new Array(0xFFFF33, 0xFFFFFF, 0x79DCF4, 0xFF3333, 0xFFCC33, 0x99CC33);
var randomColorID:Number = Math.floor(Math.random()*colorArray.length);
var myColor:ColorTransform = this.transform.colorTransform;
myColor.color=colorArray[randomColorID];
myMovieClip.transform.colorTransform = myColor;
Change the myMovieClip to the instance name oof your movie clip, if you want you could add a click event to change the random colors.
I know your post is old, but i just figured this out.
You don't need to create your own color array, you can steal it from the colorpicker.
import fl.controls.*;
var _lineWeight:Number = 20;
var cp:ColorPicker = new ColorPicker();
var randomNumber:Number = Math.random() * cp.colors.length;
var drawing:Shape = new Shape();
drawing.graphics.lineStyle(_lineWeight,cp.colors[randomNumber]);