Erin's Blog

【2010 年10 月8 日，台北訊】全球軟體大廠奧多比今日宣布，第二屆 Adobe 亞太地區校園創意大賽（Adobe Asia Pacific School Innovation Award）正式展開徵件報名。該項競賽於2009年首度舉辦即引發高度關注，在亞太區域共吸引550位學生選手參加，而今年度的校園創意大賽，同樣歡迎台灣、中國、香港、印度、印尼、馬來西亞、紐西蘭、菲律賓、新加坡、南韓、澳洲及泰國等地，年齡為14至19歲之間的學生踴躍報名。 Adobe 亞太地區校園創意大賽的舉辦目的，是希望能提供給亞太地區的未來創意之星一個展示才華及數位創作技巧的舞台，並且將該地區新世代創意新星的優異理念及作品，展示引薦給全球觀眾。 「在去年的競賽中，我們看到亞太地區參賽學生們所呈現的無與倫比創意才華，已為2010年 Adobe 亞太地區校園創意大賽設立了更高的競爭標準。」奧多比亞太區資深行銷總監Mark Phibbs表示：「創意產業是亞太地區的重要經濟推手，因此各國政府都極為重視教育啟發工作，鼓勵年輕學子積極展現數位媒體開發技巧。在2010年，我們更加期待亞太地區年輕世代能持續發揮設計創意，為我們帶來更多非凡優異作品，充分展現未來創意領袖的堅強實力。」 Mark Phibbs進一步說明：「在去年度550位總參賽人數中，台灣地區報名者即高佔六成，如此高的參賽率，顯示政府近年來大力推動國家創意產業發展已帶來極為正面的影響及卓越成效，同時台灣學生作品近來亦在多項重要國際設計競賽屢創佳績，顯見這股不容小覷的設計新勢力正在世界的創意舞台上綻放光芒。去年代表台灣參賽的選手中有兩名獲得決賽入圍的優異成績，我們很期待今年能吸引更多優秀的台灣學子共襄盛舉、再創佳績！」 今年度的各項公開競賽主題，將讓學生們得以盡情揮灑創意，並以各種創新方式呈現提交理念及作品。學生可以組隊或個人方式參賽，主要競賽項目分為以下三大類別： l 圖像與印刷設計 — 參賽作品範圍包括：繪圖、明信片、標誌、商標、包裝、攝影、年鑑、廣告、雜誌、海報、手冊、書籍及新聞等。 l 網頁設計與開發 — 參賽作品範圍包括：網頁、部落格、互動CD/DVD、動畫、學習教材及行動裝置內容設計。 l 影片及影像 — 參賽作品範圍包括：實景真人影片、紀錄片、短片、動態圖像、動畫及公共服務宣導影片等。 各類別競賽得主

最近很不怕死的支援了一個 ERP project（常做半路接手或支援的工作），原始的開發團隊使用的是 Flex 4 SDK , Cairngorm2 框架，雖然上一次發表 Cairngorm2 的文章是兩年前，不過還是很快的進入狀況。 以下是真實開發後使用 Cairngorm2 的個人感想： 先談缺點...（果然迫不及待啊...） Singleton ModelLocator 的設計果然是一個敗筆： 不使用 DI（依賴注入）的話，每次新增一個 Model 都是一種折磨，尤其是團隊開發，新增、修改 = 在 ModelLocator 引入或修改。每個 View 都可以操作所有在 ModelLocator 的 public data，Model 內有大量的 bindable IListCollection，因為不這樣做 list 無法同步。若沒有完整列出清單的話，可能有不同 Model 分別持有相同的 list data query。 更麻煩的是，如果是非同步 update 的 data ，Model 就必須持有兩份相同的 data instance 供比對操作... Bindable 是個兩面刀： 有它會讓你上天堂，也很有可能更快讓你下地獄...為了達到資料同步，必須大量的綁定 View 所使用的 deta，Model 無法主動通知做了啥事（除非是建一個公開綁定的屬性跟 Views 綁在一起，又或者透過 CairngormEvent 回 call viewHelper ，但是前提是這個 Event 必須註冊到對應 command 又是一堆 C & E） 不然就是得使用 BindingUtils 做 watcher，但是重點就是 Model 必須公開綁定所有待操作的資料！總之如果一開始沒有規劃好的話，團隊開發就是一團亂...addCommand() 都 add 不完。 一點小事情就需要一個 command，與對應的 Event： 在團隊開發中，如果核心 command 沒有開立完整的話，有時候 view 相關的 command 所操作部份都太過 detail ，會造成差不多的東西可能都要搞好幾份...當然這個情況已經在手上的專案看到了... Delegate 與 Command 也多多： Delegate 明明是用來組織分類對外連線部分，並且做 data pa

