本文和大家重点讨论一下FlexBuilder2.0中使用基于Lists的控件,这个速学教程教你该如何在FlexBuilder2.0中将基于Lists的控件里面的项显示出来与他的值的处理。
FlexBuilder2.0中使用基于Lists的控件
你能使用基于Lists的控件到你的Flex应用程序中,例如: ComboBox, List, HorizontalList。在插入这种控件之后,你必须将他里面的项显示出来,他的值用于提交处理。在FlexBuilder2.0中,这些控件的值都放置于数据提供者(data providers)中, 这是类似于数组的对象集。这个速学教程教你该如何在FlexBuilder2.0中将基于Lists的控件里面的项显示出来与他的值的处理。
开始之前
开始这个速学教程之前,确定你完成下面的任务:
◆在FlexBuilder2.0中创建QuickStart项目。
◆在FlexBuilder2.0中打开Project菜单中确认Build Automatically选项已选上,如下:
插入与放置控件
在这部分里,你将创建一个简单的表单。
1.打开QuickStart项目,选择File > New > MXML Application,在File Name中输入ListControl.mxml。
2.在Navigator视图中右击ListControl.mxml文件,选择Application Management > Set As Default Application,将它指定为默认被编译的文件。
3.在设计视图中,从组件面板(Window > Show View > Components)中拖放下面的控件到Canvas容器中:
◆ Label
◆ ComboBox
◆ Button
4.在Canvas容器中,选择Label控件与设置Label的属性如下:
◆ text: Rate customer service
◆ x: 20
◆ y: 50
5.在Canvas容器中,选择ComboBox控件与设置ComboBox的属性如下:
◆ id: cbxRating
◆ x: 20
◆ y: 80
ComboBox组件中是没有项的,你将在后面放入项
6. 在Canvas容器中,选择Button控件与设置Button的属性如下:
◆ label: Send
◆ x: 140
◆ y: 80
7.在工具条上点击Code按钮,将视图转为代码视图。ListControl.mxml文件将包括下面的MXML代码:
程序代码:
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.macromedia.com/2005/mxml"
- xmlns="*">
- <mx:Canvas width="100%" height="100%">
- <mx:Label x="20" y="50" text="Rate customer service"/>
- <mx:ComboBox x="20" y="80" id="cbxRating"></mx:ComboBox>
- <mx:Button x="140" y="80" label="Send"/>
- </mx:Canvas>
- </mx:Application>
8.保存文件,等待FlexBuilder2.0直到编译完成应用程序,再点击工具条上的Run按钮。
浏览器自动打开并运行你的Flex应用程序。
9.点击ComboBox。
ComboBox组件中没有任何项,因为你还没有定义它的数据提供者(data provider) 。
【编辑推荐】