1. 程式人生 > >Flex 元資料(metadata)的使用

Flex 元資料(metadata)的使用

雖然多數Flex開發者都使用過[Bindable]標籤,但是很多人都不知道這個標籤的作用甚至不知道該標籤為何物。[Bindable]就是所謂的元資料標籤。元資料標籤是一種特殊的標籤,它在程式碼中的作用就是向編譯器提供如何編譯程式的資訊。實際上,這些標籤並沒有被編譯到生成的SWF檔案中,而只是告訴編譯器如何生成SWF檔案。文件中列出的元資料標籤共有12個,本文將講解這些元資料標籤的定義並給出使用它們的示例,在看完這篇文章之後,你就會明白應該在何時何處在你的Flex 2應用程式中使用元資料標籤了。 
[ArrayElementType]

實際上,定義一個數組通常來說是一件很平常的事情,因為陣列中的元素可以是任何型別的。不過,使用ArrayElementType元資料標籤可以讓你定義陣列元素的資料型別。下面的例子展示瞭如何使用[ArrayElementType]: 


程式程式碼 

   
[ArrayElementType("String")]
public var arrayOfStrings:Array;
[ArrayElementType("Number")]
public var arrayOfNumbers:Array;
[ArrayElementType("mx.core.UIComponent")]
public var arrayOfUIComponents:Array; 

[Bindable]

什麼是元資料(metadata):[Bindable]大概又是Flex用得最多的元資料了。我就按自己的理解隨便解釋一下:首先要明白元資料不是語法的一部分,而是專門給編譯器用的,說白了是告訴編譯器做某些事情,學過java之類的應該知道。那Bindable來講,它的作用是告訴 flex編譯器,給某些某些東西建立繫結關係,flex編譯器會在編譯過程中給AS(flex編譯器就是把mxml編譯成as,再編譯到swf,也可能直接編譯倒swf,我這裡假設有as這麼個環節)加一點事件發生和處理之類的程式碼,由此繫結的關係便建立了,如果我們用純粹as3程式碼來寫也是可以實現的,就是太太太麻煩。 

什麼是繫結: 
舉個例子:給下面的public變數加上[Bindable] 
[Bindable]
public var name:String = "";

作為一個public變數,肯定既可以被賦值,也能賦值給別的變數。繫結的作用就是,當name改變的時候(被賦值了),可能通知其它被name影響(賦值給它們)的變數發生改變。這裡的“可能”就需要編譯器來判斷,這就是為什麼元資料是給編譯器用的原因了。在mxml裡用{}的語法的地方就是繫結的物件,比如label={xxx.name},當name變化,label也跟著變化。這樣,我們只是很簡單的改變了name的值,由於有繫結,介面上的 label也跟著自動變化了,爽吧。 

能用在哪裡 

三個地方:類, 變數, getter/setter。是不是public沒有關係,private的就只能給自家用唄。用在Class上就是簡單的給所有的public屬性(包括變數,getter/setter,普通方法)加上 [Bindable],可是一般的方法不能用[Bindable]呀,於是一般就能看到flex給了個warning,直接無視:)。變數嘛就是上面講的,很簡單略掉。 
用在只讀,只寫屬性(getter/setter)上面 
終於講到關鍵地方了,因為getter和setter很像方法,用起來會有點不同。看看這個例子:
[Bindable]
private var content:Array = new Array();
[Bindable]
public function set _content(ct:String):void
{
        content = ct.split(SEP);
}
[Bindable]              
public function get _wholeText():String
{
        if(content.length == 0)
        {
               return "";
        }
        else
        {
               var _w:String = "";
               for(var i:int=0 ; i<content.length ; i++)
               {
                      _w += content[i] + "\r\n";
               }
               return _w;
        }
}

原來的設想是content繫結_wholeText,可它是不工作的。為什麼?_wholeText太複雜了,被編譯器排除在“可能”之外,編譯器認為沒有繫結關係,如果只是簡單的return content,倒是可以的。我這裡搜到了一些比較權威的解釋。來自http://www.rubenswieringa.com/blog/binding-read-only-accessors-in-flex找到Ely Greenfield講的。 

     Now keep in mind that there’s no way for the compiler to actually tell if the value of a property get function would be different if called, short of doing an extensive code flow analysis of the get function, identifying all the inputs that might be affecting the value of the get function (i.e., member fields, statics, globals that are used in the get function and in any methods, global functions, closures, etc) it might call, and setting up watchers on every one of those to trigger the binding when any of them change. That’s prohibitively difficult, and expensive to do. So the compiler doesn’t try. 

     Instead when you put [Bindable] on a get/set property, the compiler makes it bindable with a little creative rewriting that allows the framework to watch the get function, and dispatch a change event when the get function is triggered. This means that automatic bindable properties don’t work when the get function is computed from multiple values, or when you change its value by setting a backing field, rather than using the set function. 

     It _also_ means that if you have no set function, we can pretty much guarantee that there’s no way automatically bindable get properties will be triggered. a read only propeerty is, to the compiler, completely opaque…at the moment, it has no idea where that value is coming from, and hence will never be able to ‘automatically’ trigger the binding. 

說白了就是為了降低複雜度和提高效率,複雜情況的getter會被忽略。如何解決?可以手動建立繫結,即[Bindable("eventName")]。把程式碼改成這樣:
[Bindable]
private var content:Array = new Array();
[Bindable]
public function set _content(ct:String):void
{
        content = ct.split(SEP);
        this.dispatchEvent(new Event("_contectChanged"));
}
[Bindable("_contectChanged")]              
public function get _wholeText():String
{
        if(content.length == 0)
        {
               return "";
        }
        else
        {
               var _w:String = "";
               for(var i:int=0 ; i<content.length ; i++)
               {
                      _w += content[i] + "\r\n";
               }
               return _w;
        }
}

