1.在類宣告前插入[style]元資料標籤,語法如下:
[style(name="style_name"[,property="value",...])]
2.定義乙個靜態初始器,為樣式屬性設定預設值。
3.覆寫stylechanged()方法,檢測樣式屬性是否改變。
4.覆寫updatedisplaylist() 方法,在顯示元件時加入樣式。
一般情況下,我們會使用乙個狀態變數來標識樣式是否改變。在updatedisplaylist方法中,首先 檢測該標識,再基於新樣式設定更新元件外觀。注意:updatedisplaylist方法只更新因為該樣式改變而需要重繪或重新計算的部分外觀,而不是 整個元件的外觀。
如果要建立乙個自定義元件,你需要重寫uicomponent類的某些方法,最少需要重寫如下方法:建構函式, createchildren(), commitproperties(), measure(), layoutchrome(), updatedisplaylist() 。
基礎語句結構如下:
package mycomponents
}注意包名與你的磁碟目錄結構一致。接下來一一講解每個方法的重寫。
建構函式
示例如下:
public function 類名()
注意,as3中建構函式不支援過載。
createchildren()
此方法的作用是在此自定義元件中建立子元件。
此方法不用你去呼叫,flex在你將此自定義元件使用addchild方法加入到父元件時自動呼叫。示例如下:
// declare two variables for the component children.
private var text_mc:textarea;
private var mode_mc:button;
override protected function createchildren():void
// test for the existence of the children before creating them.
if (!mode_mc)
}上例使用createchildren()在此自定義元件中加入了乙個label和乙個button。
commitproperties()
此方法是在修改元件屬性時使用。
此方法不用你去呼叫。當你呼叫invalidateproperties()(重新整理屬性)、addchild()(增加子元件)方法時,flex會自動呼叫此方法。這樣元件在下次顯示時,就能以新的屬性來顯示。
此方法還有乙個作用是為measure()方法提供最新的屬性資訊。
measure()
此方法的作用是設定元件的預設尺寸。
此方法不用你去呼叫。當你呼叫invalidatesize ()(重新整理尺寸)、addchild()(增加子元件)方法時,flex會自動呼叫此方法。這樣元件在下次顯示時,就能以預設尺寸來顯示。
如果你顯式的設定了元件的尺寸,如,flex就不用呼叫此方法了。要注意,measure()方法只是設定元件的預設尺寸,在updatedisplaylist()方法中,元件具備的實際尺寸(actual size)與預設尺寸可能不同。
flex中的每個元件都是有預設尺寸的。如這樣寫:,flex就會自動給乙個尺寸。如果你想重寫預設尺寸,可以重新設定measuredheight 、measuredwidth、measuredminheight、measuredminwidth。如下例:
package mycomponents
override protected function measure():void }}
然後在mxml中使用:
<?xml version="1.0"?>
xmlns:mycomp="mycomponents.*" >
此中的bluebutton就會以預設值100寬,50高來顯示。
layoutchrome()
一些容器類(container)或其子類採用此方法設定元件的border area(邊框區域)。
此方法不用你去呼叫。當你呼叫invalidatedisplaylist ()(重新整理顯示)方法時,flex會自動呼叫此方法。這樣元件在下次顯示時,就能以新的邊框來顯示。
典型的用法是你可以重寫rectangularborder類。
乙個將元件的邊框區域(border area)和內容區域(content area)分開處理的原因是當container.autolayout=false時。
總括的來講,layoutchrome()是用來處理邊框區域的重新整理顯示,而updatedisplaylist()用來處理內容區域的重新整理顯示。
updatedisplaylist()
此方法不用你去呼叫。當你呼叫invalidatedisplaylist ()(重新整理顯示)、addchild()(增加子元件)方法時,flex會自動呼叫此方法。這樣元件在下次顯示時,就能以新的樣子來顯示。其實類似vc++中的paint訊息處理。
此方法的主要作用為:
a.更改元件的尺寸和位置。要改變尺寸,在此方法中使用setactualsize()方法,而不是使用width和height屬性來完成。要改變位置,在此方法中使用move()方法,而不是使用x和y屬性來完成。
b.繪製可視元素,如**、樣式、邊框。你可以使用flash drawing api來完成。
函式的原型為:
protected function updatedisplaylist(unscaledwidth:number,
unscaledheight:number):void
兩個引數分別為此自定義元件的寬度和高度。當然如果設定父容器設定scaley=2,你設定unscaledheight=100,那麼最終呈現的是200高度的元件。
第乙個功能示例:
package mycomponents
override protected function updatedisplaylist(unscaledwidth:number,
unscaledheight:number):void }}
}第二個功能示例:
override protected function updatedisplaylist(unscaledwidth:number, unscaledheight:number):void
Flex自定義元件
使用mxml標籤定義 主檔案main1.mxml 注 xmlns mycomp 自定義命名空間其實很類似於包的概念用來管理元件的。實際當中最好把自己的元件檔案分資料夾管理。元件定義mycomp1.mxml 濟南威海 煙台注 元件的檔名就對應著將來使用時的mxml標籤名,根標籤就是你用來擴充套件的父類...
flex自定義元件
加入自定義事件 首先用元資料標籤給clogin新增自定義事件 示例 clogin.mxml event btnclicked 12 15 textalign left 12 15 textalign left displayaspassword true 12 x 190 y 118 前面提到,mx...
flex自定義元件
加入自定義事件 首先用元資料標籤給clogin新增自定義事件 示例 clogin.mxml event btnclicked 12 15 textalign left 12 15 textalign left displayaspassword true 12 x 190 y 118 前面提到,mx...