Open Source AS3 VideoPlayer

apdev-videoplayer 是一個Open Source 的AS3 VideoPlayer, 可以讓你改變外觀顏色及控制的物件.

官網: http://code.google.com/p/apdev-videoplayer/
介紹: http://apdevblog.com/new-version-of-our-as3-open-source-videoplayer/
API Doc: http://apdevblog.com/examples/apdev_videoplayer/docs/

追蹤物件內容的變更

Know Your Flex Proxy
這篇Bolg 文章介紹利用 mx.util.ObjectProxy 來追蹤物件內容的變更, 其中的影片裡有示範, 可惜沒提供程式碼, 要耐心看影片, 我覺得這是個很實用的技巧, 滿有趣的.

Flex Report

Printing with Flex
這篇Blog 文章介紹了有關Flex Report 的解決方案及相關Framework, 有興趣的朋友可以研究看看.

網路備份空間mirko 和 G.ho.st

最近在尋找網路備份空間, 預防哪天電腦硬碟掛了, 資料還可以有地方保存, 而且只要能連上網, 隨時可以取得這些資料. 一開始是試用SeedNet 出的miroko , 當安裝完他的Client端程式, 開始使用時就有點傻眼, 怎麼會這樣, Client是用IE??? 那安裝的程式是做什麼用的, 原來安裝的程式是為了能夠讀取本機電腦的檔案, 用來備份到網路空間, 他的架構Browser(Ajax,dwr), Client同步程式用java, Server應該也是用java Server, 試用了一會, 感覺很不順暢, 於是就把他移掉了.

後來在Mobile01看到有人在討論G.ho.st , 於是就來試用看看, 他的UI介面用Browser(Flash), Client同步程式也是用java, 用了一會, 他的桌面做的真是不錯, 很炫, 有些程式和Server 溝通時會顯示失敗, 看起來是Server 程式的問題, 接下來是重頭戲, 他的同步備份功能, 一開始試了有中文的目錄及檔案, 測試結果失敗, 再試了只有英文的目錄及檔案, 這是沒問題的, 沒支援中文, 看來我還是沒法拿來使用, 不過他的設計還滿好玩的, 而且我最近在學習Flex, 對這項產品還滿有好感, 暫時再看看他未來會不會改善這個缺點.

一篇簡介Flex 4 Skin的文章

Skinning Flex 4 slides, Uber-Basic Example Button Skin
這篇Blog 文章用投影片的方式, 簡單的介紹了Flex 4 Skin, 對Flex 4 Skin 還沒深入了解的朋友, 可以點進去看看.

利用Google Analytics 分析追蹤Flash 程式

Google Analytics 提供了一篇說明文件, 介紹如何讓Google Analytics 分析你追蹤的Flash 程式.

Google 是這麼介紹的:
Google Analytics (分析) 是企業級的網頁分析解決方案，此工具不但可讓您進一步瞭解網站流量和行銷成效，現在還提供了具有彈性又容易使用的強大功能，讓您透過全新的方式查看並分析 流量資料。有了 Google Analytics (分析)，您就更能夠撰寫目標明確的廣告，強化行銷計劃並提高網站的轉換率。

很不錯吧, 那就趕快來看看要怎麼做才能讓Google Analytics 追蹤分析Flash
Google Analytics Tracking for Adobe Flash

介紹Actionscript Framework 的文章

15 Awesome ActionScript 3 Frameworks To Inspire Your Next Project
這篇Blog文章整理了15個Actionscript Framework, 有些還滿不錯的, 各位可以參考看看.

我的第一個Flex作品 - Showcase

終於把我的第一個Flex作品發表出來, 這是一個圖片(產品)展示的程式, 分為前端和後端二個獨立的程式.

主要使用的技術為 Flex, BlazeDS, Spring BlazeDS, iBATIS, 資料庫使用Mysql.

Complier Flex 和 Java 程式均使用Ant.