由於上次稍微玩了一下 Robotlegs 依賴注入（DI） 主導的 MVC 框架，而著名也使用依賴注入的 Java / Java EE 的 Spring framework 出了 for ActionScript 的版本，剛好在最近 Spring ActionScript 1.0 正式 release 了（想了解 Spring 是啥咪東東的話請自行找 google 大神），這個版本除了基本框架外，也包含了 Cairngorm 與 PureMVC 的外掛...想當然耳，就拿來測試一下用在 PureMVC 內的感覺囉!! 參考了 官方範例 中 PureMVC 唯二的範例原始檔，以下使用的是「設定檔依賴注入 facade 透過 addConfigSource() 的方式來 init 」：(其實除了 embed 外，都是外部載入) Online Demo with source code 工作環境：FlashBuilder, Flex SDK4 請下載 PureMVC Standard 版本 再下載 Spring ActionScript 最新版本後，除了 spring-actionscript-cairngorm 不需要外，都放到 /src 下（記得只需要 org 開始...)，也別忘了lib 內的 swc 檔 copy 到 /libs 下 Spring 的 injection 並不像 Robotlegs 直接來個 [Inject] metadata 的自動化那樣方便，但是其冷血度（檔案的鬆偶程度）更勝後者！如果你要使用設定檔（applicationContext.xml) 來做注入的話，準備工作就挺多的...XD 依照 applicationContext.xml 內設定的方式分別寫入 constructor 或者是 setter 依賴注入（本範例統一使用 setter injection) 為了跟大家都沒關係所以都使用 interface 來處理，所以你會在範例中發現大家都有介面...(並沒有真的研究過 Spring，也許還有其他作法) 準備 compiler 時候要用的 classe。由於在 setter, getter 的寫法上都使用 interface，所以真正用到的 class 需要預先在輸出階段就打包到程式內。 基本上 PureMVC 類 class