這樣就避免了編譯器去自動識別。自己加上繫結關係,當_content被賦值,發出_contentChanged事件,通知所有被繫結的getter方法執行一遍。這也說明了,繫結不過是事件遊戲而已,flex為使用者隱藏了很多底層演算法。 

[DefaultProperty] 

DefaultProperty元資料標籤用來將一個單一屬性設定為某個類的預設屬性。它允許在一個容器標籤內設定屬性,而不用定義屬性的名字。一個簡單的例子就是一個自定義Button類。Listing 3展示了一個簡單的Button類,它將label屬性設定為了DefaultProperty。 
46 

Listing 4展示了label屬性是如何在自定義Button標籤中作為一個字串定義的。 

[Embed] 

Embed元資料標籤用來匯入圖片到程式。可以通過兩種方式使用Embed。你可以將圖片嵌入到ActionScript中並將其指派給一個變數(如同下面程式碼中的第一個例子),或者你也可以將圖片直接指派給元件的屬性(使用下面程式碼中的第二個例子所示的語法規則)。 

例1: 

程式程式碼 

[Embed(source="myIcon.gif")] 
[Bindable] 
public var myIcon:Class; 


上面這兩個例子產生的結果是一樣的。建立myIcon類的好處是,它在一個類中只定義一次並可以繫結到程式中的多個元件。 

[Event] 

Event元資料標籤用來宣告那些被自定義類分派的事件。將這個元資料標籤新增到類定義中之後,你就可以在MXML標籤中新增事件處理函式來初始化該自定義類。Listing 5建立了一個自定義Button類,每當它的label屬性改變的時候就會分派一個事件。Listing 6所顯示的主程式檔案初始化了這個自定義Button並建立了事件處理函式,該函式將新的labe屬性值賦給了一個TextArea元件以顯示當前發生的更改。 

[Effect] 

Effect元資料標籤用來定義一個自定義效果,當某個事件發生的時候該效果會被分派。這個示例可以基於前面Event的例子來建立,通過簡單地更改ButtonLabel類(Listing 7)中的一行程式碼,就定義了一個效果,該效果可以在MXML標籤中直接使用(Listing。 

[IconFile] 

IconFile是用來定義一個jpg,gif或者png檔案的檔名的,它在你的自定義類中作為圖示來使用。[Embed]元資料標籤可以用來嵌入圖片、SWF檔案、音樂檔案以及視訊檔案等,而IconFile則只是用來嵌入用來作為自定義類圖示的檔案。下面是一個IconFile的例子: 


程式程式碼 
[IconFile("icon.png")] 
public class CustomButton extends Button 
{ 

} 



[Inspectable] 

在使用Flex Builder 2的時候,你可能會希望某些自定義元件的屬性在程式碼提示和屬性檢查器(property inspector)中顯示,Inspectable元資料標籤就是用來定義那些屬性的。Listing 9展示的例子定義了一個inspectable的ccType變數,它定義了Visa為預設值、Credit Card為類別並將取值範圍定義為包含了Visa, Mastercard, Discover, 和 American Express的列舉。 

圖5展示了當將元件新增到程式中的時候所顯示的程式碼提示。 

圖6與上面展示的是同樣的程式碼,但是這次是設計檢視,所以我們能看到屬性檢查器。你可以看到屬性ccType的類別為Credit Card,它的所有可選的值都在下拉列表中。 

[InstanceType] 

當在一個模板物件中宣告一個像IDeferredInstance這樣的變數時,InstanceType元資料標籤就用來宣告物件的型別。下面是InstanceType的用法: 


程式程式碼 
[InstanceType("package.className")] 


[NonCommittingChangeEvent] 

NonCommittingChangeEvent元資料標籤在某個特定事件發生的時候可以防止變數在事件發生的過程中被更改。Listing 10展示了它是如何工作的。一個名為s的字串型別的私有變數被繫結到了名為ti2的TextInput元件上。另外一個id為ti1的TextInput元件在它的text發生更改的時候就會將s的值設定為它的text屬性的值。另外,當triggerBinding 事件被分派的時候,附加在s變數上的Binding元資料標籤就會進行繫結。只有在Enter鍵在ti1 TextInput元件中被按下時才會分派triggerBinding事件。 

[RemoteClass] 

RemoteClass可以用來將一個ActionScript類繫結到一個Java類或一個ColdFusion CFC。這樣做可以自動轉換資料型別。下面的例子將包com.mydomain中的名為MyClass的ActionScript類繫結到了同一個包中名為MyClass的Java類: 
程式程式碼 
package com.mydomain { 
   [Bindable] 
   [RemoteClass(alias="com.mydomain.MyClass")] 
   public class MyClass { 
     public var id:int; 

     public var myText:String; 

   } 
} 


[Style] 

Style元資料標籤用來為元件定義自定義樣式屬性的。只需要簡單地將Sytle元資料標籤新增到類的定義當然,然後就可以使用getSytle方法獲取它的值了。Listing 11 和 12中的例子定義了兩個樣式,分別為borderColor 和fillColor,它們的資料型別都是uint。當類初始化的時候這兩個樣式就會在標籤中被設定。程式碼中覆寫了updateDisplayList函式,用自定義的樣式畫了一個圓形邊框並將其填充。 

轉載地址:http://virgoooos.iteye.com/blog/230783