開發用的Server 使用Tomcat 6.x. 採用標準的Java EE war檔架構.

Production Server 採用Stax 作為我的執行Java webapp程式的空間, Stax 跟 Google App Engine 很類似, 都提供執行Java程式的環境, 唯一不同的是Stax 有提供Mysql, Google App Engine 使用特殊的檔案空間來存放資料, 那還要重新學習太麻煩了, 還是用實體的資料庫及寫SQL比較方便.

圖片是使用外部連結的方式, 在外部的Server裡有放crossdomain.xml, 不然圖片的效果會無法出來, 在debug 模式下也會出現錯誤訊息.

前端展示

因為怕資料被改掉, 無法展示後端程式, 只能貼圖給大家參考
登入後端管理


圖片分類設定

圖片設定

如何印出物件的內容

Flex Quick Tip: Printing an Objects’ contents
這篇Blog文章介紹如何印出ActionScript物件的內容, 對程式debug很有幫助, 提供給大家參考.

Spring BlazeDS Integration 1.0.0 正式版發佈

Spring BlazeDS Integration 1.0.0 正式版發佈, Spring 更新的速度還真快, 不到1個月就從RC2就轉為1.0正式版. 等我測試過再來跟大家報告有什麼異動, 不過他的說明文件好像變多了.

Flash vs. Silverlight

基本上Flash 和 Flex 是相同的東西, 只是設計的方式不同,
Flash vs. Silverlight: What Suits Your Needs Best? 這篇文章可提供想要比較Flex 和 Silverlight 的人作一個參考.

Flex 3 和 Flex 4 新舊元件的差異

Adobe 有一篇Differences between Flex 3 SDK and Flex 4 SDK beta 介紹了Flex 3 和 4 新舊元件的對照, 和stats 語法的改變, 很值得參考.

介紹Google App Engine 和Flex 整合的文章

Cloud to RIA: Accessing Google App Engine (Java) Data Through Flex AMF - Part I

Cloud to RIA: Accessing Google App Engine (Java) Data Through Flex AMF - Part II

Cloud to RIA: Accessing Google App Engine (Java) Data Through Flex AMF - Part III

Google App Engine 提供了免費放程式的空間, 能夠跟Flex結合, 很值得來研究看看.

Flex 4 SDK Beta 發佈

Adobe 發佈Flex4 SDK Beta , Flex Builder 也改名叫Flash Builder.

下面是有關Flex 4的新功能的介紹:
Overview of Flex 4 (Gumbo)
Top 10 Changes in Flex 4

Flex 4 Beta 公佈後, 一堆的相關Blog介紹文章也相繼出爐, 其中有一篇Network Monitor in Flash Builder 4, 介紹監控程式的網路封包, 這個Flash Builder4的新功能讓人覺得很有趣, 等換上新版的Builder後可以試看看.

另一篇介紹Flash Builder 4 和BlazeDS整合的文章
Building Flex application for BlazeDS Remoting destinations using Flash Builder 4

很Cool 的Flex 4 Layouts

下面這個網址介紹了Flex 4 Layouts 技術, 很Cool 可以把平面轉成3D 的形式, 程式demo在影片的後半段, 要耐心看完前面的介紹.

http://blog.digitalbackcountry.com/2009/05/flex-4-layouts-on-tech-talk-with-ryan-stewart/

Spring BlazeDS Integration 1.0.0.RC2 發佈

才沒隔幾天Spring又公佈了 Spring BlazeDS Integration 1.0.0.RC2
主要是修正了一些bug, 還好不用再去改xml, 當初怎麼設定的都有些不太記得了.

BlazeDS 如何取出Session

下方程式碼為BlazeDS 取出(建立)Session 的方式, BlazeDS 的 Session 和HttpSession 得到的Session ID是一樣的, 所以各位可以放心使用, 不用擔心.


import flex.messaging.FlexContext;
import flex.messaging.FlexSession;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;

