Skip to main content

[AIR] JoSi FXGtoLayout

JoSi FXGtoLayout

v0.3.0, Adobe AIR 3 runtime

這個又是一個 "就是" 系列懶人小工具，主要是針對 Adobe fxg 格式做分析轉成 Mobile 開發用的視圖程式碼，加速畫面配置使用。

為什麼會製作這個工具，原因主要是本人在使用的 Corona SDK 與 Titanium SDK 都沒有好用的視覺化編輯工具。一般設計師產出 layout 檔會使用 PhotoShop 來製作，在不多花錢的原則下，畫面對齊的基準就是其輸出的 fxg 資料做對應，如果要一筆一筆將資料鍵入，做久也是會膩的，所以花了點時間將這個工具做出來...



不過目前版本僅支援 Corona SDK 格式輸出。



目前版本 0.3.0 feature:
  1. 拖曳並放置 fxg 檔案後，轉換的文字會直接貼到剪貼簿。
  2. 產生之物件名稱以 d:userLabel 為主(即 PhotoShop 圖層名稱），所以請注意命名。
  3. 僅支援 Corona SDK 格式輸出。
  4. 僅支援 fxg <<BitmapImage /> 標籤，PhotoShop and Flash 輸出皆可使用，差別是 Flash 會採用 newImage。
  5. 先這樣囉！
輸出之程式碼範例：（輸出 by Photoshop) 

----------------------------------------------------------------------
-- JoSiFXGtoLayout
-- Author:Erin Lin
-- erinylin.blogspot.com
-- Copyright (c) 2013 Erin Lin( Yu-Shan Lin )
-- File Name:file:///---/menu.fxg
----------------------------------------------------------------------
local function moveTo(target, x, y)
target:setReferencePoint(display.TopLeftReferencePoint);
target.x=x; target.y=y
end

local _imgPath='menu.assets/images/'

local bg_ = display.newImageRect( _imgPath..'bg1_0.png', 640, 960 )
moveTo( bg_, 0, 0 )
group:insert( bg_ )

local bg_ = display.newImageRect( _imgPath..'bg2_1.png', 640, 960 )
moveTo( bg_, 0, 0 )
group:insert( bg_ )

local logo = display.newImageRect( _imgPath..'logo_2.png', 586, 925 )
moveTo( logo, 17, 0 )
group:insert( logo )

local btn_stage = display.newImageRect( _imgPath..'btn_stage_4.png', 184, 184 )
moveTo( btn_stage, 199, 578 )
group:insert( btn_stage )

local btn_option = display.newImageRect( _imgPath..'btn_option_6.png', 134, 134 )
moveTo( btn_option, 372, 720 )
group:insert( btn_option )

local btn_ta = display.newImageRect( _imgPath..'btn_ta_8.png', 161, 160 )
moveTo( btn_ta, 26, 682 )
group:insert( btn_ta )

local btn_score = display.newImageRect( _imgPath..'btn_score_10.png', 162, 162 )
moveTo( btn_score, 491, 612 )
group:insert( btn_score )

將產生的程式碼直接 ctrl-p or command-p 到 Corona SDK 的 storyboard template 之 scene:createScene function 內即可，當然前提是 fxg 輸出時的 assets 檔案夾記得 copy 到工作環境下。
Labels:

Comments

Post a Comment

Popular posts from this blog

[Swift3] weak 與 unowned 關鍵字

雖然在 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...
4 comments
Read more

Robotlegs AS3 MVC framework in Flex project (I)

由於今天在 奶綠茶的 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{ ...
6 comments
Read more