本文和大家重點討論一下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) 。

【編輯推薦】

1. FlexBuilder2.0 速學教程之編譯應用程序
2. 技術分享 FlexBuilder2.0中如何定義約束的布局
3. Flex及FlexBuilder2.0開發環境詳解
4. FlexBuilder3.0與Eclipse3.4的***結合
5. Flex內存泄露解決方法和內存釋放優化原則