................................................

FlexSession flexSession = FlexContext.getFlexSession();
HttpServletRequest requst = FlexContext.getHttpRequest();
HttpSession session = requst.getSession();

logger.info(flexSession.getId());
logger.info(session.getId());


Spring BlazeDS Integration 1.0.0.RC1 發佈

Sping 公布Spring BlazeDS Integration 1.0.0.RC1, 前一版是1.0.0.M2

主要變動是 在路徑 WEB-INF\config 下的 web-application-config.xml 檔,
remote-service tag 改命名為 remoting-destination

我在開啟Tomcat 時Spring 發生class not fund的錯誤, 所以這次的1.0.0.RC1 最少還需要com.springsource.net.sf.cglib-2.1.3.jar 和 com.springsource.org.codehaus.jackson-0.9.9.4.jar
如果你是download spring-flex-1.0.0.RC1-with-dependencies.zip
這2個jar 檔可以在 spring-flex-1.0.0.RC1\projects\ivy-cache\repository 下找到

如何取得TileList 裡資料來源的排序

最近遇到一個困擾, 想要在Tile裡的圖片做Drag 的動作, 並且把Drag 後的圖片位置取出來, 找了網路上的資料後發現好像只有TileList 能夠做Drag, 那又發現另一個問題, 找遍TileList 的API, 就是看不出來有哪個function能夠取出每個物件的index位置, 後來經過google 的搜尋, 終於找到我想要的答案, 答案在這裡, 參考裡面的getChildIndexInParent Function.

我的 TileList Sameple

admin.page.ProductImageItemRenderer 內容

重頭戲, 用 var cursor:IViewCursor = ICollectionView(imageTile.dataProvider).createCursor(); 取得TileList 裡dataProvider 的物件集合, 這已經是排序過的集合, 只要利用迴圈做index++ 取得編號即可.

Flex 利用 BlazeDS 上傳檔案

Flex 利用 BlazeDS 上傳檔案的程式範例

Client Side Flex 的程式範例



Server Side 負責接收的Java method

BlazeDS 結合Spring 的設定方法

資料參考來源 Spring BlazeDS Integration

BlazeDS Framework 本身就是讓單純的Java Bean 程式來給Flex 做遠端呼叫, 即然是Jave Bean, 那想說是不是可以利用Spring 的IoC 和AOP 等概念來做複雜的應用, 而不會讓原本寫的Java Bean 寫的更複雜, 例如在每次呼叫method 前做權限檢查, 以防止有心人士的違法呼叫, 這就可以使用Spring AOP來做到. 下面就列出BlazeDS 結合 Spring 的設定方法.

1. 準備好Spring 的相關api, 下載 Spring BlazeDS Integration API
2. 修改web.xml, 參考下圖, mark 掉的是原本BlazeDS 的寫法, 改成Spring 的Servlet


3. 設定Spring config 檔web-application-config.xml, 放在WEB-INF\config下, 提供遠端呼叫的Bean 和介面就設在這裡, 內容參考下圖.



4. remoting-config.xml 裡的Java Bean設定就由web-application-config.xml 取代. 下圖為remoting-config.xml 的內容.


5. BlazeDS 的4個xml 設定檔(services-config.xml, remoting-config.xml, proxy-config.xml, messaging-config.xml) 需放在WEB-INF\flex下.

這樣就完成了BlazeDS 結合 Spring 的設定, 如需例外的設定, 請參考Spring BlazeDS Integration


本文配合 Spring BlazeDS Integration 1.0.0.RC1 的發佈, 已修改為新的tag語法. 2009.05.17

Box, VBox, HBox 設定使用 Corner Radius

Box, VBox, HBox 設定使用 Corner Radius,
加上下列參數: cornerRadius="8" borderStyle="solid" borderThickness="0"
即可達成, 看起來簡單, 我可是用Google找了很久才找到的,
真囧.