Futile是一套給Unity 用的2D Framework, 架構類似於AS3及Cocos2D,有用過這兩種的人會很容易上手。
官網 & GitHub位置: https://github.com/MattRix/Futile
Demo及入門教學影片: http://struct.ca/futile/
最近上架的Nimble Quest即是用Futile所開發
這是我目前試用的幾個Unity 2D方案中,最適合Flash/AS3人員轉移的了。原因是Futile不需要在Unity IDE上做太多操作,大部份都是用code來完成的,有點像是在Flash Builder上做事。唯一差別是寫C#而非AS3。
而沒寫過C#的人也不用太擔心,大致上寫起來不會太難,與AS3也有許多相似之處,尤其Futile延用了許多AS3人員熟悉的概念(Sprite, Container, AddChild...etc.) 以致上手時備感親切。
實際操作
1.於Unity裏建立一個新project(File -> New Project...)
2.至GitHub網站下載Futile的檔案
3.解開zip後,開啟裏面的Futile.unitypackage或是在Unity裏從Assets->Import Package->Custom Package…去安裝Futile
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2mVfokAhX6iVyVieFOMgeHU1W8G2lXHQmvyEr2gM5toBMaU5mzrcoksMdlFxvLGbOKIW6rwiR05kxoOVB9P4hChW2aLFZ776aglw1OOYVn-NwDNOGj7FXLV1Q4W_kLNhHmVwKWSXCND0/s320/0.png)
4.至以上步驟為止,我們已經把Futile安裝至我們的Project中了。
5.在Unity裏,把預設的Main Camera刪除掉
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3cIzD1QhUOqam4MssVWCbefE2dDhVOWgJmQq1p_OlZ_yDroyzEvFj2HYQvrobgqKD4SO9YIMuSRc3vV8531QHZ33wsE-BnfEZMT3JqHcWBwbkjMhKtWnaVKblE6L4oD930C3eVchqHTw/s320/1.png)
6.建立一個空白的GameObject
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfCl_S0uySgIWvk1vzEqW17GpNX8BqKZdWFYyvU4bbGwfoSZEXvMsfqzM9e4R5hucBYMBNBzSABmgWGnWcdi4zorzekHj38bvulw78p3T0k6JNgrOm3pVIJrhpf_SET6NQfaQDd_Zk4bk/s320/2.png)
7.為方便辨識,在Inspector面板裏把新建的Game Object重新命名為"FutileObject"
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVHQsMtns7Wip-fTWP9mJ2Sq59xXkhij8EbuJBwamLmVPYzBYUmV0RBv0NFtXx83XZSX-sxzBqFMft-DUIfZVM9TBP_cPisMF5C9gPb_a0wxxAMRqfbX-5CcQ9H7a-RQsCx4tj9Zirsic/s320/3.png)
8.在專案資料夾中,Assets/Plugins/Futile/裏放著Futile的所有程式檔。這時需先把主程式Futile.cs與剛建立的FutileObject綁定在一起。可以從Project面板把Futile.cs直接拉到Hierarchy面板中的FutileObject中,如下圖
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhemXtO8JcYHVuKQKHxf3KKghnBi_zUklilVz7GLcNyrPaC7od6UCzkpY6ieE3Qjt_ZSD2aZ5ovISi9prGaTa7H6ZBw1j2i13jGRlP6aEFSN7gJp7sXc2QyaORv9dnOjySPPo35y-Z9oqk/s320/4.png)
9.可以在Inspector面板中確認Futile是否有綁進FutileObject裏
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd79ryvWXeJhb2Lqa7D1AgxuSMro3M7dcWJZtqm5ah6uIw_rfcxtNkyUADoULhnwav3sVVUiuttjSBA5EcJG0w-FK_q4LJAVsfzj-z63AYMARhj_N6J0FVQEhv1wvxa6rnPSeTOw3YhCc/s320/5.png)
10.為了方便之後的開發,我們可以在Assets裏新建一個"Scripts"的資料夾,放置我們自己寫的.cs檔
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFSlTlLYvqf7SqNtJtSDrP96TYORcZ8rrU1mcvnwDmunBNiG5r8YI7gGjYYA3g_hoEfMgOBa1a6gZHFAfFb8xcU9VA-2H5vBMlxbvpXF3oCgEfkSakgCc1b69W4nQsANAzY1WMKozEDzc/s320/6.png)
11.在Scripts裏新建一個C# script檔,命名為"MyGame"
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghyphenhyphenml3_tb-nofkYMKcM9isOxNlGzSov3BP5dpiFgkRtDwueFuHyIf7OEzmfI-gQsQEanQsvOqYLQrUE0QJgRI2M2ieao74jXy3J9lyK3kfg8mmCj3-4mw5qwuHJ1-S_mO1Ghsw8U6-sGA/s320/7.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMq1F5ddBDW2aygyp-gqrjaXmKh0RUWvUxPFDIDkpAvfmvwSi0JKQVDiP5uXAByAlSGjPdGWjlG5Ag71I1aUjzq8gn2LkliNFpG4qowNENKjBi_Wv6B6ouP-6mytoBqj8Spg09noZ6u-k/s320/8.png)
12 .接著我們試著在Futile裏呈現一張圖。Futile預設的素材載入路徑為/Assets/Resources/,所以先隨便找一張圖放在此處。(我放了一張名為baozi.png的圖)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiht2yCk1tyy2nArYqyUCDRCh3UT36zjDtQihH1UbS4PDT_FbvRpXHf2vm9KMALmqXYfPxBL6M6kIpCymeXuj9qTQZeJD5qJuCPXW05ySxIyNpTuPDoHnVVMQdJnvne4HQ8c3nZfW_6m3w/s320/9.png)
13.接下來在Project面板中點兩下MyGame.cs,此時Unity會自動開啟MonoDevelop,這是Unity自帶的程式撰寫工具。以下是MyGame.cs需撰寫的內容:
using UnityEngine; using System.Collections; public class MyGame : MonoBehaviour { // Use this for initialization void Start () { FutileParams futileParams = new FutileParams(true,true,true,true); futileParams.AddResolutionLevel(480,1,1,""); Futile.instance.Init(futileParams); Futile.atlasManager.LoadImage("baozi"); FSprite mySprite = new FSprite("baozi"); Futile.stage.AddChild(mySprite); } // Update is called once per frame void Update () { } }
14.最後記得把MyGame.cs也拉進FutileObject裏
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPWinOA2ro_xLAkCbVjlPPt1bdxzDKpiUFqzYmVAkse1nNr0vPyHC53UYG2fvQ0zfdrHB5ZrodXmDcVOUPjZ2Y03hp76OXV7MA38n_wiFd8_jqKI15OxEyqUAHk8jKQdleHTgOodxnjnA/s320/10.png)
15.點擊preview看看圖片是否有正常出現在畫面中
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfTCwHLG8e8Nud8aEdGhp9V17peHxkYz7QpvFBTnzoWxjZ1Ny8k6Wq8ynxVtRs-rMc2_aJGnpl-crKOP6dCzm9Pl_ph9Tlo-iemLhBIh4dR_vDmtoE5iBTw7RZrOJ_p3C2CQJEN-sBK3Q/s320/11.png)
16 .在撰寫FutileParams及AddResolutionLevel等程式時,MonoDevelop就會自動出現各參數的解說了,在此就不解釋了。
17.Update這個event會有點類似我們在Flash裏用的EnterFrame,是一個持續執行的function,我們改一下剛剛的程式:
using UnityEngine; using System.Collections; public class MyGame : MonoBehaviour { private FSprite _mySprite; // Use this for initialization void Start () { FutileParams futileParams = new FutileParams(true,true,true,true); futileParams.AddResolutionLevel(480,1,1,""); Futile.instance.Init(futileParams); Futile.atlasManager.LoadImage("baozi"); _mySprite = new FSprite("baozi"); Futile.stage.AddChild(_mySprite); } // Update is called once per frame void Update () { _mySprite.rotation ++; } }
18.正確的話,應該會看到載入的圖片不斷的轉動,程式中的rotation就如同AS3的使用方式,也可以改成x, y, alpha, scale等屬性試試。
注意: Futile的座標系統與Flash大不相同,Futile的(0,0)在畫面的正中間,y值向上為正,向下為負。
以上便算完成一個最基本的入門範例。除了一開始的刪除Main Camera,建新Game Object,以及把程式與Game Object設綁定之外,幾乎所有開發都是在MonoDevelop裏寫code。這點對於尚不熟悉Unity介面的人來說,是一個不錯的優點。
下一篇應該會來寫一個簡單的打地鼠遊戲。(其實也只是照著Futile作者的教學影片做變化而已,有興趣的人不妨自己去官網看影片會比較快)