flex基礎（2）

建立應用程式

在這個簡單的購物車中，我們顯示一個咖啡品牌的列表（類似於HTML的select）。使用資料繫結功能在下面顯示當前選擇的品牌的說明，還有一個新增到購物車的按鈕，當按鈕被按下後，該品牌的咖啡便會被新增到購物列表中。

圖1. 教程建立的Flex應用程式

這個教程的目的是為了學習使用：

Application (應用程式)類
Panel (皮膚)容器
Script (指令碼)元素
Array (陣列)元素
Object (物件)元素
Label (標籤)元素
Text (文字框)元素
Button (按鈕)控制元件
ComboBox (下拉選單)控制元件
List (列表)控制元件
一個ActionScript函式

建立Application（應用程式）物件

任何一個Flex程式都是以XML宣告開始和Application標記的。Application標籤包含一個MX類庫名稱空間的宣告：xmlns:mx="http://www.macromedia.com/2003/mxml" 。引用該類庫的所有標籤必須以mx作為字首。

1. 建立一個新檔案 ，然後儲存為 firstapp.mxml，位於flex_tutorials目錄下
2. 在檔案的開始處，插入XML宣告：
<?xml version="1.0"?>
3. 在XML宣告後，新增帶名稱空間的Application標籤：
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">
</mx:Application>

應用程式佈局：新增一個皮膚

通常你可以將Flex應用程式中可見的元件放置於容器中，容器提供了繫結文字、控制元件、影像和其他媒體型別的元素。在這裡，你可以使用稱為“皮膚”(Panel)的容器，它可以提供大部分應用程式需要的全部外殼。你還可以使用皮膚的title(標題)屬性，修改皮膚上方自動包含著的標題欖的文字。

4. 在Application標籤內部，新增一個Panel標籤，title屬性為"my First Flex App"

<mx:Panel title="My First Flex App">
</mx:Panel>

新增一個顯示標題的Label元素

Label元素可以用來顯示單行文字。它有一些屬性，這裡用到的是text（文字）屬性，定義Label顯示的內容。

5. 在Panel標籤內，插入一個帶有文字屬性的Label標籤，如下：<mx:Label text="Coffee Blends"/>

6. 儲存檔案，預覽一下程式