Flex中如何利用verticalGap风格设定LinkBar控件各项目纵向间隔(vertical spacing)的例子

在前面的 Flex中如何利用horizontalGap风格设定LinkBar控件各项目横向间隔(horizontal spacing)的例子中，我们了解了如何利用horizontalGap风格，设定LinkBar控件各项目间的横向间隔(horizontal spacing)。接下来的例子则演示了如何通过设置 verticalGap风格，设定LinkBar控件各项目纵向间隔(vertical spacing)。

让我们先来看一下Demo（可以右键View Source或 点击这里察看源代码 ）：

Download: main.mxml

1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
3.         layout="vertical"
4.         verticalAlign="middle"
5.         backgroundColor="white">
7.     <mx:Script>
8.         <![CDATA[
9.             private function init():void {
10.                 slider.value = linkBar.getStyle("verticalGap");
11.             }
12.         ]]>
13.     </mx:Script>
15.     <mx:Array id="arr">
16.         <mx:Object label="Alert" />
17.         <mx:Object label="Button" />
18.         <mx:Object label="ButtonBar" />
19.         <mx:Object label="CheckBox" />
20.         <mx:Object label="ColorPicker" />
21.         <mx:Object label="ComboBox" />
22.     </mx:Array>
24.     <mx:ApplicationControlBar dock="true">
25.         <mx:Form styleName="plain">
26.             <mx:FormItem label="verticalGap:" direction="horizontal">
27.                 <mx:HSlider id="slider"
28.                         minimum="0"
29.                         maximum="20"
30.                         snapInterval="1"
31.                         tickInterval="1"
32.                         liveDragging="true" />
33.                 <mx:Label text="{slider.value}" />
34.             </mx:FormItem>
35.         </mx:Form>
36.     </mx:ApplicationControlBar>
38.     <mx:LinkBar id="linkBar"
39.             dataProvider="{arr}"
40.             direction="vertical"
41.             verticalGap="{slider.value}"
42.             initialize="init();" />
44. </mx:Application>

0人

了这篇文章

类别： Flex+Asp.net┆阅读( 0)┆评论( 0) ┆ 返回博主首页┆ 返回博客首页

上一篇 Flex中如何将XML数据显示在DataGrid控件中的例子 下一篇 Flex中如何利用horizontalGap风格设定LinkBar..