<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/01/05/changing-a-vbox-containers-background-size-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
		layout="vertical"
		verticalAlign="middle"
		backgroundColor="white" viewSourceURL="srcview/index.html">

	<mx:Style>
		VBox {
			backgroundImage: Embed("Fx.png");
			backgroundColor: red;
		}
	</mx:Style>

	<mx:ApplicationControlBar dock="true">
		<mx:Form styleName="plain">
			<mx:FormItem label="percentWidth:">
				<mx:HSlider id="sliderW"
						minimum="0"
						maximum="100"
						value="100"
						liveDragging="true"
						snapInterval="1"
						tickInterval="10"
						dataTipPrecision="0" />
			</mx:FormItem>
			<mx:FormItem label="percentHeight:">
				<mx:HSlider id="sliderH"
						minimum="0"
						maximum="100"
						value="100"
						liveDragging="true"
						snapInterval="1"
						tickInterval="10"
						dataTipPrecision="0" />
			</mx:FormItem>
			<mx:FormItem label="backgroundSize:">
				<mx:ComboBox id="comboBox">
					<mx:dataProvider>
						<mx:Array>
							<mx:Object label="auto" />
							<mx:Object label="100%" />
							<mx:Object label="90%" />
							<mx:Object label="80%" />
							<mx:Object label="70%" />
							<mx:Object label="60%" />
							<mx:Object label="50%" />
							<mx:Object label="40%" />
							<mx:Object label="30%" />
							<mx:Object label="20%" />
							<mx:Object label="10%" />
							<mx:Object label="0%" />
						</mx:Array>
					</mx:dataProvider>
				</mx:ComboBox>
			</mx:FormItem>
		</mx:Form>
	</mx:ApplicationControlBar>

	<mx:HBox percentWidth="{sliderW.value}"
			percentHeight="{sliderH.value}">
		<mx:VBox backgroundSize="{comboBox.selectedItem.label}"
				width="100%"
				height="100%" />
	</mx:HBox>

</mx:Application>

