自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

解析重寫Flex組件中角色 規(guī)則和步驟

開(kāi)發(fā) 后端
本文向大家介紹一下如何重寫Flex組件,在Flex已有Flex組件無(wú)法滿足業(yè)務(wù)需求,或是需要更改其可視化外觀等特性時(shí),直接進(jìn)行繼承擴(kuò)展。

在學(xué)習(xí)Flex的過(guò)程中,你可能會(huì)遇到重寫Flex組件的問(wèn)題,這里和大家分享一下,希望本文的介紹能讓你有所收獲。

重寫Flex組件

一、為什么要重寫Flex組件

1、在Flex已有Flex組件無(wú)法滿足業(yè)務(wù)需求,或是需要更改其可視化外觀等特性時(shí),直接進(jìn)行繼承擴(kuò)展。舉例,繼承BUTTONFlex組件的長(zhǎng)文本卻不自動(dòng)換行的自定義控件。

2、為了模塊化設(shè)計(jì)或進(jìn)一步重用,需要對(duì)Flex組件進(jìn)行組合。比如一個(gè)包括TEXTAREA,BUTTON的復(fù)合控件。

二、重寫Flex組件需要經(jīng)常換位思考的三個(gè)角色

1、作為重寫Flex組件的使用者,有哪些需求。比如需要在MXML標(biāo)簽和AS代碼中暴露哪些屬性及對(duì)應(yīng)默認(rèn)值、事件和事件的處理邏輯。

2、重寫Flex組件一般需要使用Flex原有Flex組件,要站在原有開(kāi)發(fā)者的角度了解設(shè)計(jì)規(guī)則。

3、作為重寫Flex組件的設(shè)計(jì)者,在滿足需求的情況下盡量做到可復(fù)用、低耦合易擴(kuò)展等設(shè)計(jì)原則,讓新Flex組件像Flex原Flex組件一樣好用。

三、重寫Flex組件AS方式和MXML方式的采用規(guī)則

1、MXML文件和AS文件***都會(huì)被編譯成AS類,只不過(guò)MXML編譯速度稍慢一些

2、如果MXML和AS都能完成的一個(gè)簡(jiǎn)單Flex組件,MXML更容易被創(chuàng)建和控制布局

3、當(dāng)要覆蓋Flex組件的某些方法時(shí)只能用AS方式

4、創(chuàng)建一個(gè)直接繼承UIComponent的子類時(shí)只能用AS

5、創(chuàng)建非可視化Flex組件比如Formatter、validator、Effect……時(shí),只能用AS

6、要為Flex組件添加日志功能時(shí),只能用AS.

四、AS方式重寫Flex組件常規(guī)步驟

1、如果有必要,為Flex組件創(chuàng)建所有基于標(biāo)記(tag-based)的皮膚(skins)

2、創(chuàng)建ActionScript類文件

1)從一個(gè)基類擴(kuò)展,比如UIComponent或者其他的Flex組件類

2)指定使用者能夠通過(guò)MXML標(biāo)記進(jìn)行設(shè)置的屬性

3)嵌入(Embed)所有的圖片和皮膚文件,文件大小盡可能小

4)實(shí)現(xiàn)構(gòu)造器,可以設(shè)置屬性和樣式的缺省值,或者初始化數(shù)據(jù)結(jié)構(gòu),比如數(shù)組

5)根據(jù)需要,確定是否覆蓋以下五個(gè)方法:

(a)UIComponent.createChildren()方法,創(chuàng)建Flex組件的子Flex組件

(b)UIComponent.commitProperties()方法,提交Flex組件所有的屬性變化,設(shè)置measure()方法可能使用的屬性值。絕大多數(shù)情況下,都是對(duì)影響Flex組件如何在屏幕上顯示的屬性使用這個(gè)方法

(c)UIComponent.measure()方法,設(shè)置Flex組件的缺省size(measuredWidth、measuredHeight)和缺省的最小size(measuredMinWidth、measuredMinHeight)

(d)UIComponent.layoutChrome()方法,用于定義容器的邊框區(qū)域和確定邊框區(qū)域的位置,以及確定要在邊框區(qū)域中顯示的附加元素。例如,Panel容器使用layoutChrome()方法定義panel容器的title區(qū)域,這個(gè)區(qū)域用來(lái)包含title文本和close按鈕。

通常,使用RectangularBorder類來(lái)定義容器區(qū)域的邊框,而不是用圖片資源去包圍Flex組件。比如創(chuàng)建一個(gè)RectangularBorder對(duì)象,然后在重載的createChildren()方法中,將其作為一個(gè)內(nèi)容子控件添加到Flex組件中,再用updateDisplayList()方法來(lái)確定其位置。

將容器的內(nèi)容區(qū)域和容器邊框區(qū)域分開(kāi)處理的主要原因是為了應(yīng)對(duì)Container.autoLayout

屬性被設(shè)置為false的這種情況。當(dāng)autoLayout(自動(dòng)布局)屬性使用默認(rèn)值true時(shí),只要容器子控件的大小和位置發(fā)生變化,容器及子控件就會(huì)進(jìn)行度量和布局。而當(dāng)其為false時(shí),度量和布局只在子控件被添加或移出容器時(shí)才執(zhí)行。分開(kāi)處理讓Flex在這兩種情況下都執(zhí)行l(wèi)ayoutChrome(),從而在autoLayout屬性為false的情況下,容器仍能夠更新它的邊框區(qū)域。

