簡(jiǎn)單組件一般都是現(xiàn)存 Flex 組件的子類，它們通過(guò)設(shè)置 skpins 或 styles 屬性來(lái)修改父組件的外觀，或者添加一些新的功能。比如，為 Button 控件增加一個(gè)新的事件類型，或者更改
DataGrid 控件缺省的 styles 和 skins。
在高級(jí)組件中，通常會(huì)執(zhí)行以下動(dòng)作：
1. 更改已有組件的可視化外觀或者可視化特性。
2. 創(chuàng)建復(fù)合組件，將兩個(gè)或者多個(gè)組件包裝在其中。
3. 通過(guò)繼承UIComponent 類來(lái)創(chuàng)建組件。
我們通常用繼承現(xiàn)存類的方式來(lái)創(chuàng)建組件。比如，要?jiǎng)?chuàng)建基于 Button 的控件，我們就創(chuàng)建mx.controls.Button 類的一個(gè)子類。要開發(fā)自己的組件，則需要?jiǎng)?chuàng)建mx.core.UIComponent 類的子類。
關(guān)于重載 UIComponent 類的 protected 方法
Flex 所有的可視化組件都是UIComponent 類的子類。 因此，可視化組件繼承了 UIComponent類所定義的 methods，properties，events，styles 和 effects。
要?jiǎng)?chuàng)建高級(jí)的可視化組件，必須實(shí)現(xiàn)一個(gè)構(gòu)造器（constructor）。另外要有選擇性地重載下表中 UIComponent 類的一個(gè)或者多個(gè) protected 方法：
commitProperties() 提交組件所有的屬性變化。要么使屬性同時(shí)更改，要么確保屬性按照特定順序設(shè)置。
createChildren() 創(chuàng)建組件的子組件。
比如，ComboBox 控件包含了一個(gè) TextInput 控件和一個(gè) Button 控件作為它的子組件。
LayoutChrome() 定義 Container 類的子類容器的 border 區(qū)域。
measure() 設(shè)置組件的缺省 size 和缺省的最小 size。
updateDisplayList() 根據(jù)以前所設(shè)置的屬性和樣式來(lái)確定組件的子組件在屏幕上的大小（size）及位置（position） ，并且畫出組件所使用的所有皮膚（ skins）及圖形化元素。組件的父容器負(fù)責(zé)確定組件本身大小（size）。 組件的使用者不會(huì)直接調(diào)用所有這些方法。 關(guān)于失效(機(jī)制)的方法?
在組件的生命周期中，應(yīng)用可能會(huì)改變組件的大小和位置，更改組件的屬性來(lái)控制組件的顯示，或者更改組件的樣式（styles）和皮膚（skin）屬性。比如，可以更改組件中所顯示的
文本(Text )的字體(Font)大小。 作為變更字體大小工作的一部分，組件的大小也可能隨之發(fā)生變化，這就需要 Flex 去更新應(yīng)用的布局。布局操作需要Flex 調(diào)用自定義組件的commitProperties(), measure(), layoutChrome(), 以及 updateDisplayList()方法。
應(yīng)用通過(guò)程序來(lái)更改字體大小的執(zhí)行速度大大快于 Flex 更新應(yīng)用的速度。因此，你應(yīng)該在確定最終要更改的字體之后再更新布局。 另外一個(gè)場(chǎng)景就是，當(dāng)你設(shè)置了組件的多個(gè)屬性后，比如 Button 控件的 label 和 icon 屬性，你肯定會(huì)想讓所有屬性被設(shè)置后一次性執(zhí)行 commitProperties(), measure(), 和 updateDisplayList()方法，而不是設(shè)置過(guò) label 屬性后執(zhí)行一遍這些方法，然后在設(shè)置 icon屬性后又執(zhí)行一次這些方法。
另外，可能有幾個(gè)組件同時(shí)改變了它們的字體大小。這時(shí)應(yīng)該讓 Flex 去協(xié)調(diào)布局操作，以消除任何冗余過(guò)程，而不是在每個(gè)組件更新它的字體大小之后都執(zhí)行一次布局操作。
Flex 使用一種“失效機(jī)制（invalidation mechanism）”來(lái)同步組件的更改。
Flex 用一系列方法的調(diào)用來(lái)標(biāo)記組件的某些東西已經(jīng)發(fā)生變化，并需要 Flex 去調(diào)用組件的commitProperties(), measure(), layoutChrome(),或者 updateDisplayList()方法。通過(guò)這種辦法，F(xiàn)lex 實(shí)現(xiàn)了“失效機(jī)制” 。
下表描述了有關(guān)“失效(invalidation)”方法：
invalidateProperties() 通知組件，以使下次屏幕更新時(shí)，它的commitProperties()方法能被調(diào)用。
invalidateSize() 通知組件，以使下次屏幕更新時(shí)，它的 measure()方法能被調(diào)用。
invalidateDisplayList() 通知組件，以使下次屏幕更新時(shí)它的 layoutChrome()方法和updateDisplayList()方法能被調(diào)用。
當(dāng)組件調(diào)用一個(gè)“失效”方法，它就通知 Flex，該組件已經(jīng)被更新。當(dāng)多個(gè)組件調(diào)用失效方法，F(xiàn)lex 會(huì)協(xié)調(diào)這些更新，以使這些更新操作下一次屏幕更新時(shí)一起執(zhí)行。
通常，
組件使用者不必直接調(diào)用這些“失效”方法。這些”失效”方法被組件的 setter 方法或者組件的其他方法在需要的時(shí)候調(diào)用. 關(guān)于組件實(shí)例化的生命周期
組件實(shí)例化生命周期描述了用組件類創(chuàng)建組件對(duì)象時(shí)所發(fā)生的一系列步驟.作為生命周期的一部分,Flex 自動(dòng)調(diào)用組件的方法,發(fā)出事件,并使組件可見。
下面例子用 ActionScript 創(chuàng)建一個(gè) Button 控件，并將其加入到容器之中：
//創(chuàng)建一個(gè) Box 容器。
var boxContainer:Box = new Box();
//設(shè)置 Box 容器
…
//創(chuàng)建 Button 控件。
var b:Button = new Button()
//設(shè)置 button 控件。
b.label = "Submit";
...
// 將 Button 添加到 Box 容器中。
boxContainer.addChild(b); 下面的步驟顯示了用代碼創(chuàng)建一個(gè) Button 控件，并將這個(gè)控件添加到 Box 容器中時(shí)所發(fā)生的一切：
1. 調(diào)用了組件的構(gòu)造函數(shù)，如下面代碼所示:
// Create a Button control.
var b:Button = new Button()
2. 通過(guò)設(shè)置組件的屬性對(duì)組件進(jìn)行了設(shè)置,如下面代碼所示:
// Configure the button control.
b.label = "Submit";
組件的 setter 方法將會(huì)調(diào)用 invalidateProperties(), invalidateSize(), 或者invalidateDisplayList() 方法.
3. 調(diào)用 addChild()方法將該組件添加到父組件中,如下代碼所示:
// Add the Button control to the Box container.
boxContainer.addChild(b);
Flex 執(zhí)行以下動(dòng)作:
4. 將 component 的 parent 屬性設(shè)置為對(duì)父容器的引用.
5. 計(jì)算組件的樣式(style) 設(shè)置.
6. 在組件上分發(fā)preinitialize 事件.
7. 調(diào)用組件的createChildren() 方法.
8. 調(diào)用invalidateProperties(), invalidateSize()和 invalidateDisplayList()方法以觸發(fā)后續(xù)到來(lái)的,下一個(gè)“渲染事件”(render?event)期間對(duì) commitProperties(), measure(),或 updateDisplayList()方法的調(diào)用。
這個(gè)規(guī)則唯一一個(gè)例外就是當(dāng)用戶設(shè)置組件的 height 和 width 屬性時(shí), Flex 不會(huì)調(diào)用measure() 方法.
9. 在組件上分發(fā)initialize 事件。此時(shí)，組件所有的子組件都被初始化，但是組件沒(méi)有改更size 和處理布局。可以利用這個(gè)事件在組件布局之前執(zhí)行一些附加的處理。
10. 在父容器上分發(fā) childAdd 事件.
11. 在父容器上分發(fā)initialize 事件. 12. 在下一個(gè)“渲染事件”(render?event)中, Flex 執(zhí)行以下動(dòng)作:
a. 調(diào)用組件的 commitProperties()方法.
b. 調(diào)用組件的 measure()方法.
c. 調(diào)用組件的 layoutChrome()方法.
d. 調(diào)用組件的 updateDisplayList()方法.
e. 在組件上分發(fā) updateComplete 事件.
13. 如果commitProperties(), measure()或者 updateDisplayList()方法調(diào)用了 invalidateProperties(), invalidateSize(),或 invalidateDisplayList()方法,則 Flexh 會(huì)分發(fā)另外一個(gè) render 事件.
14. 在最后的render 事件發(fā)生后, Flex 執(zhí)行以下動(dòng)作:
a. 通過(guò)設(shè)置組件的 visible 屬性使組件變?yōu)榭梢?
b. 在組件上分發(fā) creationComplete 事件.組件的大小(size)和布局被確定.這個(gè)事件只在組件創(chuàng)建時(shí)分發(fā)一次.
c. 在組件上分發(fā) updateComplete 事件.無(wú)論什么時(shí)候,只要組件的布局(layout),位置,大小或其它可視的屬性發(fā)生變化就會(huì)分發(fā)這事件,然后組件被更新，以使組件能夠被正確地顯示.
當(dāng)使用 addChild()方法將組件添加到容器中時(shí),大部分工作都是為了設(shè)置這個(gè)組件.這是因?yàn)橹钡桨呀M件添加到容器中時(shí),Flex 才能確定它的大小(size),設(shè)置它所繼承樣式(style)屬性,或者在屏幕上畫出它. 也可以用 MXML，在應(yīng)用中完成上面的組件添加動(dòng)作,如下面的例子所示:
<mx:Application xmlns:mx="
<mx:Box>
<mx:Button label="Submit"/>
</mx:Box>
</mx:Application>
在 MXML 中創(chuàng)建組件時(shí)，F(xiàn)lex 執(zhí)行的步驟順序同用 ActionScript 的步驟順序相同. 使用 removeChild() 方法可將組件從容器中移出， 如果對(duì)這個(gè)組件再?zèng)]有其他的引用,那就相當(dāng)于使用 Adobe Flash Player 或 Adobe AIR 的垃圾回收機(jī)制將組件從內(nèi)存中刪除. 關(guān)于創(chuàng)建組件的步驟
為了實(shí)現(xiàn)一個(gè)組件,就要重載組件的方法,定義新的屬性,分發(fā)新的事件,或者執(zhí)行其他任何應(yīng)用所需的自定義的邏輯.要想實(shí)現(xiàn)自己的組件, 請(qǐng)遵循以下這些常規(guī)步驟:
1. 如果有必要，為組件創(chuàng)建所有的皮膚（skins） ．
2. 創(chuàng)建 ActionScript 類文件．
a. 從一個(gè)基類擴(kuò)展，比如 UIComponent 或者其他的組件類．
b. 指定使用者能夠通過(guò) MXML 標(biāo)記進(jìn)行設(shè)置的屬性．
c. 嵌入（Embed）所有的圖片和皮膚文件．
d. 實(shí)現(xiàn)構(gòu)造器．
e. 實(shí)現(xiàn) UIComponent.createChildren()方法.
f. 實(shí)現(xiàn) UIComponent.commitProperties() 方法.
g. 實(shí)現(xiàn) UIComponent.measure() 方法.
h. 實(shí)現(xiàn) UIComponent.layoutChrome() 方法.
i. 實(shí)現(xiàn) UIComponent.updateDisplayList() 方法.
j. 增加屬性(properties),方法(methods),樣式(styles),事件 （events）以及元數(shù)據(jù)．
3. 以 ActionScript 文件或者 SWC 文件的形式部署組件．
定義新組件時(shí)不一定要重載所有的方法．只需要重載實(shí)現(xiàn)組件功能所需的方法．如果創(chuàng)建現(xiàn)存組件的子類，比如 Button 控件或者 VBox 容器，那么必須實(shí)現(xiàn)組件中所添加的新功能所需
的方法．
例如：實(shí)現(xiàn)一個(gè)自定義的 Button 控件，該控件使用新的機(jī)制來(lái)定義缺省大小（size） ．在這種情況下，只需要重載 measure()方法．對(duì)于這個(gè)例子，參見實(shí)現(xiàn) easure() 方法．
或者，要實(shí)現(xiàn) VBox 容器的一個(gè)新子類．新子類利用 VBox 類已有的所有有關(guān)設(shè)定大小（sizing）的邏輯，但是變更了 VBox 類的布局邏輯以實(shí)現(xiàn)從底部到頂部的方式來(lái)布局容器中的
子控件，而不是自頂向下的布局．在這種情況下，只需要重載updateDisplayList()方法．關(guān)于這個(gè)例子，見實(shí)現(xiàn) updateDisplayList()方法．
關(guān)于接口
Flex 用接口將組件的基本功能分為離散的單元， 這使得它們可以被 “一塊一塊” 地實(shí)現(xiàn)． 例如，使組件可聚焦（有輸入焦點(diǎn)） ，它必須實(shí)現(xiàn) IFocusable 接口；要使它能夠參與布局過(guò)程，它必須實(shí)現(xiàn) ILayoutClient 接口． 為了簡(jiǎn)化接口的使用， UIComponent 類實(shí)現(xiàn)了下表中定義的所有接口，但是不包括IFocusManagerComponent 接口和 IToolTipManagerClient 接口．但 UIComponent 很多子類實(shí)現(xiàn)了 IFocusManagerComponent 和 IToolTipManagerClient 接口．
因此，創(chuàng)建 UIComponent 或其子類的子類，就不必實(shí)現(xiàn)這些接口．但是，如果要?jiǎng)?chuàng)建的組件不是 UIComponent 的子類，并且還想在 Flex 中使用這個(gè)組件，那么就必須實(shí)現(xiàn)一個(gè)或者多個(gè)接口。
注意：對(duì)于 Flex, Adobe 建議所有的組件都應(yīng)從 UIComponent 及其子類繼承.
下表列出了 Flex components 所實(shí)現(xiàn)的主要接口:
接口 用途
IChildList 表明容器中子控件的數(shù)量.
IDeferredInstantiationUIComponent 表明組件或組件能實(shí)施延遲實(shí)例化.
IFlexDisplayObject 指定皮膚元素的接口.
IFocusManagerComponent 表明組件或者對(duì)象是可聚焦的,這意味著組件可以從 FocusManager 獲取焦點(diǎn).
UIComponent 組件沒(méi)有實(shí)現(xiàn) Ifocusable 接口,因?yàn)橛行┙M件不打算接受焦點(diǎn).
IInvalidating 表明組件或者對(duì)象能夠使用”失效機(jī)制”去執(zhí)行延遲的,而不是立即的屬性提交( commitment), 度量(measurement), 以及畫出(drawing) 或布局( layout).
ILayoutManagerClient 表明組件或者對(duì)象能夠參與 LayoutManager 的提交(commit) ,度量(measure)和更新次序(update sequence)
IPropertyChangeNotifier 表明組件支持特定形式的事件傳播.
IRepeaterClient 表明組件或者對(duì)象能夠被用于 Repeater 類.
IStyleClient 表明組件能夠從其他的對(duì)象繼承樣式,并且支持setStyle() 和 getStyle() 方法.
IToolTipManagerClient 表明組件有一個(gè) toolTip 屬性,并且因此可以被ToolTipManager 所監(jiān)控.
IUIComponent 定義組件能夠成為布局管理器或列表的子組件所必須實(shí)現(xiàn)的基本 APIs.
IValidatorListener 表明組件能夠監(jiān)聽校驗(yàn)(validation)事件,并且因此能夠顯示校驗(yàn)狀態(tài),比如一個(gè)紅色邊框和顯示校驗(yàn)錯(cuò)誤的提示信息(tooltips)