Image Transperancy in bitmapData

Folloing are the excerpts of my code in AS2:
I have image1 as and image2 on my stage. The image2 is a
transparent GIF and works good transparantly when moved, roatated
etc. this image2 is merged over image1 on a button click instance.
Problem with the source is that as soon as the image is
merged it (image2) looses its transparancy and converted to opaque
again. How to resolve this issue?

thanks roth! u people are really great, how and where from do
u learn all this?
One more problem,
JPG is loaded in my MC, I resized it on rollover to fit on my
required diameter, but when i merge this resized MC/JPG using
BitmapData, the MC does not change but the jpg takes back its
original size which caused trimmed graphic to display on merged
image. I know i am doing something wrong but what and where i dont
know. pl help

Similar Messages

HOW TO MAKE IMAGE TRANSPERANT

Hello All,
I have two images one as background and another one is to
place on background image.
Upper one I need transperant. How to write code to
make image transperant?
CAN ANY ONE HELP?
Sharmila.

If you want to do on the fly image transparencies then you want to look in the java.awt.image package. There is are some pretty powerful image filters in here and after the initial learning curve, it isn't terribly complex to create your own image filters. For a school group project we created a logic puzzle game based on a shareware program alreay out there. The shareware program had a tileset format that we wanted to use in our application, but the transparencies weren't set up correctly. We ended up adding the transparencies on the fly. I wish I had the piece of code handy but I can remember enough to point you on the right path.
If you subclass java.awt.image.ImageFilter and override the two setPixels() methods, you can provide any manipulation you need to. Basically the image producer will pass in the pixels in one huge byte (or int) array top left to bottom right order. What we did, was get the color out of the first pixel and make that our transparency color. The byte method has two bits per color while the int method has 8 bits per pixel. The color is divided into r(ed), g(reen), b(lue), a(lpha) (I can't remember if alpha was first or last, a little expirimentation will tell you). The alpha is opaque at one extreme and fully transparent at the other extreme. Loop through the array and if the color is the same as your first pixel then set the alpha to 0 (or was it 15/255?).
Good luck!

How to capture an image and save it using action script

Hello,
I need to know if is posible to capture an image or a screen region and save it using action scrip.
Somebody know how to do it ??
Thanks

you can capture an image using the bitmapdata class and getPixel(). you can then save that to a bitmap using server-side code like php.

Image content not defined in TileList

I have two images on a canvas, one is directly on the canvas using inline code, the other is embedded in a tilelist. Both images render. When I click and drag the inline image, the drag proxy appears normally. When I click and drag the image in the tile list, I get an error when I try to make a copy of the bitmap. This is occurring because the content of the image in the tile list is NULL, even though the source value is correct and the image has been loaded. I'm assuming this is some sort of itemRenderer issue, but I'm not clear on how it retains the source of the image, but not the content. If it's duplicating the image and referencing another bitmap, how do I access that bitmap?
The code is below with the exception of the image.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
<mx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;
        import mx.managers.DragManager;
        import mx.core.DragSource;
        [Bindable] private var images:ArrayCollection=new ArrayCollection;
            private function init():void{
                i.source="images/1.png"; //set image source that is placed directly on canvas, this image has a drag proxy
                var i2:Image=new Image; //create new image to be added into tile list, this image does not have a valid drag proxy because content is missing
                i2.source="images/1.png";
                images.addItem(i2);
            private function mouseMoveHandlerTileList(event:MouseEvent):void
                var tl:TileList=TileList(event.currentTarget);
                var image:Image=tl.selectedItem as Image;
                if (image){
                    //Here the image contains the correct source, but no content.
                    initiateDrag(event, image);
            private function mouseMoveHandlerImage(event:MouseEvent):void
                var image:Image=Image(event.currentTarget);
                if (image){
                  //Here the image does contain content
                    initiateDrag(event, image);
            private function initiateDrag(event:MouseEvent, image:Image):void{
                    var dragInitiator:Image=image;
                    var ds:DragSource = new DragSource();
                    ds.addData(image, "item");
                    var dragProxy:Image = new Image;
                    var data:BitmapData=Bitmap(image.content).bitmapData.clone(); //image.content is not null for imageon canvas, but is null for image in tile list
                    dragProxy.source=new Bitmap(data);
                    DragManager.doDrag(dragInitiator, ds, event, dragProxy);
    ]]>
</mx:Script>
    <mx:Canvas id="c" width="100%" height="100%">
        <mx:Image id="i" mouseMove="mouseMoveHandlerImage(event)" x="400" y="400"/>
        <mx:TileList id="t" dataProvider="{images}" mouseMove="mouseMoveHandlerTileList(event)"
            x="0" y="0"
            >
            <mx:itemRenderer>
                <mx:Component>
                    <mx:Image source="{data.source}"/>
                </mx:Component>
            </mx:itemRenderer>
            </mx:TileList>
    </mx:Canvas>
</mx:Application>

If this post answered your question or helped, please mark it as such.
Accessing items in containers when renders are used can be problematic, because Flex recycles the items for large data sets.
So this code works fine but uses a Repeater. You may have to do some thinking to rework your concept, but this works:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
    <![CDATA[
      import mx.collections.ArrayCollection;
      import mx.managers.DragManager;
      import mx.core.DragSource;
      [Bindable] private var images:ArrayCollection=new ArrayCollection([
        "assets/images/BobSmith.jpg"
      private function mouseMoveHandlerTileList(event:MouseEvent):void {
        var image:Image=Image(event.currentTarget);
        if (image){
          initiateDrag(event, image);
      private function mouseMoveHandlerImage(event:MouseEvent):void {
        var image:Image=Image(event.currentTarget);
        if (image){
          initiateDrag(event, image);
      private function initiateDrag(event:MouseEvent, image:Image):void{
        var dragInitiator:Image=image;
        var ds:DragSource = new DragSource();
        ds.addData(image, "item");
        var dragProxy:Image = new Image;
        var data:BitmapData=Bitmap(image.content).bitmapData.clone(); //image.content is not null for imageon canvas, but is null for image in tile list
        dragProxy.source=new Bitmap(data);
        DragManager.doDrag(dragInitiator, ds, event, dragProxy);
    ]]>
</mx:Script>
<mx:HBox>
    <mx:Canvas id="canvas" width="400" height="600" borderColor="0x000000" borderStyle="solid" borderThickness="3">
      <mx:Repeater id="rp" dataProvider="{images}">
        <mx:Image id="img" source="{rp.currentItem}" mouseMove="mouseMoveHandlerTileList(event)"/>
      </mx:Repeater>
    </mx:Canvas>
    <mx:Image id="i" mouseMove="mouseMoveHandlerImage(event)" source="assets/images/BobSmith.jpg"/>
</mx:HBox>
</mx:Application>

Can I use sprites on images in Flash?

Hi, I'm designing a calculator-like application in Flash for a school IT project. I made the layout in photoshop, and want to lay out the buttons with sprites (was just on CSS so addicted to those things xD ). I've tried googling and have found something like you can use sprites like buttons (which is good), but I can't figure out how to apply bitmaps to sprite backgrounds vs. plain colors. Can anyone help me with this?
Thanks!

It doesn't have an event listener then, though? Like there's no automatic button down state; if I wanted to use it I'd have to do mouseUp and mouseOut and mouseDown events separately right?
By the way, it's just for confirmation. I found a work around, using my own code. Essentially, you set the source image (eg "BImage" in library) and this function returns a bitmap image
function getSprite(imageSource, xPosition, yPosition, widthValue, heightValue):Bitmap {
          var bitmapOfSource:Bitmap = new Bitmap(new imageSource); //converts the image in the library to a bitmap file/variable/object
         var bitmapDataOfSource:BitmapData = bitmapOfSource.bitmapData; //gets the bitmapdata, which is required to "crop" the image
         var croppedBitmapData:BitmapData = new BitmapData(widthValue, heightValue, true, 0x00000000); //creates a new bitmapdata object/variable which will have the proper height and width
          var cropRectangle:Rectangle = new Rectangle(xPosition, yPosition, widthValue, heightValue) //defines the rectangle to be cropped out, which will be used later
         var positionPoint = new Point(0, 0) //defines the point where the cropped rectangle will be placed, to be used later
          croppedBitmapData.copyPixels(bitmapDataOfSource, cropRectangle, positionPoint); //copies the specified pixels and sets them to the new bitmapdata object (if your parameters were BImage, 0, 0, 50, 50; this would crop a square side length 50, from position 0, 0 of BImage)
          var finalBitmap:Bitmap = new Bitmap(croppedBitmapData) //converts the new bitmapdata object to a useable bitmap
          return finalBitmap
stage.addChild(getSprite(BImage, 0, 0, 320, 240));
Is my code, if anyone is looking for the same thing. Like CSS xD give it the background image, then the x, y, width, and height, and it'll just print out that portion of the image. Of course, if there's native support, I'd want to use that, which is why I'm double checking. Sorry if I'm being/making you repeat the same thing over and over :/ If you don't reply I'll just assume there isn't native support for sprite down states... already been very helpful. Thanks once again!

AlivePDF seems to flip image alond axis?

Hi,
In my flash file, I allow the user to rotate an image. After the image is rotated, the user can save the edited image as a PDF. I'm using AlivePDF for saves.
Here is the problem: If the user rotates in the X or Y, the pdf image looks flipped along the respective axis(for example, if I rotate in the X, the image looks like it rotated properly, but the perspective is reversed). If the rotation is in the Z, there is no issue. The event listeners are attached to slider components.
Here is an image to clarify-
My question: How can I get the image to render properly in the PDF?
Rotate Code:
//rotate logo around the X axis
logoRotX.text = "Rotate X: 0"
logoRotateX.value = 0;
logoRotateX.addEventListener(SliderEvent.CHANGE, logoRotateXPos);
function logoRotateXPos (event:SliderEvent): void
    logoRotX.text = "Rotate X: " + event.target.value;
    container.rotationX = event.target.value;
//rotate logo around the Y axis
logoRotY.text = "Rotate Y: 0"
logoRotateY.value = 0;
logoRotateY.addEventListener(SliderEvent.CHANGE, logoRotateYPos);
function logoRotateYPos (event:SliderEvent): void
    logoRotY.text = "Rotate Y: " + event.target.value;
    container.rotationY = event.target.value;
//rotate logo around the Z axis
logoRotateZ.value = 0;
logoRotateZ.addEventListener(SliderEvent.CHANGE, logoRotateZPos);
function logoRotateZPos (event:SliderEvent): void
    logoRotZ.text = "Rotate Z: " + event.target.value;
    container.rotationZ = event.target.value;
Save PDF code:
createPdfBTN.addEventListener(MouseEvent.CLICK, makePDF);
function makePDF(evt: MouseEvent)
var myPDF : PDF = new PDF (Orientation.PORTRAIT,Unit.INCHES, Size.LETTER);
myPDF.setDisplayMode(Display.FULL_PAGE);
myPDF.addPage();
// add a background image
var PDFsampleData: BitmapData = new BitmapData(BGContain.width, BGContain.height);
    PDFsampleData.draw(BGContain);
var PDFjpg:JPGEncoder = new JPGEncoder(100);
var PDFba:ByteArray = PDFjpg.encode(PDFsampleData);
var timesbold:IFont = new CoreFont(FontFamily.TIMES_BOLD);
myPDF.addImage(BGContain);
myPDF.setFont(timesbold, 12);
myPDF.addText("Disclaimer: This image is for visualization purposes only and is not a proof.",.5,10);
// save PDF
var fileReference:FileReference = new FileReference();
var pdfByteArray = myPDF.save(Method.LOCAL);
fileReference.save(pdfByteArray, 'Your Sample.PDF');

I fixed this by using ScaleX and ScaleY instead of rotateX and rotateY. Now, the PDF renders fine.

Show image quality as like original image after resize in as3.

Hi Guys,
I am working on a Action Script3 project and i am showing images after resizing. I am using Bitmap and BitmapData manipulation for this but not getting image quality as like original image. Please guide and help me with code that how can i do this.
Thanks & regards
Rangrajan

How are you resizing? Normally, you would draw the original bitmap data into the new bitmap data, using a matrix to resize. To smooth scale, you need to use the smoothing option of the draw method. Here's a little sample that takes a library image and scales it to 500x500, using smoothing:
var orig:BitmapData = new baseMap(); //library image
var res:BitmapData = new BitmapData(500,500);
var m:Matrix = new Matrix();
m.scale(res.width / orig.width, res.height / orig.height);
res.draw(orig, m, null, null, null, true);
var c:Bitmap = new Bitmap(res);
addChild(c);
toggle the true to false in the draw, to see the difference...

Save images into database

hello, i have been fighting with this for some days, i have a picture that i load with de filerence.load method. and then,
i use the filereference.data to show the picture into the image control.
i need to save the image into database, but i can't. i don't know how i can convert the bytearray into hexa string or binary!!!

Hi Sai,
I am getting the error ArgumentError: Error #2015: Invalid
BitmapData. When I am trying to change the image into byteArray using
BitMapData.
Below is the code i am using for this scenario. I am trying to get
byteArray of the image after the image is completely loaded in the
onComplete().
private function initFunction(event:Event):void{
uploadFile =new FileReference();
imgTypes=new FileFilter("images(.JPG,.JPEG,.PNG,.GIF)",*
".JPG;.JPEG,.PNG;.GIF;"*);
private function browseFile():*void
uploadFile.addEventListener(Event.SELECT, onFileSelected);
*try
uploadFile.browse();
catch(err:Error)
logData(err.message);
private function onFileSelected(event:Event):*void
uploadFile.addEventListener(ProgressEvent.PROGRESS, onProgress);
uploadFile.addEventListener(Event.COMPLETE, onComplete);
uploadFile.load();
private function onProgress(event:ProgressEvent):*void
logData("Loaded " + event.bytesLoaded + " of " + event.bytesTotal + *"
bytes."*);
private function onComplete(evt:Event):*void
logData("File was successfully loaded.");
*//image.source = uploadFile.data;
image.source=uploadFile.name;
Alert.show("image source:"+image.source);
var bitmapData:BitmapData = new BitmapData(image.width,image.height);
var ba:ByteArray = png.encode(bitmapData);
Alert.show("bytes loaded"+ba);
Thanks,
Ravi.
On Sat, Nov 20, 2010 at 9:19 PM, ravindharreddy Baddam <

Animate an image

I have a read a few ways to animate an image in AS3 and not sure what is the most efficient way.
I want to load 4 images(in 4 files) in a class. Each image is a different frame of a walking movement of a character. What I want to do is load all the images in the constructor and assign the sprite the current frame to display.
eg sprite=bitmap1 then after some time swap images so
sprite=bitmap2 then after some time swap images so etc
sprite=bitmap3....
Is this the logic you do in AS3?
The code loads 1 image so I can change this to 4 images to load (4 bitmaps and 1 sprite for the current frame?)
private var sp:Sprite=new Sprite();
          public function ClassImg2(myimg:String,xx:int,yy:int)     {
          img1=myimg;
               myx=xx;
               myy=yy;
          var loader:Loader = new Loader;
          loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
          loader.load(new URLRequest(img1));
          private function imageLoaded(event:Event):void
           var image:Bitmap = new Bitmap(event.target.content.bitmapData);
           sp.addChild(image);
           sp.x = myx;
           sp.y = myy;
           addChild(sp);

HI have spent ages on this and snippets of code isnt clarifying this for me.
I want to load images into BItmapData and display one of those to the screen Bitmap. To animate I want to swap images every so often
I need to know
1)I dont know how to load an image into a bitmapData object
2) I need to assign the bitmapData to a bitmpa so I can display it
3) I will need to perform keyevents/mouse events on the image display on screen so the bitmap must be converted to a sprite somehow.
IT would help me the most if someone was to look at my code and I will try to find some AS3 animation tutorials complete examples (NOT EASY!)
private   var img1:Bitmap;
          private   var bmp:BitmapData;
            private var MyImages:Array = [];
            var urls:Array = ["scave4.png", "scave5.png", "scave6.png", "scave7.png"];
          public function ClassImg3()     {
          imgStr="scave4.png";
               for each (var el:String in urls) {
                    var loader:Loader = new Loader;
                    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
                    loader.load(new URLRequest(el));
          private function imageLoaded(event:Event):void
          // var image:Bitmap = new Bitmap(event.target.content.bitmapData);
          // img1= new Bitmap(event.target.content.bitmapData);
            var bmd:BitmapData = event.target.loader.content.bitmapData;
          // bmp=new BitmapData(event.target.content.bitmapData);
          MyImages.push(bmd);
          img1.bitmapData = bmd;
          addChild(img1);
          img1.x =30;
          img1.y=100;
          // sp.addChild(image);
           //sp.x = myx;
          // sp.y = myy;
           //addChild(sp);
           dispatchEvent(new Event("image_loaded"));
          public function moveChar()
               img1.x+=1
               if (img1.x>400)
                    img1.x=10;

Slow load of BitmapData

In my application, i am using a graphical counter for score. It has several effects that would be too hard to render real-time, so i have my whole animation converted to 2525x45px picture. In my application, i am cutting this image to 100 bitmapDatas(10 for each digit) and in the runtime i am switching bitmapDatas in my Bitmap object, so it creates an animation. I am doing this with AIR 3.1 on BB Playbook, with GPU rendering ON(no Stage3D !).
The problem is : at the first run, digits(frames of the animations) are being displayed very slowly and it slows the whole app, the lag starts at aproximetly 30th frame. But once every frame of the animations has been displayed and the animatin loops, everything goes fine.
My solution: i tried to use getPixel() on every BitmapData, to force FlashPlayer to load them into memory and dont slow it later, but it didnt work.
What i thing might work: somehow force FP to load all the BitmapDatas to GPU memory(bitmaps should be displayed with GPU) without actually displaying them(i dont want to show something i dont want to be shown.)
Thanks for any suggestions

Hi,
ive tried Scout on Desktop and it didnt showed the slowdown as on Playbook. My theory is that when i create that 100 DOs at start, they are stored in RAM but not in GPU memory. I think they arent loaded to GPU unless you add them to stage and display them. While the FP successfully handles loading first 50 DOs into GPU, it has problem to do so with next 50 DOs, bexouse it is simple too much for it(whole animation is displayed within 5-6 seconds) and some buffer probably gets full. I just simply need to load it all into GPU before the game itself starts(while is the player in the menu and does nothing).
EDIT: Ive also tried this on BB10(Blackberry Dev Alpha C) and no issue was reproduced, but i think it is becouse DAC has much more powerful HW than Playbook

Local image load and edit

Hello,
I already spend 2 days on this problem. I want to load local
image into AIR application, edit and save as a new image. I know
there are some security issues, which don't allow Loader class to
access data on different domains than SWF file, but does it affect
AIR too and local files editing? Well, sympthoms are the same.
Here is the code:
//pointing to an image
var imageFile:File =
File.documentsDirectory.resolvePath('someimage.png');
//new file stream
var fileStream: FileStream = new FileStream();
fileStream.open(imageFile, FileMode.READ);
//reading image into bytearray and closing stream
var imgBytes: ByteArray = new ByteArray();
fileStream.readBytes(imgBytes);
fileStream.close();
//tried to use LoaderContext and some workarounds available
in the web - none is working
//var loaderContext: LoaderContext = new LoaderContext();
//loaderContext.checkPolicyFile=true;
//loaderContext.allowLoadBytesCodeExecution = true;
//creating loader and injecting image bytes into it
var loader:Loader = new Loader();
loader.loadBytes( imgBytes, loaderContext );
//trace(loader.content); // will give you null
//creating a sprite and adding image to it
var somesprite:Sprite = new Sprite();
somesprite.addChild(loader);
//creating output file
var myFile:File =
File.documentsDirectory.resolvePath('newimage.png');
var myFileStream:FileStream = new FileStream();
myFileStream.openAsync(myFile, FileMode.WRITE);
//Here is fun part: BitmapData capture everything in sprite
except image
var bd:BitmapData=new BitmapData(200,200);
bd.draw(someSprite);
var ba:ByteArray = PNGEncoder.encode(bd);
myFileStream.writeBytes(ba);
myFileStream.close();
//However image will visible in the screen
root.addChild(someSprite);
Maybe somebody already noticed that issue and know the
solution? It's not very sophisticated example - it won't let you do
even a simple image editor. I'm sure there must be some way.
Thanks in advance

I think, then, that your problem is that you aren't waiting
for the image to load before trying to encode and write it to disk.
I tried your code snippet and could write the image once I put the
encodeing and writing bit into an event handler that fired when the
image finished loading.

Help in images

Hi every one,
I'm tring to make a small game.the problem is that the images doesn't appear like i want ,for example if you draw a star and filled it with yellow color then when you move it on the game it moves the whole image with a white background for the non-yellow areas of the image how can i solve that,
shortly ,how to make the background of a certain image transperent to the main background image.
thanks in advance.

If you're simply drawing the star to the screen with Graphics2D.fill(Shape), then this shouldn't happen. It depends, however, on what exactly you mean by "move". If the shape is drawn on a white background, then you try to move it simply by copying the area surrounding the shape to a new location, then you'll end up copying the white background as well. You'll get better results if you simply use Graphics2D.fill(Shape) again.
If you're loading an Image from a GIF file, the transparency in the image will be the same as the transparency in the GIF file. (This may work for PNG files, too... but not JPG files, because they don't support transparency.)
If you're using a BufferedImage to create the star image, you'll need to specify, when you create the BufferedImage, a mode that supports transparency. Then you'll be able to draw that BufferedImage where it's needed.
(The hard part will be erasing the previous location of the star, if you are moving it. This usually requires redrawing the background.)

Canvas Hierarchy to BitmapData

I'm trying to capture the graphic contents of a hierarchy of Canvases to a BitmapData. I'm using BitmapData.draw and passing it the Canvas that contains the hierarchy. However I am only capturing the contents of the root Canvas's Graphics object. None of the contained objects are showing up in the BitmapData. I am creating a hierarchy of Canvases in order to get graphics effects (drawing with a hierarchy of clipping paths) that I can't do in a single Graphics object. Is there any way to flatten this out to a single bitmap?
David

Hi,
Although I dont understand your problem properly,but still trying to Resolve it.
Below is the code in which I am having a canvas inside canvas and so on.
Then I am capturing the bitmapdata of the outer canvas, and creating a new Image
with that bitmapdata.It is creating the same childeren heerarchy as is in the
oringional Canvas.The code is below.
Main.MXML
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
public function CreateBitmapImage() : BitmapData
var bitmapData:BitmapData = getBitmapData( UIComponent( sourceCanvas ) );
targetImage.source = new Bitmap( bitmapData );
return bitmapData;
private function getBitmapData( target : UIComponent ) : BitmapData
var bitmapData : BitmapData = new BitmapData( target.width, target.height,true, 0x00000000);
bitmapData.draw( target );
return bitmapData;
]]>
</mx:Script>
<mx:Canvas id="sourceCanvas" width="500" height="500" backgroundColor="0xFFFFFF">
<mx:Canvas width="400" height="400" backgroundColor="0xFF0000">
<mx:Canvas width="300" height="300" backgroundColor="0x000FF00">
<mx:Canvas width="200" height="200" backgroundColor="0x0000FF"/>
</mx:Canvas>
</mx:Canvas>
</mx:Canvas>

<mx:Image id="targetImage" creationComplete="CreateBitmapImage()"/>
</mx:Application>
Pls let me know if you have any problem,or i am unable to understand ur problem.
Shardul Singh Bartwal

Save / Load Image on device storage (iOS & Android)

Has anyone used application storage on iOS / Android ?
I need to be able to take a photo with the device and save that photo to the application rather than the device camera roll. When my app is opened I need to read these images and load them.
Any help with how to tackle this would be highly appreciated.
Cheers!

So I'm able to get the camera to take the photo or choose from library and get the image added to the stage. Once I get the image added to the stage.. how do I save that image?     and then when my app is opened .. how do I check if that image exists and then load it up?
Ideally .. I would like to check if 1.png exists .. if it does.. add it to the stage in a predefined space. Hopefully that makes some sense
function addToStage():void {
   trace("Image was added to Stage");
imgLoader = new Loader();
imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, drawBitmap);
imgLoader.addEventListener(IOErrorEvent.IO_ERROR, errorHandlerIOErrorEventHandler);
imgLoader.loadFilePromise(imagePromise);
function drawBitmap(e:Event):void{
if (image != null && contains(image)){
mcHolder.mcImg.removeChild(image);
myBitmapData = new BitmapData(600,600);
   image = new Bitmap(myBitmapData);
   image.bitmapData = Bitmap(e.currentTarget.content).bitmapData;
   trace("Original Image Width = " + image.width + " Height = " + image.height);
   trace("Bitmap was drawn");
mcHolder.mcImg.addChild(image);
createGestouch();

Is there a way to transform multiple colors?

I have a project where I've been asked to allow a user to choose between multple color themes of a character. This object is complex in that it has multiple colors and that each color needs to change differently based on the theme's color scheme.
Is there a way to take a movieclip with multiple colors and apply process to it that will detect different colors and transform them accordingly without taking each individual color, making a movie clip from it, then modifying the movieclip's colors? Each character has a pretty limited color pallette, so this process would only have to find and then change maybe 3 or 4 colors. But the character in question is hand animated and has a LOT of frames, so I'm hoping there's a chance that I can handle this programmatically rather than doing it all by hand with a few hundred extra movieclips to make color changes to. Any help is greatly appreciated!

Hi, and thanks for the help.
This is the 1st time I've looked at the palletteMap method. I see in the documentation:
paletteMap(sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint:Point, redArray:Array = null, greenArray:Array = null, blueArray:Array = null, alphaArray:Array = null):void
Parameters:
sourceBitmapData:BitmapData — The input bitmap image to use. The source image can be a different BitmapData object, or it can refer to the current BitmapData instance.
sourceRect:Rectangle — A rectangle that defines the area of the source image to use as input.
destPoint:Point — The point within the destination image (the current BitmapData object) that corresponds to the upper-left corner of the source rectangle.
redArray:Array (default = null) — If redArray is not null, red = redArray[source red value] else red = source rect value.
greenArray:Array (default = null) — If greenArray is not null, green = greenArray[source green value] else green = source green value.
blueArray:Array (default = null) — If blueArray is not null, blue = blueArray[source blue value] else blue = source blue value.
alphaArray:Array (default = null) — If alphaArray is not null, alpha = alphaArray[source alpha value] else alpha = source alpha value.
I comprehend the 1st 4 parameters, but the color and alpha arrays have got me confused. How would I use these to, for instance find all the pure blue pixels in a bitmap (0x000000FF) and then change those pixels' colors to some other color, then find all the pure red pixels (0x00FF0000) and change them to yet another color? Fortunately I don't have to deal with alpha with this current delimma . . .
One other question before I look into this method as a solution, is it possible to programmatically convert vector-based artwork into a bitmap to use this colorMatrix feature? All the artwork I need to change colors on is hand drawn animation using the native Flash drawing tools. Thanks again for any additional help!

Image Transperancy in bitmapData

Similar Messages

Maybe you are looking for