深入淺出Flex4 移動應(yīng)用組件的生命周期

《深入淺出Flex4 移動應(yīng)用組件的生命周期》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在工程資料-天天文庫。

1、深入淺出Flex4Mobile組件的生命周期n前言Flex開發(fā)移動應(yīng)用時，出于性能考慮，需要使用AS3編寫組件Skin，而不是使用MXML。實際上，通過使用AS3編寫組件皮膚，開發(fā)者可以更深入的了解Flex的組件生命周期，無論是對于移動應(yīng)用開發(fā)還是傳統(tǒng)的桌面或者Web應(yīng)用開發(fā)，都大有裨益。本文通過一個實例，來展示如何使用AS3開發(fā)一個Spark組件和對應(yīng)的移動組件Skin，更重要的是解釋與之相關(guān)的Spark組件生命周期知識。n關(guān)于本系列文章Spark架構(gòu)的目的就是分離組件行為和可視化。在Spark框架中，組件的數(shù)據(jù)和邏輯行為由組件類負(fù)責(zé)，而可視化剝離到Skin中。組件和其S

2、kin間維護(hù)一個所謂的“契約”。本文不具體解釋Spark架構(gòu)的基本概念，如果您不了解Spark的基礎(chǔ)知識，可以參考Deepa姐姐的文章“?Spark架構(gòu)和組件集的簡要概述”。本文將為你揭示Spark架構(gòu)背后的秘密。本文介紹的內(nèi)容和例子是基于Flex4.5的移動架構(gòu)上，但是其中關(guān)于Spark架構(gòu)的介紹99%通用于非移動框架的Spark組件。為了更好的理解本文，建議您下載Flex4.5SDK源碼。n我們的終極目標(biāo)Flex移動應(yīng)用中，最頻繁使用的組件之一可能就是spark.components.LabelItemRenderer和spark.components.IconItem

3、Renderer了。IconItemRenderer繼承自LabelItemRenderer，而LabelItemRenderer擴(kuò)展了UIComponent。這里有一點(diǎn)問題。如果參看Adobe官方文檔《UsingAdobeFlex4.5》,在“CreateadvancedSparkvisualcomponentsinActionScript”一章有如下描述：CreateaskinnablecomponentbycreatingasubclassoftheSkinnableComponentclass.Askinnablecomponentusestwofiles:onef

4、orthecomponentdefinitionandonefortheskindefinition.CreateaSparkskinnablecomponentasasubclassoftheSkinnableComponentclass.Spark體系的Skinnable組件應(yīng)該是繼承自SkinnableComponent。每一個組件包含兩個文件，一個是組件類（繼承自SkinnableComponent），一個是皮膚類。很顯然，IconItemRenderer和LabelItemRenderer都不屬于SkinnableComponent，其弊端在于每次如果你需要深度定

5、制ItemRenderer，都不得不擴(kuò)展這兩個類，覆蓋其中相關(guān)方法。Part1的目標(biāo)是使用ActionScript創(chuàng)建一個真正Skinnable的ItemRenderer。為了簡單起見，我們以LabelItermRenderer為例。一、開發(fā)Spark組件和mobile應(yīng)用適用的Skin類的步驟36B車追上A車，需要一個步驟：電A車！而創(chuàng)建Spark架構(gòu)下Skinnable的組件需要兩個主要步驟：創(chuàng)建負(fù)責(zé)數(shù)據(jù)和非可視化邏輯的組件類：該類將繼承SkinnableComponent。本例中需要額外兩個接口mx.core.IDataRenderer和spark.component

6、s.IItemRenderer，以便最終用于List的ItemRenderer。創(chuàng)建負(fù)責(zé)可視化的Skin類：由于我們的目標(biāo)是為移動應(yīng)用創(chuàng)建組件Skin，因此該類繼承spark.skins.mobile.supportClasses.MobileSkin。最復(fù)雜的是把大象關(guān)進(jìn)冰箱，具體方法超出本文討論范疇。一、創(chuàng)建Flex手機(jī)項目啟動FlashBuilder4.5，點(diǎn)擊“文件->新建”創(chuàng)建“Flex手機(jī)項目”，如下圖。跟隨向?qū)нx擇手機(jī)操作系統(tǒng)和應(yīng)用模板。本例中選擇的模板是”基于視圖的應(yīng)用程序”。FlashBuilder將為我們創(chuàng)建空的手機(jī)應(yīng)用項目，在本例中，我們最終所創(chuàng)建項目

7、的項目結(jié)構(gòu)如下：36一、創(chuàng)建Component類1、創(chuàng)建繼承SKINNABLECOMPONENT，實現(xiàn)IDATARENDERER和IITEMRENDERER的AS3類：MOBILEITEMRENDERER.AS在src目錄下，創(chuàng)建路徑為com.mark.demos.components的package。在該package下，通過菜單“新建->ActionScriptSkinnable組件”創(chuàng)建Skinnable組件類。在創(chuàng)建向?qū)е?如下圖)，指定該類名為MobileItemRenderer?？梢钥吹皆擃惖某惸J(rèn)設(shè)