(e)UIComponent.updateDisplayList()方法,根據(jù)以前所設(shè)置的屬性和樣式來(lái)確定Flex組件的子Flex組件在屏幕上的大?。╯ize)及位置(position),并且畫出Flex組件所使用的所有皮膚(skins)及圖形化元素。Flex組件的父容器負(fù)責(zé)確定Flex組件本身大?。╯ize)。

要在updateDisplayList()方法中確定一個(gè)Flex組件的大小,當(dāng)子Flex組件是UICOMPONENT時(shí)使用setActualSize()方法,而不是UICOMPONENT則使用與Flex組件大小相關(guān)的屬性width和height。要確定Flex組件的位置,當(dāng)子Flex組件是UICOMPONENT時(shí)使用move()方法,而不是UICOMPONENT則使用x和y屬性。一個(gè)區(qū)別就是move()方法不僅改變了Flex組件位置,而且在調(diào)用這個(gè)方法之后立即分發(fā)了一個(gè)move事件,設(shè)置x和y屬性也更改Flex組件的位置,但卻在下一個(gè)屏幕更新事件中才會(huì)分發(fā)move事件。

Flex組件支持很多類型的可視元素,比如皮膚,樣式和邊框。在updateDisplayList()方法中,可以添加這些可視元素,并對(duì)它們進(jìn)行一些控制。由于UICOMPONENT繼承自SPRITE,所以可以使用Graphics對(duì)象中的Flash繪畫APIs進(jìn)行繪制圖形,比如使用Graphics類去畫邊框水平線以及其他圖形元素:

  1. graphics.lineStyle(1,0x000000,1.0);  
  2.  
  3. graphics.drawRect(0,0,unscaledWidth,unscaledHeight);  

updateDisplayList()方法形式如下:

  1. protectedfunctionupdateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void()  
  2.  
  3. {  
  4.  
  5. }  

以像素為單位的Flex組件坐標(biāo)系中,unscaledWidth和unscaledHeight是由父容器確定的Flex組件大小,而不管Flex組件的scaleX,scaleY是多少??s放發(fā)生在FlashPlayer或者AIR中,發(fā)生時(shí)機(jī)是在updateDisplayList()執(zhí)行之后。比如一個(gè)Flex組件的unscaledHeight屬性是100,而其scaleY屬性是2.0,那么它在FlashPlayer或AIR中出現(xiàn)的高度為200像素。

需要注意的是,定義新Flex組件時(shí)不一定要重載所有的五個(gè)方法,只需重載實(shí)現(xiàn)Flex組件功能所必需的即可。比如實(shí)現(xiàn)一個(gè)自定義的Button控件,該控件使用新的機(jī)制來(lái)定義缺省大?。╯ize)。在這種情況下,只需要重載measure()方法?;蛘撸獙?shí)現(xiàn)VBox容器的一個(gè)新子類。新子類利用VBox類已有的所有有關(guān)設(shè)定大小(sizing)的邏輯,但是變更了VBox類的布局邏輯以實(shí)現(xiàn)從底部到頂部的方式來(lái)布局容器中的子控件,而不是自頂向下的布局。在這種情況下,只需要重載updateDisplayList()方法。

(6)增加屬性(properties),方法(methods),樣式(styles),事件(events)以及元數(shù)據(jù)

3、以ActionScript文件或者SWC文件的形式部署Flex組件
 

【編輯推薦】

  1. 技術(shù)分享 如何重寫Flex組件
  2. Flex基礎(chǔ) 創(chuàng)建***個(gè)Flex項(xiàng)目
  3. 解析Flex事件執(zhí)行流程
  4. FlexBuilder3.0與Eclipse3.4的***結(jié)合
  5. 學(xué)習(xí)筆記 FlexBuilder2.0中如何使用基于Lists的控件 

 

 

責(zé)任編輯:佚名 來(lái)源: javaeye.com
相關(guān)推薦

2010-08-12 11:21:30

重寫Flex組件

2010-07-28 12:52:39

Flex組件

2010-08-12 11:29:01

Flex組件

2010-08-13 09:21:12

FlexButton組件

2010-07-27 10:39:25

Flex組件

2010-07-28 12:41:18

Flex組件

2010-07-27 10:58:46

Flex

2010-08-13 09:11:11

LabelFlex

2010-08-05 13:33:06

Flex布局規(guī)則

2010-08-06 10:03:42

Flex事件

2010-08-12 15:44:25

Flex應(yīng)用程序

2010-08-06 09:18:14

Flex

2010-08-02 17:08:34

Flex Eclips

2010-08-12 13:59:37

FlexList控件

2010-08-09 15:41:13

Flex字體

2010-07-27 15:14:35

Flex Datapr

2010-08-13 14:05:24

Flex事件機(jī)制

2010-07-29 17:15:55

Flex

2010-08-10 17:13:58

Flex技術(shù)

2010-08-04 15:12:54

Flex開(kāi)發(fā)
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)