How to extend SWFLoader component to "fit" any sized image inside it?

Question

SWFLoader's scaleContent is not able to do what I'm trying to achieve:

<mx:SWFLoader id="img" width="600" height="400" scaleContent="true"/>

When an image of size 100x80 is loaded inside it, the image does does not resize to 600x400. That's because scaleContent = true.

Then, I set maintainAspectRatio = true. The image did resize to 600x400 but obviously, it was totally out of proportion.

So how do I always fit any sized image to the current size of the SWFLoader while maintaining the aspect Ratio? The resized image may be cropped, which is ok.

SCENARIO: An image of size 1500x10 is loaded inside the above SWFloader. In this case the height(10) should be resized to 400 and the width(1500) should automatically resize depending on the height. A lot of the image will be cropped, which is fine.

Any pointers on how something like this can be achieved?

Answer 1

Use the Flex Image Control instead.

The following code will force the image to the size you want regardless of the image size. I believe that is what you want.

<mx:Image id="image1" 
        source="@Embed(source='logo.jpg')" 
        width="20" height="20"/>

So regardless if that image is 800x600 it will be displayed as 20x20.

More Information on Image Control:

Flex sets the height and width of an imported image to the height and width settings in the image file. By default, Flex does not resize the image.

To set an explicit height or width for an imported image, set its height and width properties of the Image control. Setting the height or width property prevents the parent from resizing it. The scaleContent property has a default value of true; therefore, Flex scales the image as it resizes it to fit the specified height and width. The aspect ratio is maintained by default, so the image may not completely fill the designated space. Set the scaleContent property to false to disable scaling. Set the maintainAspectRatio property to false to allow an image to fill all available space regardless of its dimensions.

Full Reference: http://livedocs.adobe.com/flex/3/html/help.html?content=controls_16.html#484971