I have a dynamic layout, where an image is loaded into an HBox:

<mx:HBox ...>
    <mx:Image height="100%" .../>
</mx:HBox>

only the image's height is set on the image, so that it can take all the vertical space available, while its width is left undefined and I expect the width to scale accordingly with its height.

It turns out that the image's height is equal to its contentHeight, i.e. height scales properly; however, the image's width is still the same as measuredWidth (the image's original width), and is not scaled accordingly.

For example, if the image's original size is 800x600 and if the HBox is 300 in height, then image height will scale down to 300, however its width doesn't scale down to 400, instead it stays at 800.

I tried to add an event listener to explicitly set the image width:

<mx:Image id="img" height="100%" updateComplete="img.width=img.contentWidth;" .../>

It works only the first time the image is loaded, after that, if I use Image.load() to dynamically load different images, it stops working - the image width is set to 0.

Any help/advice will be highly appreciated.