How to convert bytearray to image or image to bytearray ?

Question

How to assign bytearray value to panel background image. If anybody have idea or experiance plz help me to overcome the problem. BRIEF EXP:

I have panel control and want to load image getting from webservice as a backgroundimage. So i used setstyle() but its not accepting that image. so how to add that image into my panel background image.Plz tel me your ideas here.

Answer 1

In Flex 3 or higher, you just need to do:

 yourImage.source = yourByteArray;

regards!

Answer 2

uhm, well i presume, since it is an image, you have it in a BitmapData, let's say "myBmp" ... then use the following to extract all the data from BitmapData:

var bytes:ByteArray = myBmp.getPixels(myBmp.rect);

and the following to write:

myBmp.setPixels(myBmp.rect, bytes);

note that only the raw 32 bit pixel data is stored in the ByteArray, without compression, nor the dimensions of the original image.

for compression, you should refer to the corelib, as ozke said ...

Answer 3

For AS3 you can use adobe corelib. Check this tutorial... http://ntt.cc/2009/01/09/as3corelib-tutorialhow-to-use-jpegencoder-and-pngencoder-class-in-flex.html

Answer 4

I used a flash.display.Loader() to load an image in an array. It has a Complete event that is fired after the image has been loaded. I then draw the image on to a Bitmap which I set to the data of a Image that could be placed in a panel. Hope you can make since of this good luck.

public static function updateImage(img:Image, matrix:Matrix,
                                   pageDTO:PageDTO, bitmapData:BitmapData):void {
    var loader:flash.display.Loader = new flash.display.Loader();
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function (e:Event) : void {
        bitmapData.draw(loader.content, matrix);
        pageViewer.data = new Bitmap(bitmapData);
    });
    loader.loadBytes(pageDTO.thumbnail);
}

<mx:Panel>
    <mx:Image id="pageViewer"/>
</mx:Panel>

Answer 5

Using adobe's JPGEncoder (com.adobe.images.JPGEncoder) class and ByteArray is pretty much all you need. Converting image to byte array (assuming CAPS are variables you'd need to fill in):

// -- first draw (copy) the image's bitmap data
var image:DisplayObject = YOUR_IMAGE;
var src:BitmapData = new BitmapData(image.width, image.height);
src.draw(image);

// -- encode the jpg 
var quality:int = 75;
var jpg:JPGEncoder = new JPGEncoder(quality);
var byteArray:ByteArray = jpg.encode(src);

Answer 6

I had the same problem. As a workaround I created sub Canvas nested inside a main Canvas and added an Image to the main Canvas behind the sub Canvas. Anything drawn on the sub Canvas will appear on top of the Image.

Answer 7

Just load it into a Loader instance using the loadBytes function.

var ldr:Loader = new Loader(); 
ldr.loadBytes(myByteArray); 
addChild(ldr);