Displaying huge, scrollable graphics in Flex, part 2: BitmapData into an Image?

Question

Clox answered my question of how to display huge graphics (eg greater than 8191 pixels).

I have the code to copy parts of a huge loaded BitmapData to a target BitmapData that is just the size that I can display.

I think I have set the scroll bars of an enclosing Canvas to show the size of the larger image and allow the user to scroll.

Now I need to put the selected pixels on the screen. When I try to add a Bitmap component as a child of the Canvas, it get an error because Bitmap is not a UIComponent.

What's the best way to put the target BitmapData into an Image component?

How else can I get the subset of pixels on the screen?

Answer 1

To display a BitmapData object use the Bitmap class. Then you can set the bitmap as the source of an image.

var imageBmp:Bitmap = new Bitmap(myBitmapData);
var displayImage:Image = new Image();
displayImage.source = imageBmp;
myCanvas.addChild(displayImage);

You could also draw the pixels of your bitmap data directly onto the Graphics object of the Canvas using beginBitmapFill .

var g:Graphics = myCanvas.graphics;
g.beginBitmapFill(myBitmapData);
g.drawRect(0, 0, myBitmapData.width, myBitmapData.height);