Erin's Blog

雖然在 Swift 中看起來"很像"是不需要煩惱內存管理的問題，不過實際上它還是遵循著自動引用計數 (ARC) 的規則，當一個物件沒有被其他對象引用時會自動被銷毀，如果三魂七魄沒有完全回位的話，就會有個靈體留在現世的空間裡，最經典的範例如下： 閉包(Closure)引用 classClassA { typealias Complete = ()->() var name : String var onComplete : Complete? init(_ name: String){ self.name = name print("Hello I am \(self.name)") onComplete = { print("\(self.name): onComplete!") // --> 閉包引用 self, 計數 + 1 } } deinit { print("deinit: \(self.name)") } } var a : ClassA? = ClassA("A") // --> 引用計數 + 1 a = nil // 2-1 = 1 還剩下 1 所以沒辦法銷毀 ---output------- Hello I am A 由於這邊的 onComplete 宣告為 Optional, 正確的做法要連同 onComplete 一起刪除才可以被回收，若不是 Optional 則會進入無法回收狀態： var b : ClassA? = ClassA("B") b?.onComplete = nil // --> 還好是 Optional 可以設成 nil 計數 - 1 b = nil // 計數 = 0 所以被回收 ---output------- Hello I am B deinit: B 但是做人不需要煩惱太多，這時候就出動 unowned 關鍵字讓物件可以順利被回收： onComplete = { [unowned self] in print...

學習 Swift 語言覺得最有趣就是變數後面的問號與驚嘆號。看著程式碼帶著一堆 ??!! 相信初學的朋友應該都挺傻眼的。其實會出現 ? 與 ! 是因為 Swift runtime 的特性：不容許變數有 nil 的存在而產生的，這時候就需要先來學習什麼是變數為 Optional(可選性)。 以下是一般情況，預先宣告了一個沒有賦值的變數，然後不小心先使用它，這種情況下就會出現 runtime error： var string: String print(string) ---output--------- variable 'string' used before being initialized 加上?宣告成 Optional 就安全過關： var string: String? //-> 設定為 Optional 所以 runtime safe print(string) ---output--------- nil 重點一：變數會有 nil 情況發生就是加上 ? class ClassA { var b: ClassB? // 不確定b 會不會存在，加上? 就不需要在 init 初始化 } class ClassB { var count = 1 var string = "Hahaha" var x = 12.0 var y = 20.5 } 因為使用了問號 b 還是 Optional，所以沒有 runtime error。 let a = ClassA() print( "\(a.b?.count)" ) ---output--------- nil 而與 ? 相對的就是 ! , 一個包裝，一個拆包。驚嘆號最大的作用就是將「虛轉成實」，所以當使用!打開 Optional 變數時，如果該變數還是 nil 的話，就會出現 runtime error。 let a = ClassA() print( "\(a.b!.count)" ) //使用 ! 強制將 Optional 的 b 打開，結果因為 b 是 nil 所以有 runtime error ---output--...

幾個月前改用 Unity 開發遊戲，到目前的心得為：組件式開發真的是很便利，但是當組件數量多到一定程度時，結構上就有點可怕，常常在某 GameObject 上掛了組件後就忘了它的存在，雖然可以使用 Singleton design pattern 來製作主要的 Manager（本人對 Singleton 並不是很熱愛），程式還是會亂到一定程度，搜尋了一些 Unity with MVC 討論，一部分的人都對實作 MVC 不是很熱絡，也許是 Unity 特有的開發環境導致。 以前開發 Adobe Flex 專案最愛用的 MVC Framework 就是 PureMVC，即使後來有更方便的 MVC Framework 的也擋不住我對它的熱愛。Unity 是沒有所謂的全域 Root Scene，所有場景都是獨立，想要將 AS3 實作邏輯套用在 Unity 上將控制項都在 PureMVC 架構中實作是有點矯情多餘。如何保持 Unity 組件開發模式，導入 PureMVC 鬆綁主要邏輯，就是這次實驗的重點。 不清楚 PureMVC 的朋友們可以到這邊參觀一下： PureMVC 我也會 PureMVC C# Standard Framework on GitHub ViewComponent 與 Mediator 整合是首要工作： 由於 Unity 沒有全域 Root Scene，如果將 new Mediator( viewComponent ) 寫在 PureMVC 架構下，即使透過 GameObject.Find 找那個對應的 GameObject 就轉了九彎十八拐，寫起來一點都不愉快，尤其考慮到場景的轉換，兩個場景中相關 Mediator 的註冊與移除處理，何況對 Unity 組件來說，能不能被打包動態載入是件重要的事。綜合以上問題點，反向思考，改由 GameObject 掛載中介組件，在 OnEnable 與 OnDisable 通知 Facade 去註冊與移除其 Mediator，一來簡化為了實作 Meditaor 掛載 ViewComponent 而對 static class GameObject 的依賴，二來也不會對 Unity 組件開發模式有太大的影響。

CoronaSDK 中取得 Android 與 iOS 語系方法並不相同，繁體與簡體取得名稱也不一樣，為了簡化兩系統的繁體與簡體語系支持，所以特別打包了一支函式來控制多國語設定，之前一直忘了分享出來也剛好很久沒更新 Blog 了...＝D 使用方法很簡單： 將語系字串放在 locale/ 並以 strings.i18n(預設）與 strings_[ISO_639-1].i18n 繁體共用命名：zh_hant 簡體共用命名：zh_hans 語系字串資料採用 JSON 格式： locale/strings.i18n { "hello" : "Hello", "welcome" : "Welcome" } locale/strings_zh_hant.i18n { "welcome" : "歡迎" } 執行：Global function L( str: String ) -> String Usage: local i18n = require( "i18n" ) -- set device language -> locale/strings_[device setting].i18n i18n.setLocale() -- 假使目前語系為 i18n.language = "zh_hant" print( L("hello"), L("welcome"), L("no data")) -- Hello 歡迎 no data -- 動態更改支援語系到預設值 i18n.setLocale("") print( L("hello"), L("welcome"), L("no data")) -- Hello Welcome no data 備註：僅測試於 Android 與 iOS 系統，如其他裝置需要做修正的話，請自行 DIY。

因為工作需求，準備開始學習 C#，這兩天研究一些公開的 Unity 原始碼發現 C# 有個 Delegate Type 很有意思，它可以利用 + 與 - 將需要搭配執行的 function 指派到委任者然後一起執行。如： //C#, d1 and d2 are functions allMethodsDelegate += d1; allMethodsDelegate += d2; allMethodsDelegate(); // d1(), d2() allMethodsDelegate -= d2; allMethodsDelegate(); // d1() 參考資料： 使用委派 (C# 程式設計手冊) Edit: 03, 08, 2015, 感謝 fb@shanyungyang 的提醒可以使用 Lua 的 metamethod 實作，為了達到屬性能往下傳，本來是打算採用 * / 但是又怕太混亂，最後就是由另外一個 meta2 來達到效果囉! ^^

因為需要大量將圖片轉檔成較省空間的 rgba4444 格式，研究了一下 TexturePacker command line tool , 只能說，TexturePacker 真的太好用了啊！！！！ 轉檔邏輯為將指定檔案夾下所有的 .png 原圖命名加後綴 @2x 順便輸出 0.5 scale 的小圖，所以不需要兩種輸出的可以將最後兩段倍數輸出設定刪除。 --variant 1:@2x \ --variant 0.5:

為方便 Universal version 的製作，在畫面配置上，我都是採用對應螢幕四方界線方式做定位如 top, left, right, bottom, centerX, centerY，這樣在多螢幕顯示時，物件的位置才能一致，以下是定位函式分享，提供給有需要的朋友使用。

最近手上的案子是個麻煩的遊戲，對於遊戲開發來說狀態機(state machine)是很重要的流程控制器，認真研究了一下 Lua 才發現原來它有 Coroutine（協同程序）這個有趣的功能（AS 系列是沒有這種東西的，請原諒我的無知），有興趣搞懂 Coroutine 的朋友可以參考： electronic_blue 的使用 Coroutine 改寫狀態機 ，它恰恰是以 CoronaSDK 為範本作教學，簡單參考了它的範例程式，打包成了 statemachine.lua 供 CoronaSDK 開發使用。

之前有網友在 台灣可樂娜跨平台基地 - Corona SDK 上詢問 Corona SDK 中 table listener 與 function listener 差別。 其實 :addEventListener 時並沒有強制一定需要使用 table listener，因為它在執行 listener 函式時，對於 table 物件會使用 tableObj:listenerFunc ，而單純的 function 是正常執行 listenerFunc() ，差別是 function listener 不會因為「:」語法糖而將 table 本身帶入。 其實只要看下面範例就可以馬上清楚知道其中的差別：

參考出處： Mac — Adding Hex Color Picker to Color Picker Mac app store 上有很多 Color Picker app，差不多 98% 都是需要付費，而這個小工具恰恰是開發中不可缺少一個東西。其實 Mac OSX 中就有自帶一個 ColorPicker，秉持著 DIY 的精神，用幾個小步驟就可以組合出顯示 Hex 色碼的 ColorPicker.app。 Mac 系統需求：10.4 and up

今天是十三號星期五怎麼樣也要來貼一篇... 本專案原理參考自 dbankier/TiShadow 。目前版本功能僅提供瀏覽器鍵入程式片段傳送至包含 Ti.Meow Module 的 Titanium Mobile app 之 Android 或 iOS 手持裝置做即時預覽。操作影片拍攝不易，就請麻煩看一下照片想像一下吧...XD dbankier 的 TiShadow 相當完整，所以有興趣的朋友可以自行去參考。會製作這個專案僅僅為學習使用 Node.js ，在不採用其他 open source 的外掛模組下，也撇除因 Android 瀏覽器版本不支援 HTML5 WebSocket，就是以最簡單的連接方式做即時更新。

剛好 Titanium Mobile Forum 上有人詢問了有關 webview goBack的問題 問題是當 WebView 第一頁為 local web page or html 時點選網頁上的超連結到下個頁面，這時用 button click 去判定 WebView 的 canGoBack 來處理 WebView.goBack() or win.close() 如下： if(webview.canGoBack()){ webview.goBack(); } else{ win.close(); } 這時候會收到回傳 false 造成 win.close() 而無法利用 WebView.goBack() 回到原始的頁面...

昨天一時無聊研究起最近很紅的 CoffeeScript ，小試結果不禁有種相見很晚的 fu....Jeremy Ashkenas 你實在是太棒啦!!!!!

Titanium Mobile 真的是一個易學的跨平台 Mobile App SDK，不過由於 Javascript 的自由撰寫風格，外加一般使用者並不了解 Titanium Mobile SDK 倒底中介了什麼，往往開發到後期發現 App 在 runtime 時常出現 out of memory issue，用盡了各種方法「抓漏」也搞不懂為什麼 ？這個時候你就會開始沮喪，然後內心的 OS 狂叫著：「為什麼我不乖乖的學 Objective-C or Java!!!!!」 其實只要堅持幾種撰寫原則，就可以將記憶體漏失傷害降到最低。 以下是幾個簡單用來避免記憶體漏失的技巧：

Mediator ViewComponents 與 pureMVC 架構的中介 監聽並反應 View Component 發出的 Event 可以發送與接收 Notification 儘量少操作 Proxy 公開方法，多用 sendNotification... Mediator design pattern 要多認識這個 Mediator 設計模式的話，請自行看連結說明啊! 簡單來講，假使有一個 View 裡面有好幾個 MovieClip 組成，而這些 MovieClip 會互相影響對方...這個情況在 Flash 中，通常都會變成下圖： MovieClip 直接控制其他 MovieClip 搞到整個關係很複雜...換一個元件簡直是災難。 加入 Mediator 後，示意圖就會變成： 這樣，所有的 MovieClip 都透過 Mediator 來跟其他 MovieClip 溝通，當某一個 MovieClip 替換成別的元件，這時候也只需要修改 Mediator 中的引用即可，是不是變得很乾淨？如果同一組 MovieClip 有另外一個操作模式，也只需要替換掉 Mediator 即可！天下太平啊~~~ 而 PureMVC 中就是利用 Mediator class 為與前端 ViewComponent 的中介，這樣可以切開 ViewComponent 與 PureMVC framework 的關係，不管你前端介面使用 Flash or Flex 製作都跟程式核心無關。 所以 ViewComponent 製作時只需要兩個原則，一把所有的請求都以 Event 送出由 Mediator 處理，二提供公開方法， Mediator 只需要監聽 View 的 Event，將收到的資訊透過公開方法喂進 ViewComponent 即可。 如在 ViewComponent 中： public function setList( result:Object ):void{ list.dataProvider = result as ArrayCollection; } //然後在按下取得資料的按鈕 Click action 寫上： dispatchEvent( new Event( "GET_LIST" )); 新建 Mediator 的時候一樣有幾個重點方...

寫在前面...為日本地震海嘯受災戶祈福，為地球祈福...~_~ Proxy 收集資料，提供公開方法给外部使用 封裝資料區域邏輯（反正就是弄好資料才給別人） 只能發送 Notification 絕對不要引用到任何的 mediator，越自閉越好 Proxy 也是一個設計模式： Proxy design pattern ，有興趣的請看 wiki 連結，以最簡單的解釋 Proxy 就是資料的「代理人」要什麼資料就是透過這個代理人取得，請求資料的對象不需要知道代理人是如何得到資料。 隨便畫個示意圖，MVC 中為什麼要分開 Model 用意就是當 Model 更改服務的時候，也只需要修改 Model。上圖中，如果你原本的服務是 PHP 會通過 ProxyA 去與後端溝通，當後端更改成 .NET 的時候，前面都不需要變動，也只需要更改為 ProxyB，在上一篇中有特別建議將 Proxy 取用寫在 Command 也是為了因應這種情況產生，這樣你只需要修改 proxyCommand 相關引用就可以了。 使用 Proxy 的時候通常都會伴隨 ValueObject 來使用，VO 的用意是為了強制資料型態，免得在開發過程中過度使用 Object 來做傳遞結果無法檢查資料型別而出現的 bug。 ValueObject package com.mvc.models.vo { public class listVO { public function listVO(label:String, data:String){ this.label = label; this.data = data; } public var label:String; public var data:String; } } 當然你也可以使用 getter and setter 來定義屬性。 Value Object 好處是，使用 remoting 的時候可以直接與後端輸出物件型別綁定，前端收到後端吐出資料時，完全不需要做轉型，如： package com.mvc.models.vo { [RemoteClass(alias='com.serverside.vo.listVO')] public class listVO { --以下省...

Command 當然就是 Command Design Pattern 的實作 用註冊的方式 mapping Notification 一般來說 Command 的生命週期只有到它的 execute 方法執行後就掛了（揮手帕～） 環保！免洗！能用就儘量用！！ Command Design Pattern 顧名思義當然是「命令」設計模式了。這個模式非常好理解，為什麼叫命令？意思就是你老媽叫你去洗碗、掃地或做其他家事，不都是一個指令一個動作？如同一支電視遙控器，每按一個按鈕都有對應的命令，按了電源鈕 -> 開機，音量放大 -> 音量變大一點，選台 -> 跳台...動作做完就結束，所有命名都是有內容的，如果每一個命令都要乖乖的命名的話，光記內容不就累死了...所以你會發現繼承 Command 後，只需要 override execute():void 方法即可。 PureMVC 送你用的 Command 有兩種，SimpleCommand and MacroCommand。SimpleCommand 當然就是單次使用啦！想要一次執行一堆請愛用 MacroCommand，如果你還需要其他執行模式，可以自己手工建立，或看官網所提供的 Utilities。 StartupCommand： 官方範例中的 StartupCommand 使用 MacroCommand，就是為了分開 MVC 相關初始用 Commands package com.me.myapp.controller { import org.puremvc.as3.interfaces.*; import org.puremvc.as3.patterns.command.*; import com.me.myapp.controller.*; // A MacroCommand executed when the application starts. public class StartupCommand extends MacroCommand { // Initialize the MacroCommand by adding its subcommands. override protected function initializeMacroCommand() : voi...

Notification & Observer 簡單講就是 PureMVC 架構中的 Event 機制 背後就是所謂的「Observer Design Pattern」 Notification 為訊息物件 Facade and Proxy 只能發送 Command and Mediator 可以接收與發送 Observer Design Pattern 「觀察者」這個設計模式被提出來一定有它的過人之處，寫程式講求的就是「別人家的事情管他去死，什麼渾水都要淌的話，怎麼被蟲咬死都不知道」。觀察者做的事情就是有興趣接收的消息，就自己乖乖訂閱，出了啥大事，就是用將訊息發出去，有訂閱的人自然會收到，收到訊息要做什麼反應當然就是自己的事情，最後收膩了還可以取消訂閱。在 PureMVC 中可以發送的 class 都可以用內建的 sendNotification() 發送訊息： sendNotification( NotificationName:String , body:Object , type:String ); //body:Object 萬物皆物件啊，如果你還不知道能送什麼出去我也沒辦法了... 接收端會收到被打包成 notification:Notification 的物件，可以用其 getName(), getBody() and getType() 方法取得訊息的內容。 Command 中能接收到的訊息是通過 facade.registerCommand( NotificationName:String , command:Class ) 達到 mapping，而 Mediator 中要接收 Notification 要在其 listNotificationInterests 方法中列出有興趣 Notifications 清單。 Proxy 不能接收也有它的用意，Model 最大的功能就是提供資料，不需要理會外面的世界到底發生了什麼事情，如果能接收訊息的話，直接拿 Mediator 來用就好了，還需要使用 Proxy 嗎？ to be continued...

PureMVC Gestalt • Model and Proxy • View and Mediator • Controller and Commands • Facade and Core • Observers and Notification Facade 簡化一切，讓你只需要對一個窗口 Standard version 的 Facade 是個單例 Multi-core 版本是由單例的 Facade bus(Array) 控制 Model, View and Controller 三個單例的總代理 Commands, Mediators and Proxy 的註冊、取用與移除都是在這裡 反正就是想要操作其他 class 時，可以先參考 facade 一下... 開始寫 PureMVC 專案後，你會發現它無所不在，甩都甩不掉... 每個專案的 ApplicationFacade 都長得很像（當然命名可以修改，內容不太需要變動）。如果你有自己特有的 Singleton Class 寫法，請自行修改。懶得改的人就直接用它官網上範例的寫法即可，其實乖乖的用也不會變壞到哪去啦！ 以下為標準的 ApplicationFacade 寫法： PS:範例 code 皆使用 Standard 版本 ＋ Flex SDK 3.x or 4.x 來呈現，也許不是完整的寫法，請勿真的照抄後執行 package com.mvc { import org.puremvc.as3.patterns.facade.Facade; import org.puremvc.as3.interfaces.IFacade; import mx.core.Application; import com.mvc.controls.StartupCommand; public class ApplicationFacade extends Facade implements IFacade { public static const STARTUP:String = 'startup'; public function ApplicationFacade() { super(); } public static function getInstance...

為什麼要學 PureMVC ？ 明明網路上一堆免費的 MVC 微型框架，為什麼 Erin 特別愛用 PureMVC？ 嚴格說起來，使用 PureMVC 開發的專案寫出來的 class 檔一定比 一些簡化版 PureMVC base 的 framework 如 Robotlegs 多，也比較難入門，但是為什麼要特別推薦它？ 答案很簡單，越基本的東西反而是最好延伸，留白越多的紙最好畫！也因為如此才令人著迷啊...(咦？） 百分百真情推薦： 大家的職責切分的很乾淨...棒 訊息傳遞機制是好物 由於架構超然於 Flash / Flex 架構上,反而在 team work 分工的時候更方便 擁有多個程式語言的版本，想要入門其他語言是個不錯的選擇 Source code 公開化，要改要加什麼隨便你~~ 出來的時間比較久相關資源多 接下來就來看圖說故事。 PureMVC Diagram, 出處： PureMVC 官網 當初第一眼看到這張圖的時候，真的挺像個變形蟲，不過想要快速了解 framework 的基本運作流程，最容易的方法就是看圖說故事... PureMVC 核心是由四個單例（ singleton design pattern ） 組成： Facade, Model, View and Control，唯一出入口就是 Facade，你會發現圖示中 Model, View and Control 都是雙向指向連接到 Facade，它們互相不清楚其他人的存在。 這四個 Class 你也只需要認識 Facade 即可...=) Facade : 圖示中， Facade 下方有三個圈圈分別是 Mediator, Command and Proxy，意思是所有實作這三種 class instance 都是透過 Façade 來註冊移除或取用其他資源。拿 Flash 來比喻， Facade 很像是 root，所有的 DisplayObject 顯示、操作和移除都可以透過 root 抓取實體後執行，所有實體都可以透過 root 去找到其他實體。在 PureMVC 中， 它最大的作用就是切開 MVC 彼此的依賴，也提供 user 一個統一的操作出入口。 Model, View and Control 你會發現這三個大圈圈旁邊都有一堆同色的 Proxy, Command and M...