前言

Adobe? Flex? 2.0 是一項新興的技術，它基于強大的已經很成熟的 J2EE 平臺，具有一些很強大并 且迷人的特性，比如?Flash 的表現能力，豐富的媒體和離線能力等等。Flex 2.0 雖然在前臺表現
為 Flash，卻是更多地面向開發者（developer），而不是設計者（designer）。你只需要編寫代碼就 可以使用各種控件做出很漂亮的東西，這是許多缺少藝術細胞的開發人員向往的事情。而且 Flex 除去了 Flash 中一些令很多人費解的東西，比如幀，元件等（我本人就怎么努力也無法學會 Flash， 郁悶），完全可以將界面設計和邏輯實現分離開來，使美工和程序員專注于自己的東西，相信這 也是大家所希望看到的。

其實? Flex? 2.0? 也不算是 太新的東西 ，在? Flex? 2.0? 之前已經 有了? MacroMedia? Flex? 1.0? 和 MacroMedia? Flex? 1.5，不過國內很少有人關注。Flex? 1.0 和 1.5 的性能都不是很好，編譯出來的 SWF 文件很大，而且? Flex Builder 1.5 是一個類似于 Dreamweaver 的編輯器，狂占內存，我的機 器配置又不是太先進，用起來苦不堪言，調試的時候每每都要等上一段時間頁面才能編譯并顯 示出來。由于這些原因，大多數人對 Flex 都只是觀望態度。但是 Adobe 收購了 MacroMedia 之 后推出的 Flex 2.0 相對于 Flex 1.5 可以說是一個全新的版本，是 Flex 的真正的起點。它使用了強 面向對象的功能強大的 ActionScript 3.0 取代了以前的 ActionScript 版本，使得運行效率大大提高， 編譯出來的 SWF 文件體積也縮小很多。而且 Adobe 摒棄了以前的 Flex? Builder，做了全新的基
于 Eclipse 的 Flex Builder 2.0，使得開發環境改進良多，提高了開發者的體驗（用起來確實舒服 多了，代碼提示等方面做的很不錯，我可以證明? ^_^）。

Adobe Flex 2.0 可以稱得上是最強大的 RIA（Rich Internet Application，富因特網應用程序）開發 工具。但是由于國內比較落后，很多新技術出來好像都要等上幾年才能傳到國內并且流行。怎 么辦？加強經濟建設，加快改革開放，使中國趕緊成為發達國家，讓人家做的軟件研究的技術 發行出來就有中文版的……? 不過這些好像純粹是幻想，至少近期是不可能了，沒有辦法，只好 去啃英文文檔。然而關于 Flex 的英文資料也不是很多，Flex 自帶的幫助是最好的文檔，而且看 英文文檔的效率是很低的，遠不如看母語來的暢快。我深知其中痛楚，所以就想翻譯一些入門 的文章供大家參考，而最好的入門文章莫過于 Adobe Flex 開發者中心的這些 Quick Starts。以后 我會逐步把它們翻譯出來，可能全部翻譯，也可能只翻譯其中一部分，我會把翻譯的所有這些 都做成 PDF 文件放到網上，算是對初學者的幫助，也是對自己的一種歷練（說了那么多亂七八 糟的，現在才說重點，發現自己廢話也夠多）。原文中的一些示例不能嵌入到 PDF 中，所以大家 如果想看代碼運行情況，還請到原文中去找。另外，由于本人英語水平和技術水平極其有限， 審校工作也做得不好，書中出現錯誤或者不妥之處在所難免，懇請并熱烈歡迎大家批評指正， 先謝謝大家。

雖然只是翻譯幾篇文章發出來，讀者也可能很少，但是我還是想在這里感謝幾個人（虛榮一下， 莫怪? ^_^），他們是我的兄弟們：冬瓜，小侯，雷子，張霄。雖然他們沒有對翻譯做任何貢獻而 且有可能問 Flex 是不是很好吃，但是他們是我的精神支柱和生活中的重要部分。謝謝你們，我 以你們為榮。

使用 MXML 和 ActionScript 編程
Adobe?是把 Flex 作為一個 ActionScript 類庫實現的。這個類庫包含了組件（容器
和控件），manager 類，數據服務類，以及具有其他特性的類。你可以通過使用帶有 類庫的 MXML 和 ActionScript 語言來開發應用程序。

MXML

MXML 是一個可以讓你在 Adobe? Flex?中布局用戶界面組件的一種 XML 語言。你也可 以使用 MXML 聲明來定義程序中的非可視化組件，比如對服務器端數據源的訪問以及 用戶界面組件和數據源之間的數據綁定。
比如，你可以像下面這樣，使用＜mx:Button＞標簽來創建 Button 控件的一個實例：
＜mx:Button? id="myButton"? label="I‘m? a? button!"/＞
這里通過設定 id 屬性賦予了這個 Button 實例一個獨一無二的名字，你以后可以使 用這個名字來引用這個實例。而 label? 屬性用來設置顯示在這個 Button 實例上的標 簽內容。

下面的例子展示了用來創建一個展示 Button 控件的 Flex 程序的完整代碼：
＜?xml? version="1.0"? encoding="utf-8"?＞
＜mx:Application
xmlns:mx=" http://www.adobe.com/2006/mxml "
horizontalAlign="center"? verticalAlign="center"＞

＜mx:Button? id="myButton"? label="I’m? a? button!"? /＞
＜/mx:Application＞

