Sunday 6 February 2011

How to embed images in Actionscript 3 / Flex 3 / Flex 4 in the right way?

situation: 
It is useful to embed images especially for banners. But Flex 4 doesn't provide Library to import your stuff!

problem:
How to embed the images in the swf?!?

solution:
The embed process is very simple, just follow to follow steps:
1. copy your image files where the "src" folder is of your application. the Flex 4 will get these files from there. Of course you may define sub folders to do not mess up.
2. In your class define like the example bellow
    [Embed (source="728x90a.jpg" )] 
    public static const imgData1:Class;
                The 728x90a.jpg is the file name of the image (I didn't use sub folders here)
                The imgData1 is the object where contains the data of the embedded image!
3. Somewhere in your code, load the data into a visual component, like the example bellow
    img1.source=imgData1;
                The img1 is an Image component.
4. That's all... now read my recommendation bellow

!attention!
1. You should compress the images downgrading their quality in order to be small in file size! swf files with huge images are huge for downloading and launching by flash's player!
2. This technique is for small photos, banners and so on. You may use it but it is not recommended at all for application with interfaces and so on, it is not professional solution. The reason is that the application is heavy for launch. Use the Image.source property defining the full url address of the files image instead to embed it.

1 comment: