Flex入門培訓(xùn)

1、 Flex入門培訓(xùn)入門培訓(xùn)電力產(chǎn)品研發(fā)部謝志奎課程綱要 培訓(xùn)內(nèi)容 Flex基礎(chǔ)概念 Flex開(kāi)發(fā)環(huán)境搭建 Flex+BlazeDS+Java簡(jiǎn)單示例 學(xué)習(xí)路線、相關(guān)書(shū)籍和 網(wǎng)站介紹Flex基礎(chǔ)概念Flex是Adobe公司推出的基于開(kāi)源、免費(fèi)、跨平臺(tái)的新一代Flex富客戶端平臺(tái)。這種新型的Flex富客戶端能夠提供和早期C/S技術(shù)一樣出色的UI，但又和B/S一樣不需要在用戶的機(jī)器上進(jìn)行任何部署，也不需要手動(dòng)對(duì)應(yīng)用程序進(jìn)行版本更新。Adobe的Flex富客戶端技術(shù)為AIR和Flex，其核心以ActionScript語(yǔ)言為基礎(chǔ)，運(yùn)用XML來(lái)描述界面，用編譯器來(lái)生swf文件，使用瀏覽器的Flash pl

2、ayer插件就可以進(jìn)行觀看。 Flex開(kāi)發(fā)環(huán)境搭建 首先雙擊打開(kāi)FlashBuilder_4_Plugin_LS10.exe，在彈出的框中會(huì)讓你選擇把安裝文件解壓到哪個(gè)目錄下，這個(gè)地方需要注意的是，一定不要選擇帶有中文的目錄，不然安裝為出現(xiàn)問(wèn)題Flex與Java通信示例 使用使用Flex RemoteObject組件所需環(huán)境：組件所需環(huán)境：1、jdk需要1.5及以上2、通過(guò)使用BlazeDs作為中間層來(lái)實(shí)現(xiàn)Flex和java類的通信。 BlazeDS概念：概念： BlazeDS是一個(gè)基于服務(wù)器的Java 遠(yuǎn)程控制(remoting)和Web消息傳遞(messaging)技術(shù)，它能夠使得后端的J

3、ava應(yīng)用程序和運(yùn)行在瀏覽器上的Adobe Flex應(yīng)用程序相互通信. 它是一個(gè)web應(yīng)用框架,一個(gè)web應(yīng)用框架的基礎(chǔ)還是servlet和過(guò)濾器。所以它里面有個(gè)MessageBrokerServlet。這個(gè)servlet的用處和其他框架，如struts,spring里的新增配置文件（struts.xml,application.xml）所起到的作用類似，匹配url，決定將請(qǐng)求發(fā)往給哪個(gè)服務(wù),所有的服務(wù)在他內(nèi)部是通過(guò)services-config.xml等幾個(gè)文件安排的. Flex與Java通信示例需求：Flex有一個(gè)輸入框、按鈕和Lable，在輸入框中輸入信息后點(diǎn)擊按鈕，可以通過(guò)Remote

4、Object方法調(diào)用java類中的方法。通過(guò)該類中的方法對(duì)數(shù)據(jù)進(jìn)行處理并返回，將處理后的數(shù)據(jù)顯示在Lable上。服務(wù)器端文本框數(shù)據(jù)被改變swf通過(guò)RemoteObject方法調(diào)用類中的方法，并將輸入的值作為方法的參數(shù)，需要remoting-config.xml文件中找到類的映射；Java類數(shù)據(jù)加工.mxml.swf編譯時(shí)生成輸入數(shù)據(jù)點(diǎn)擊提交按鈕BlazeDsflex/remoting-config.xml為了RemoteObject方法能夠調(diào)用類，此處需要配置如果調(diào)用成功會(huì)觸發(fā)RemoteObject方法的result事件，該事件會(huì)調(diào)用我們定義的方法得到處理后數(shù)據(jù)數(shù)據(jù)展現(xiàn)，當(dāng)服務(wù)器傳過(guò)來(lái)的值發(fā)

5、生變化時(shí)，控件上綁定的值會(huì)自動(dòng)刷新 Flex與Java通信示例htmlFlex與Java通信示例BlazeDS實(shí)現(xiàn)類的映射：在WebRootWEB-INFflexremoting-config.xml里面加上下面這段設(shè)置(本示例)： com.HelloWorld 其中id=“hello”是自己對(duì)類起的映射名稱 節(jié)點(diǎn)是類路徑Flex通過(guò)RemoteObject調(diào)用java:其中id=“ro”這個(gè)id的值是自己定義，相當(dāng)于要調(diào)用的類的一個(gè)對(duì)象名稱其中destination=“Hello” 這兒destination的值必須是在remoting-config.xml中定義的id值其中result=“

