Image embed and resizing
The follwing example shows you how you can import an image (gif, jpeg, png ...) on a canvas
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Canvas width="100%" height="100%">
<mx:Image
id="imageLoader"
source="@Embed('assets/myImage.jpg')"
width="200"
height="250"
x="10"
y="10"
scaleContent="true">
</mx:Image>
</mx:Canvas>
</mx:Application>
By adding the @Embed directive onto the image control, causes the complier to include the image file (in this case a JPG file) with the SWF file. You could also provide an absolute URL path:
<mx:Image id="imageLoader" source="http://[YOUR HOSTNAME]/myImage.jpg')" />
Scaling an image
You can scale an image size using the 'scaleX' or 'scaleY' properties. The default value is set at '1' and its relative size can be adjusted to a fraction (decimal) value that represent percentage. For example setting the scaleX='2.0' would essentially resize the width of the image by 200%.
<mx:Image
id="imageLoader"
source="@Embed('assets/myImage.jpg')"
scaleX="2.0">
</mx:Image>
