搜尋此網誌

2012年11月15日 星期四

FlashDevelop+Adobe AIR SDK將配對遊戲搬上Android/IOS

用ActionScript寫遊戲主要就是看上它可以很容易的跨平台,
雖然得付出一些代價(效能), 但如果你不是做一些很在乎速度的遊戲
那ActionScript會是一個不錯的選擇
癈話不多說,現在我們就把之前寫的配對遊戲給搬上Android/IOS

正確安裝完FlashDevelop之後,『Project』 -> 『New Project』選擇 Air Mobile AS3 App
如下圖


填好相關資料按OK後,就會開啟一個新的專案
如你所見,Flashdevelop已經幫你做好大部份的工作
目前最新版本的一些設定用內定值不用改就都可以正常運作


首先如下圖對CreateCertificate.bat按右鍵選擇Excute(執行)此批次檔來產生Android所需的憑證
(一個專案只需執行一次)


接著看一下Run.bat(跟一般專案不同的是當你按F5測試專案時,它會執行此批次檔)
:target
goto desktop
::goto android-debug
::goto android-test
::goto ios-debug
::goto ios-test
內定的是 goto desktop,是用AIR Debug Launcher在PC上做測試
其餘的都是在實機上執行,須有實機連接到USB,並裝妥所需的驅動程式才行

接下來就可以來開始編輯程式了
你可以複製之前所需的程式碼到此貼上
不過既然之前就已經產生SWF,這裡我們就用另外一種方式
先將之前的SWF複製到lib的資料夾下後再來編輯程式
底下紅字部分就是新增加的程式碼

package {
    import flash.desktop.NativeApplication;
    import flash.events.Event;
    import flash.display.Sprite;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.ui.Multitouch;
    import flash.ui.MultitouchInputMode;
    import flash.display.Loader;
    import flash.system.ApplicationDomain;
    import flash.system.LoaderContext;
   
    /**
     * ...
     * @author JamesH
     */
    public class Main extends Sprite {
        [Embed(source = "../lib/tEmbed.swf", mimeType = "application/octet-stream")]
        private var swfContent:Class;
        public function Main():void {
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.align = StageAlign.TOP_LEFT;
            stage.addEventListener(Event.DEACTIVATE, deactivate);
           
            // touch or gesture?
            Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;
           
            // entry point
            var loader:Loader = new Loader();
            addChild(loader);
            var lContext:LoaderContext = new LoaderContext(false, new ApplicationDomain());
            lContext.allowCodeImport = true;
            loader.loadBytes(new swfContent(), lContext);
            // new to AIR? please read *carefully* the readme.txt files!
        }
       
        private function deactivate(e:Event):void {
            // auto-close
            NativeApplication.nativeApplication.exit();
        }
    }
}

按F5測試專案,沒意外的話應該可以看到如下所示執行的畫面


測試無誤後,就可以打包了
對PackageApp.bat按右鍵選擇Excute(執行)此批次檔


選1 打包成一般的APK,此APK安裝時,Android機器上需裝有Adobe AIR runtime才可以
選2 則是包含有DEBUG資訊,此APK一樣需裝有Adobe AIR runtime才行
選3 則是將Adobe AIR runtime也包含進去,所以此APK可以獨立安裝,不過相對檔案會大很多


打包完成


IOS步驟是差不了多少,主要差的就是憑證的部分
要產生IOS所需的憑證步驟比較繁瑣,而且得花些錢,這裡就不多做說明
有需要的參考專案裡的AIR_iOS_readme.txt

4 則留言:

ben 提到...

請問版主, 我照您的方式已成功將flash轉為apk 了,但是聲音卻不見了! 請教我需如何做方能有聲音出來, 謝謝您
[版主回覆12/05/2012 19:09:15]如果您是用Embed那應該是不會有什麼問題
如果是用載入外部檔案,那需要注意相對的路徑是否正確
FlashDevelop製作出來的swf會存放在bin資料夾底下
而輸出apk時,會將bin這個資料夾底下的所有檔案(包含子資料夾)
全部包成一個apk
所以如需載入外部檔案
請先將您的外部檔案複製到bin資料夾底下
假設資料夾結構如下
bin\airApp.swf
bin\Gfx\imgBG0.jpg
bin\Gfx\Lobby.swf
bin\Mus\m01.mp3
bin\Mus\m02.mp3
...
那播放音樂的code大概就長這樣
var req:URLRequest = new URLRequest("Mus/m01.mp3");
var mus:Sound = new Sound();
mus.load(req);
mus.play();

ben 提到...

感謝!

ben 提到...

請問版主, 照您的指點果然可以在desktop mode 時聲音跟圖案都出來了,但是包裝成apk 卻在Nexus 7安裝執行時螢幕卻是一片白, 請問我需要注意甚麼呢?謝謝您 PS:我有在run.bat 裡設 set SCREEN_SIZE=1280x800:800x1280
[版主回覆12/06/2012 20:28:37]run.bat 裡設 set SCREEN_SIZE 跟實機沒有什麼關係
有問題,也許您可試試將run.bat改成
::goto desktop
goto android-debug
...
用實機來DEBUG(須有實機連接到USB,並裝妥所需的驅動程式才行)
加些trace來顯示目前程式的狀況
實機程式啟動(debug)時,Air runtime會詢問debug ip位址
填入您的PC位址
之後遇到有加trace的地方就會將結果送往FlashDevelop來顯示

ben 提到...

版主又麻煩您了!照您所說的改為 android-debug ,也鍵入所連接PC的ip addr , 但是FD 的output wimdows 秀[No debug Flash player connection request] ,而Nexus 7這邊也找不到PC 是為何呢? 我已經關了PC 的防火牆了
[版主回覆12/07/2012 16:13:25]您的IP是外網的實體IP,還是內網的虛擬IP
我自己的環境是PC跟平板的網路連線都是透過IP分享器
因此它們是屬於同一網段的內網虛擬IP
測試都正常沒問題
提供給您參考