當你編寫完一個 Flex 程序之后，你必須使用 Flex 編譯器編譯它。Flex 編譯器是一 個叫做? mxmlc 的小型執行文件，它在你的 Flex? 2 安裝目錄下的 Flex? SDK? 2.0\bin 文件夾中。
提示：請確定 Flex? 2 安裝目錄\? Flex? SDK? 2.0\bin 文件夾在你的系統變量中。把 Flex 編譯器設定到你的系統變量中可以使你不管在哪個文件夾下都可以從命令行直
接調用它。

步驟：

1.? 用你喜歡的文本編輯器創建一個新的文件（比如，記事本）并把它保存為
MyFirst.mxml。

2.? 把前面例子中的代碼寫入 MyFirst.mxml 中并保存文件。

3.? 通過選擇? 開始? ＞? 所有程序? ＞? 附件? ＞? 命令提示符? ，打開一個命令行窗口。
4.? 改變當前的目錄，將它指向你在第一步中保存的 Flex 程序所在的文件夾。
5.? 敲入下面的命令來調用 Flex 編譯器：
mxmlc? --strict=true? --file-specs? MyFirst.mxml
命令行中以兩個短劃線開頭的兩個元素就是所謂的編譯器選項，它們被用來 定義 Flex 編譯器的行為。在上一個例子中，你把? –strict? 選項設為 true? 來 強制編譯器執行 strict 模式。在 strict 模式中，編譯器對你的代碼有更嚴 格的檢查。比如，它會檢查你是否為變量定義了類型。--file-specs 用來定 義需要編譯的 MXML 文件。
6.? 你可以在 Windows 資源管理器中雙擊 SWF 文件來運行它，也可以在命令行中 輸入它的名字在獨立的 Adobe? Flash? Player? 9 中運行它。

運行結果圖示：

譯注：由于文檔中無法嵌入 SWF 文件，代碼運行結果請查看原文中相應的部分。

提示：你也可以使用Adobe Flex Builder 2 來創建和編譯你的Flex應用程序。AdobeFlex Builder2是一個含有一個可視化設計視圖的開發Flex的集成開發環境（IDE）。 想要獲得更多關于Flex? Builder2的信息，請看使用? Flex? Builder2。

ActionScript
MXML 標簽與 ActionScript 類或者類中的屬性是相對應的。當你編譯你的 Flex 應用 程序的時候，Flex 解析你的 MXML 標簽并且生成相應的 ActionScript 類。然后這些 ActionScript 類會被編譯成 SWF 字節碼存儲到一個 SWF 文件中。
提示：你可以把--keep-generated-actionscript? 選項添加到你的 mxmlc 命令行中， 來查看 Flex 生成的 ActionScript 中間文件。
繼續看上面的例子，Flex 提供了一個定義 Flex Button 控件的 ActionScript Button類。
注意：在上面的例子中，＜mx:Button＞標簽中的? mx 前綴是一個命名空間。它是通過
在 Application 標簽中使用一個獨一無二的 URL 來聲明的。mx 前綴把在 mx 命名空間 中的每個組件映射到它的完全限定類名。這就是為什么 Flex 編譯器可以在找到與 mx 命名空間中的 MXML 標簽相對應的 ActionScript 類。
下面的例子展示了如何使用 ActionScript 來創建一個 Button 控件。最后結果和前 面的 MXML 版本的結果是一樣的。

＜?xml? version="1.0"? encoding="utf-8"?＞
＜mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/GettingStartedActionScript/index.html"
creationComplete="creationCompleteHandler();"
width="300"? height="80"? ＞
?＜mx:Script＞
＜![CDATA[?
import? mx.controls.Button;?
import? mx.events.FlexEvent;
??private? var? myButton:Button;
??private? function? creationCompleteHandler():void
??{
//? 創建一個 Button 實例并設置其標簽
myButton? =? new? Button();
myButton.label? =? "I‘m? a? button!";
//一旦 button 組件創建完畢就要通知應用程序并對布局進行處理
myButton.addEventListener? (FlexEvent.CREATION_COMPLETE,
buttonCreationCompleteHandler);
//? 將? Button 實例添加到? DisplayList
addChild? (myButton);
}
private? function? buttonCreationCompleteHandler
(? evt:FlexEvent? ):void
{
//? 將按鈕居中顯示
myButton.x? =? parent.width/2? -? myButton.width/2;
myButton.y? =? parent.height/2? -? myButton.height/2;
}
]]＞?
＜/mx:Script＞?
＜/mx:Application＞

當你通過 ActionScript 來創建一個 Flex 組件時，你必須導入這個組件的類。你還
必須使用 addChild()方法將組件添加到程序的 DisplayList 中來使其可見。通過比 較這兩個等價的例子的長度和復雜性，你可以發現這種簡單的，基于標簽的，而且 具有聲明式語法的 MXML 是如何使你避免編寫很多行 ActionScript 代碼來布局組件 的。

運行結果圖示：

譯注：由于文檔中無法嵌入 SWF 文件，代碼運行結果請查看原文中相應的部分。

注意：這個例子展示了如何在 Script 標簽中編寫 ActionScript，這是在 Flex 程序 中包含 ActionScript 代碼的一種可行的方法。其它的方法是將 script 代碼塊分離 到外部 ActionScript 文件中或者使用外部的 ActionScript 類。