Flex中通过verticalGap样式设置LinkButton的竖直方向图标和标签之间距离的例子
By Minidxer | September 12, 2008
在前面的Flex中通过horizontalGap样式设置LinkButton控件图标(Icon)和标签(Label)之间间隔距离的例子中,我们了解了Flex中如何通过horizontalGap样式,设置LinkButton控件图标(Icon)和标签(Label)之间间隔距离。类似的,接下来的例子演示了Flex中如何通过verticalGap样式,设置LinkButton的竖直方向图标和标签之间距离。
让我们先来看一下Demo(可以右键View Source或点击这里察看源代码):
下面是完整代码(或点击这里察看):
Download: main.mxml
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application name="LinkButton_verticalGap_test"
- xmlns:mx="http://www.adobe.com/2006/mxml"
- layout="vertical"
- verticalAlign="middle"
- backgroundColor="white">
- <mx:ApplicationControlBar dock="true">
- <mx:Form styleName="plain">
- <mx:FormItem label="verticalGap:">
- <mx:HSlider id="slider"
- minimum="0"
- maximum="10"
- value="2"
- snapInterval="1"
- tickInterval="1"
- liveDragging="true" />
- </mx:FormItem>
- <mx:FormItem label="labelPlacement:">
- <mx:ComboBox id="comboBox"
- dataProvider="[top,bottom]" />
- </mx:FormItem>
- </mx:Form>
- </mx:ApplicationControlBar>
- <mx:LinkButton id="linkButton"
- label="LinkButton"
- icon="@Embed('assets/LinkButton.png')"
- verticalGap="{slider.value}"
- labelPlacement="{comboBox.selectedItem}" />
- </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子
Topics:
Flex |
Tags: icon, labelPlacement, LinkButton, verticalGap