這次的範例是兩組 viewComponent 共用同一個 Mediator 外加不同的 instance： Source code download 要共用的重點就是介面(Interface)，所以你會發現這次的兩組 viewComponent 都有實作 IMessageBox IMessageBox: public interface IMessageBox { function update( newline:String ):void; } 然後在兩組的 viewComponent 中實作 IMessageBox <s:Group .... implements="IMessageBox" > <fx:script> ..... public function update( newline:String ):void{ //IMessageBox interface 實作 data.addItem( newline ); } ..... </fx:Script> 接下來修改的部份為 MessageBoxMediator .... [Inject] public var view:IMessageBox; //同樣注入屬性...這次記得改成 interface. 因為此 Mediator 為共用 .... 接下來在 RobotLegContext startup() 中修改： .... override public function startup():void { //bootstrap here //auto start, injectViewAs 寫入 viewComponent interface mediatorMap.mapView( MessageBox, MessageBoxMediator , IMessageBox ); mediatorMap.mapView( MessageBox1, MessageBoxMediator , IMessageBox ); } .... 你會發現 mapView 的 injectViewAs:Class 填入 interface class, 這時候 Robotlegs 的核心在比對 class 的時候才會以 IMessageBox 為

由於今天在 奶綠茶的 Robotlegs FlashAS3 MVC framework 看到他讚賞 Robotlegs AS3 MVC framework 的好用，不禁好奇的來研究一番... 其實這個 AS3 MVC framework 出現有些時日，但是一直都沒有特別的關注它。簡單看完 Robotlegs 最佳實踐 ，其實就可以大部分的了解 Robotlegs 運作的邏輯。不如其他的 MVC framework 有很多語言版本， Robotlegs 完全是專注在 AS3 上。也由於僅有一個版本，所以訊息傳遞是利用 AS3 Event 機制來完成，對於一些想要入門實作 MVC 的 Flash 工程師來說絕對是比 pureMVC 好入門很多...=) Robotlegs 的重點就是搭著「 依賴注入（ Dependency Injection） 」達成 MVCS 的架構,  擷取用最佳實踐的中文翻譯解釋： Quote: 最簡單地, 依賴注入是為對象提供實例變量或屬性的行為. 當你傳遞一個變量到一個類的構造函數, 你在使用依賴注入. 當你設置一個類的屬性, 你在使用依賴注入. 如果你不是使用嚴格的過程或線性方式編寫AS3, 很可能你現在就在使用依賴注入。 呃...依賴注入? ？簡單來講一台霜淇林機，你要賣什麼口味的霜淇林就是依賴不同的原料放置到左右兩個攪拌桶內，而每一個口味可以透過介面實作來達成依賴注入。 以下是簡單的 Dependency Injection 的 Setter injection 範例： public interface 霜淇淋介面 { function 擠():void; } 然後實作： public class 巧克力 implements 霜淇淋介面{ public function 擠():void{ trace("巧克力口味的霜淇淋"); } } public class 草莓 implements 霜淇淋介面{ public function 擠():void{ trace("草莓口味的霜淇淋"); } } public class 香草 implements 霜淇淋介面{ public function 擠():void{

其實這個 app 早在三月的時候就已經寫好了，只是剛好本人的廢人病發作就一直拖到今天才送審上架...XD 先前的 Star Joker 版本是用 Flash CS5 寫的，而這個版本是使用 Corona SDK 開發。 玩法跟 Star Joker 一樣，只是多加了一個 Bounce Stage。 一開始先選擇你的 Bet 數目，然後點選 Deal & Draw。 發牌後，選擇你要保留的牌，然後再次點選 Deal & Draw 會將沒保留的牌重新換一次， 如果有贏牌的話，可以選擇 Collect 將錢收下來又或者是進入到 Bounce stage 去翻倍。

下午剛好有位朋友問了我一個問題..「 PureMVC Utility AsyncCommand 有沒有辦法等待 proxy 做反應？」，因為先前沒研究過此 Command 所以稍微花了些時間看一下它的運作邏輯。雖然最後討論的結果是設好 proxy call back 應該是可以等待 proxy 做完工作再執行下一個 subCommand，但是嚴格說起來，真正實作專案後發現，比較需要的是非同步 Notification 的處理。 由於 proxy 一些動作通常都是 onResult 後直接送出 Notification，光一個畫面可能會有好幾支 proxy 需要有順序性的完成資料讀取後，才可以將最終的 data 送到畫面內。這時候順序動作的 Command 就很浪費空間，因為可能一次要處理五六個 proxy 的 call back，這樣等於要等待幾個就需要寫幾支 Command.... 為了解決這種非同步順序型的處理現有的 Notifications，就花了點時間弄了一支 AsyncNotifier 來用用囉~~ Project Name: pureMVC Utility - AsyncNotifier Version: 1.0.0 Project Owner: Erin Lin Description: An utility is under pureMVC for AS3. Download: Standard & MultiCore versions pureMVC website: http://puremvc.org/ 先製作 AsyncHandleCommand 重點就是將你要處理的 Notifications 一次列在同一張 Command 的 execute 內（不需要事前註冊喔）： public class AsyncHandleCommand extends SimpleCommand implements ICommand { override public function execute(notification:INotification):void switch( notification.getName() ){ case FirstNotificationName: // break; case S

認識 Erin 的人都知道， Erin 最懶得寫作品集相關的文章，但是這個案子比較有趣，所以特別提出來聊一下囉！ 廚櫃業某公司內部軟體，目前系統尚在 Beta 階段，所以下面圖片皆有模糊化處理。 [可擴充功能面板首頁，後台皆包含在管理系統內（有 iPhone 的 fu）] 這個案子是幫一家傳統公司做的專用軟體線上化，想要開發企業級 RIA 想當然爾就是使用 Flex 來處理囉！ 整個案子前端是以 Flex SDK 3.4 + Flex Builder3, PureMVC MultiCore for AS3 , Utility - AS3 StateMachine 以及先前 Erin 所發表的 WidgetsConsole 來處理整個系統的轉換。 整個系統包含前後台共七大系統，分別是：估價，客戶，店面管理，貨品上架，會員管理，分店系統以及權限系統。超級管理員可以利用權限系統分別開出不同職級的權限，然後使用者透過同一入口，依照權限區分，畫面會顯示不同的功能。整個系統最複雜的部份當然是估價系統，由於櫥櫃的建立是透過選擇資料即時演算出來，更何況櫥櫃類的 BOM 表階層是怪物般的可怕...所以在 DB 的建置與前端資料整合的部分著實費了我們一番苦心。 [櫥櫃 BOM 表編輯視窗及櫥櫃 BOM 單物件材質指定] 此外，在 UI 設計上也特別花了一些心思。本案子 Target User 是管理者、店長與公司旗下的業務群，此公司成員年齡約 30-60 歲，皆為一般電腦使用者，所以 UI 設計及操作 Flow 必須比一般線上 RIA 更加友善，才能幫助縮減公司的人事教育花費。如放大整個系統的標準字 size；新增資料時不能碰的快速鍵會鎖定；產品類縮圖雙點擊即可觀看放大圖；操作 flow 皆以左上至右下結束以及利用畫面引導使用者操作都是一些設計上的巧思。 [新增估價單] [簡單易用的業務員用客戶系統] 此外這個專案在實作 PureMVC 過程當然是相當的快樂，因為它的彈性與權職切分實在太令人滿意了！不管是擴充性，Rich Data 管理又或者除錯都非常的容易。當然本人早就已經是 PureMVC 的忠實粉絲了...=P 快來加入 Flex + PureMVC 的行列吧~~ 結果這篇到最後變成 PureMVC 的勸進文...XD

目前看起來，由 action script 轉到 Object-C 的難度遠遠超過 Corona SDK for iPhone 用的 Lua ， 想當然爾選擇 Corona SDK 來寫 iPhone app 對 ASer 來說是第一首選。趁著難得的空檔，花了些時間研究一下，沒想到一開始就被它的座標系搞到眼花...只要 landscape 外加 rotation 的時候整個座標系就會很難控制...（因為跟它不熟啦...XD ) 為了堅持在 Corona 中使用 Flash 的座標系（左上到右下)，當 landscape 時修改當場景的 group 屬性就可以擔保裡面所有物件都不需要再移動... main.lua : -- -- landscape 使用熟悉的 Flash 座標系 in corona -- local bg = display.newRect( 0, 0, 320, 480 ) bg:setFillColor(100,120,120) local rect = display.newRect( 0, 0, 50, 50 ) rect:setFillColor(255,255,255) --直接指定 rect 在場景中的 x, y rect.x = 100 rect.y = 100 --利用 group 實現場景 local group = display.newGroup() group.rotation = 90 group.yReference = 160 group.xReference = 160 --將 rect 加到場景中 group:insert( rect ) local function onOrientationChange( event ) local tp = event.type if (tp == "landscapeLeft") then group.rotation = 90 group.yReference = 160 group.xReference = 160 elseif ( tp == "landscapeRight" ) then group.rotation = -90 group.yReference = 240 group.xR

Star Joker is a game of Video Poker. Joker is a wild card that can become any card in a poker hand. 又是一個 Erin 最愛拿來改版的賭場遊戲...因為簡單到不行的遊戲就不錄操作影片了...寫了很多版本有 Flash Lite1.1, Flash List 2.1 所以 iPhone 的版本也要來一次!!! 等待上架中...XD 如果沒啥變數，2月初應該可以看到了... 聽說 Apple 對 Free or Lite 版本的軟體審核很嚴格，所以乾脆將免費版本與正式版本分兩個獨立軟體來設計比較安全...正式版當然還沒寫完啊...XD *** Star Joker in App Store *** ~ Free App