深入探究Flex應用程式使用

本文和大家重點討論一下Flex應用程式的概念，主要包括時間和行為的使用，在Flex應用程式中如何添加多個頁面，以及如何使用Flex等內容，希望本文的介紹能讓你有所收穫。

一、事件和行為的使用

HTML應用程式的原理是由用戶端發出請求，並從伺服器端得到反應。與之不相同的是，Flex應用程式是基於事件的/event-based。舉個例子，當使用者單擊一個按鈕時，便會觸發一個事件。應用程式本身，不是指伺服器，包含了識別事件的邏輯並採取相應的行動。

當事件被觸發時修改組件的屬性

對某個組件以編程方式進行操作時，為了對某個事件作出反應，必須首先要引用它，這時你就需要賦予它一個ID值，如下所示：
 

 

  

  
height="80%"x="122"y="24"> 
 

隨後你就可以將行為/behavior添加到應用程式上，當某個事件被觸發時改變組件的屬性值，就象這樣：
 

 

  

  
click="myPanel.visible=false"/> 
 

當按鈕被單擊時，面板的可見屬性值被設定為false。

使用ActionScript功能函數

你也可以通過編寫ActionScript功能函數，並在事件中調用它來達到相同的目的，在這種情況下，按鈕組件的單擊事件如下所示：
 

 

  
 
  

  
layout="absolute"> 
  
 
  
 
  
 
  
 &nbsp;</li><li>publicfunctionclose():void{ &nbsp;</li><li class="alt">myPanel.visible=false; &nbsp;</li><li>} &nbsp;</li><li class="alt"> 
  
 
  
 
  

  
height="80%"x="122"y="24"> 
  

  
left="10"right="30"/> 
  

  
click="close();"/> 
  
 
  
 
  
 
 

ActionScript功能函數是在MXML檔案裡的塊中進行定義的，然後引用到按鈕的單擊事件上。

單獨的ActionScript代碼

為了從MXML檔案中更好地分離出ActionScript代碼，你可以將它們放到單獨的ActionScript檔案中而不是作為函數，然後再將它們匯入到MXML檔案裡，如下所示：

運用行為和變換增強豐富的視覺互動性

Flex應用程式是事件驅動的，這就意味著你可以在程式運行時使用事件去添加豐富的視覺互動性。為了實現它，你使用了一個事件觸發程序，用其來描述一個行為。
在前面的例子中，面板組件的visible屬性值被設定為false因而不可見。你還可以通過使用行為來製造出更強的視覺效果。
下面的例子建立了一個行為，該行為首先建立好一種效果，然後把它綁定到組件的hideEffect屬性上觸發器）：
 

 

  
 
  

  
height="80%"hideEffect="{myFade}"> 
 

當關閉按鈕被單擊時，面板組件淡出而不是消失。
觸發器和效果還可以組合到更為複雜的行為中，其被稱之為變換/transitions。

二、在應用程式中添加多態頁面

有幾種方法在一個Flex應用程式中建立多態頁面。你可以使用ViewStack組件、建立單獨的MXML檔案、或者使用檢視狀態。檢視狀態可以被看作是一個組件或組件群構成的預定義的使用者介面布局。你可以使用檢視狀態為程式表現出不同的視覺效果。每一種檢視狀態都是基於一種基礎的狀態，並進行繼承和擴充。
在隨後的例子中，當使用者在組件上滾動滑鼠時，基礎狀態發生變化。

當一個檢視狀態被調用時通過使用者的滑鼠在組件上滾動時產生的事件），一種效果或一種變換）改變了使用者介面的外觀。
使用檢視狀態方式、ViewStack方式還是MXML檔案方式，取決於你想從一個頁面到另一個頁面進行變化的範圍、使用者介面的複雜性、以及實現Flex程式的構架。

三、開始使用Flex

現在，想必你對Flex的概念有了一個基礎的認識，讓我們開始建立Flex應用程式吧。

◆使用FlexBuilder

通過使用新項目嚮導/NewFlexProjectWizard建立一個Flex項目File>New>FlexProject）。設計，編譯，以及調試Flex應用程式所需的所有工具，都被包括在FlexBuilder中了。

◆使用FlexSDK

建立一個檔案名稱尾碼為MXML的文字檔，在其中添加MXML檔案的基本元素上述例子中的頭兩行代碼），然後使用文檔資料特別是AdobeFlex2LanguageReference）去研究各種組件的用法。編譯和調試工具是以命令列的方法提供的。