Got it, thanks Tim!
Have a great weekend. -Greg
<mx:Canvas id="mainContent" width="100%" height="100%" >
<!--Layer 1 - the background image -->
<mx:VBox id="imageLayer" x="0" y="0" width="100%" height="100%"
verticalAlign="middle" horizontalAlign="center">
<!-- Set he image width and height to parent container dimension.
-->
<mx:Image source="some.jpg" width="{imageLayer.width}" height="{
imageLayer.height}" alpha="0.8" scaleContent="true" maintainAspectRatio="
true" horizontalCenter="0" horizontalAlign="center" verticalCenter="0"
verticalAlign="middle" />
</mx:VBox>
<!-- Layer 2 - Foreground content-->
<mx:VBox x="0" y="0" width="100%" height="100%">
</mx:Canvas>
On Fri, May 16, 2008 at 5:33 PM, Tim Hoff <[EMAIL PROTECTED]> wrote:
>
> Hi Greg,
>
> Without going under the hood, you'll probably want to add a couple more
> layers to your component. The backgroundImage propeties of a container
> don't allow you to use the maintainAspectRation property. However, the
> Image control does. So, one way that you can work around this is to use
> a Canvas as the main component container and layer a VBox on top of an
> Image (used for the backgroundImage). This gets trick sometimes;
> depending on how you set the parent and/or child dimensions. But, if
> you set either the Image height or width exclusively, and use the
> maintainAspectRatio, the image will scale correctly.
>
> -TH
>
>
> --- In flexcoders@yahoogroups.com <flexcoders%40yahoogroups.com>, "Greg
> Hess" <[EMAIL PROTECTED]> wrote:
> >
> > Hi Folks,
> >
> > Our application lets a user specify an image to use as a background
> for a
> > component. We need to scale the image to fill the VBox container (max
> width
> > or height) respecting the aspect ratio of the image. I have been
> setting the
> > backgroundImage, and backgroundSize="100%" styles on the VBox but the
> image
> > is being stretched.
> >
> > How can I do this?
> >
> > Cheers,
> >
> > Greg
> >
>
>
>
