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