6、resultHandler(event)” 是結(jié)果響應(yīng)事件，調(diào)用類中的方法后會(huì)自動(dòng)調(diào)用這個(gè)方法。Flex與Java通信示例實(shí)現(xiàn)步驟：1、首先根據(jù)需求實(shí)現(xiàn)類的編寫(xiě)2、在blazeds中實(shí)現(xiàn)類的映射3、完成flex端調(diào)用4、引用flex生成的html文件，查看效果Flex與Java通信示例實(shí)現(xiàn)：1、comHelloWorld.java是Flex應(yīng)用要調(diào)用的類，實(shí)現(xiàn)對(duì)Flex傳進(jìn)來(lái)的數(shù)據(jù)在后端處理并返回處理后的數(shù)據(jù)。2、在WebRootWEB-INFflexremoting-config.xml中添加類的映射，該映射起到了Flex的RemoteObject方法和java類通訊的橋梁作用。3、Firs

7、tProject.mxml是Flex應(yīng)用，實(shí)現(xiàn)前端頁(yè)面的展示。通過(guò)RemoteObject方法對(duì)類中方法的調(diào)用，并且能得到方法的返回?cái)?shù)據(jù)。4、FirstProject.html是對(duì)Flex應(yīng)用生成的swf文件的展示Flex與Java通信示例1、首先需要下載BlazeDS框架框架，下載地址http:/ Project,打開(kāi)新建工程向?qū)?，如下圖：Flex與Java通信示例2、輸入工程名稱，點(diǎn)擊finally后，則Java Web工程建立完成，如下Flex與Java通信示例3、將下載的BlazeDS包解壓到本地，打開(kāi)D:技術(shù)相關(guān)blazeds-turnkey-4931tomcatweb

8、appsblazeds目錄，找到META-INF和WEB-INF兩個(gè)包，把它們拷貝到新建的工程中覆蓋到原有的，然后部署工程Flex與Java通信示例4、在已經(jīng)建立好的web應(yīng)用上，點(diǎn)擊右鍵，選擇添加Flex項(xiàng)目類型,如下圖：Flex與Java通信示例5、選擇你所部署的TomcatwebappsXXX對(duì)應(yīng)的目錄和項(xiàng)目編譯后生成文件的存放位置，然后點(diǎn)擊完成。AS3向向Java轉(zhuǎn)換時(shí)數(shù)據(jù)類型的對(duì)應(yīng)關(guān)系轉(zhuǎn)換時(shí)數(shù)據(jù)類型的對(duì)應(yīng)關(guān)系Java向向AS3轉(zhuǎn)換時(shí)數(shù)據(jù)類型的對(duì)應(yīng)關(guān)系轉(zhuǎn)換時(shí)數(shù)據(jù)類型的對(duì)應(yīng)關(guān)系事件機(jī)制事件機(jī)制 1. 1. 事件簡(jiǎn)介事件簡(jiǎn)介: :事件可以由外設(shè)觸發(fā), 比如:鍵盤,鼠標(biāo), 也可能是外部輸入,

9、 比如:web service的返回.事件還能由組件的外觀和生命周期發(fā)生變化時(shí)觸發(fā), 比如:組件的創(chuàng)建或者改變大小.所有用戶與應(yīng)用交互都會(huì)產(chǎn)生事件.用戶沒(méi)有直接與應(yīng)用交互也可能產(chǎn)生事件, 比如:數(shù)據(jù)裝載完畢.你可以在程序中使用事件監(jiān)聽(tīng)器addEventListener（）監(jiān)聽(tīng)這些事件. 事件監(jiān)聽(tīng)器是函數(shù)方法用于響應(yīng)指定的事件. 有時(shí)也稱之為事件處理器. 2. 2. 事件流簡(jiǎn)介：事件流簡(jiǎn)介：當(dāng)一個(gè)事件被派發(fā)出來(lái)時(shí), 事件對(duì)象從根節(jié)點(diǎn)開(kāi)始自上而下開(kāi)始掃描display list, 一直到目標(biāo)對(duì)象, 檢查每個(gè)節(jié)點(diǎn)是否有相應(yīng)的監(jiān)聽(tīng)器.目標(biāo)對(duì)象指的是display list中產(chǎn)生事件的對(duì)象. Flex核

