Using non-embedded images in a spark BitmapImage

The spark BitmapImage component only supports embedded images in Flex 4.0. This post shows how you can get around that limitation by loading an image via a SWFLoader and then pushing that bitmap data into the BitmapImage’s source property.

Most of the time you will want to use an mx Image instead of the spark BitmapImage because it is capable of dealing with both embedded images and images loaded at runtime. There are however some situations where BitmapImage is really handy and you can’t embed the images.

One example of that is tiling an image like how a background image works in HTML. The following example demonstrates a simple custom component called TiledImage that does that. It loads an image from a URL using a SWFLoader and when that is complete pushes the bitmap data into the source of the BitmapImage with fillMode=”repeat”.

View Source

Note: This sample requires Flex SDK 4.0.0.14159 or higher. You can get the latest SDK builds from opensource.adobe.com.

7 thoughts on “Using non-embedded images in a spark BitmapImage”

  1. “The spark BitmapImage component only supports embedded images in Flex 4.0.”

    It also supports BitmapData create at runtime, and any type of DisplayObject (it internally draws this onto a BitmapData).

    Because of this its feasible you could omit the part where you create the BitmapData in your examples and just set the SWFLoader as the source.

  2. Thanks, great solution! FYI: It works well on 4.0.0.13875 as well. I didn’t understand someone’s comment about setting the SWFLoader itself as the bitmap image’s source … perhaps they can explain themselves in more detail by providinga few lines of code?

  3. @Tink – Thanks for the tip, I updated the source code above to push the loader.content DisplayObject directly into the BitmapImage.

    @Paul The Lad – Good point, this example doesn’t actually “require” 14159, but I’m just lazy and put down the build that I happen to be using at the time. I should probably consider updating the wording of that note.

Comments are closed.