10、心機(jī)制 3. 3. 手工派發(fā)事件：手工派發(fā)事件： Flex中可以通過(guò)dispatchEvent()方法手工派發(fā)事件, 所有UIComponent的子類都可以調(diào)用此方法.語(yǔ)法:組件對(duì)象.dispatchEvent(new Event(event_type):Boolean參數(shù)event_type是Event對(duì)象的type屬性. 函數(shù)的返回值總是True.可以使用此方法派發(fā)任意事件, 而不僅僅是用戶自定義事件, 比如: 可以派發(fā)一個(gè)Button的Click事件.var result:Boolean = buttonInstance.dispatchEvent(new Event(MouseEven

11、t.CLICK);在Flex應(yīng)用中不是必須對(duì)新派發(fā)的事件進(jìn)行處理, 如果觸發(fā)了一個(gè)事件, 而沒(méi)有對(duì)應(yīng)的Listener時(shí),Flex忽略此事件.Flex核心機(jī)制 綁定機(jī)制綁定機(jī)制 Flex綁定機(jī)制的原理就是事件，在被Flex綁定的對(duì)象上增加了改變事件的監(jiān)聽(tīng)，一旦某個(gè)被Flex綁定對(duì)象改變后，就會(huì)分發(fā)一個(gè)“propertyChange”事件（默認(rèn)的，也可以改變成自己定義的事件），在其他組件中，會(huì)有propertyChange的事件監(jiān)聽(tīng)，當(dāng)捕捉到該事件后，則會(huì)去更新組件的屬性并顯示。如果想讓變量、類、方法的值與組件的值進(jìn)行綁定，請(qǐng)?jiān)谶@些對(duì)象上加上Bindable標(biāo)記Flex核心機(jī)制開(kāi)發(fā)過(guò)程中需要注意

12、的問(wèn)題需要注意的地方：需要注意的地方：1、在開(kāi)發(fā)Flex Web項(xiàng)目時(shí)，項(xiàng)目生成的swf文件大小不要超過(guò)3M，不然用戶體現(xiàn)會(huì)很糟糕，但如果項(xiàng)目運(yùn)行在局域網(wǎng)內(nèi)可忽略這一點(diǎn)，項(xiàng)目用到的圖片資源可壓縮成swf來(lái)使用，這樣就可減小主程序生成的swf的大小。2、對(duì)于像論壇、博客類型的項(xiàng)目不適合用Flex開(kāi)發(fā)，因?yàn)樵谒阉鞣矫鏁?huì)受到限制。3、由于Flex內(nèi)存回收機(jī)制還不是特別好，所以在對(duì)象的使用上要注意及時(shí)銷毀，手工派發(fā)的事件用完及時(shí)刪除。FLEX內(nèi)存釋放優(yōu)化原則及具體做法：內(nèi)存釋放優(yōu)化原則及具體做法：1. 被刪除對(duì)象在外部的所有引用一定要被刪除干凈才能被系統(tǒng)當(dāng)成垃圾回收處理掉；2. 父對(duì)象內(nèi)部的子對(duì)象被外

13、部其他對(duì)象引用了，會(huì)導(dǎo)致此子對(duì)象不會(huì)被刪除，子對(duì)象不會(huì)被刪除又會(huì)導(dǎo)致了父對(duì)象不會(huì)被刪除；3. 如果一個(gè)對(duì)象中引用了外部對(duì)象，當(dāng)自己被刪除或者不需要使用此引用對(duì)象時(shí)，一定要記得把此對(duì)象的引用設(shè)置為null;4. 本對(duì)象刪除不了的原因不一定是自己被引用了，也有可能是自己的孩子被外部引用了，孩子刪不掉導(dǎo)致父親也刪不掉；5. 除了引用需要?jiǎng)h除外，系統(tǒng)組件或者全局工具、管理類如果提供了卸載方法的就一定要調(diào)用刪除內(nèi)部對(duì)象，否則有可能會(huì)造成內(nèi)存泄露和性能損失；開(kāi)發(fā)過(guò)程中需要注意的問(wèn)題6. 父對(duì)象立刻被刪除了不代表子對(duì)象就會(huì)被刪除或立刻被刪除，可能會(huì)在后期被系統(tǒng)自動(dòng)刪除或第二次移除操作時(shí)被刪除；7. 如果父對(duì)

14、象remove了子對(duì)象后沒(méi)有清除對(duì)子對(duì)象的引用，子對(duì)象一樣是不能被刪除的，父對(duì)象也不能被刪除；8. 注冊(cè)的事件如果沒(méi)有被移除不影響自定義的強(qiáng)行回收機(jī)制，但有可能會(huì)影響正常的回收機(jī)制，所以最好是做到注冊(cè)的事件監(jiān)聽(tīng)器都要記得移除干凈。9. 父對(duì)象被刪除了不代表其余子對(duì)象都刪除了，找到一種狀態(tài)的泄露代碼不等于其他狀態(tài)就沒(méi)有泄露了，要各模塊各狀態(tài)逐個(gè)進(jìn)行測(cè)試分析，直到測(cè)試任何狀態(tài)下都能刪除整個(gè)對(duì)象為止。內(nèi)存泄露解決方法：內(nèi)存泄露解決方法：1. 在組件的REMOVED_FROM_STAGE事件回掉中做垃圾處理操作（移除所有對(duì)外引用（不管是VO還是組件的都需要?jiǎng)h除），刪除監(jiān)聽(tīng)器，調(diào)用系統(tǒng)類的清除方法）先remove再置null, 確保被remove或者removeAll后