2013年9月21日 星期六

【Android程式設計-進階技術】Cocos2d-x 開發 Android App

Cocos2d-x 是一個跨平台的開發套件
他的前身是 Cocos2D,使用 Objective-C,用來開發 iOS App
Cocos2d-x 則是使用 C++ 來開發
基本上,用來開發 Windows, iOS 等應用程式,在 Windows 或 Mac 上都是滿順利的
但若你是在 Windows 上開發 Android 的話
則需要花一些時間和力氣做環境的前置作業

下載及安裝

在開發 Android App 之前,你得先下載及安裝幾項必要的套件
  1. JAVA Developer Kits(JDK)
  2. Android SDK
  3. Android NDK
  4. Eclipse
  5. Cygwin
  6. Cocos2d-x
Android SDK 直接前往官網下載
現在官方提供整合包(Bundle)
同時下載 Eclipse 和 Android SDK












Android NDK 則在下方











Eclipse
若你下載的不是整合包
則需自行到 Eclipse 官網下載
Java Developer Kits(JDK)則是需前往 Oracle 網站下載
Cygwin 也是到 Cygwin 的官網下載
最後則是到 Cocos2d-x 官網下載一個版本(本範例使用:2.1.1)
現在,我們再確認一次是否把該下載的都下載完了呢?
  1. JAVA Developer Kits(JDK)
  2. Android SDK
  3. Android NDK
  4. Eclipse
  5. Cygwin
  6. Cocos2d-x
檢查完畢後,我們一項一向的來設定和安裝吧

Java Developer Kits(JDK)

點兩下安裝即可進入安裝畫面,並記住你安裝的位置
(預設是:C:\Program Files(x86)\Java\)
安裝完畢後,我們得設定系統的環境變數









    「控制台」->「系統」->「進階系統設定」->「環境變數」
    下方找到「Path」,並在最後加上你安裝 JDK 的位置
    沒有改的話,是在 C:\Program Files\Java\jdk(版本號)\bin
    按確定即可完成設定

    Android SDK + Eclipse

    基本上這兩者都是壓縮檔
    直接解開在硬碟的某處即可








    解開後
    因為 Eclipse 還沒整合 Android Developer Tool(ADT)
    因為我們得進入 Eclipse 進行更新(若你是下載官方整合包,則不需此動作)











    點選「Help」->「Install New Software」,進行安裝











    在「Work with:」的地方輸入下載網址:「https://dl-ssl.google.com/android/eclipse/
    下方即會出現「Developer Tools」和「NDK Plugins」
    我建議先安裝「Developer Tools」,安裝完之後,再進來安裝「 NDK Plugins」
    因為有可能系統會出現無法安裝的訊息
    原因是少了某些檔案,先安裝「Developer Tools」就能解決這個問題
    安裝完成後
    點選 Eclipse 的功能表「Window」->「Preferences」








    在左側找到「Android」
    點開後,請輸入剛才你解開 Android SDK 的位置
    輸入完後
    下方則會出現你目前 SDK 有支援的版本(可能會和我的不一樣)
    按下 OK 確定後,重開 Eclipse
    即可在功能表「Window」下方看到 關於 Android 的選項












    到這邊即完成 Android SDK 和 Ecllipse  上的設定

    Android NDK

    Android NDK 也是一個壓縮檔
    同樣的解開在硬碟的某個地方即可
    但我這邊建議,請勿安裝在中文路徑,或是資料夾名稱含有「空白」的目錄下
    原因是在之後設定路徑時,會因「空白」而導致找不到此目錄
    你可以解壓縮到「C:\android-ndk-r8e」此類的地方

    Cygwin

    Cygwin 是一個有很多 Open Source 的集合套件
    目的是用來將 Linux 上的應用程式,重新編譯到 Windows 上執行
    而我們用 Cygwin 則是為了要將 Cocos2d-x 所寫的 C++ 程式碼編譯後
    再封裝到 Android 上執行
    這邊比較複雜,所以會講比較慢
    首先點開剛下載的 Cygwin 安裝檔









    選下一步









    選擇「Install from Internet(downloaded files will be kept for future re-use)」,並按下一步









    使用預設的安裝目錄即可,按下一步









    這個目錄則是檔案下載的位置,也是使用預設即可,按下一步









    不需要特別的設定網路,按下一步繼續









    Cygwin 會下載並安裝套件,這邊則是選擇可以下載的網址
    我選的那個還滿快的,可以選擇它,並按下一步繼續(你也可以試試看其他的)









    接著就會開始先下載檔案表,看有哪些套件可以下載









    可以安裝的套件有很多
    不過我們不需要全部都安裝
    Cocos2d-x 有列出需要用到哪些
    不過實在是不好找(那個搜尋也不好用)
    所以你可以選擇其中的「Devel」分類,並將它設定為「install」
    其它則保持「Default」即可
    按下一步,則開始進行下載
    依照網路速度不同,我下載了大概 10 ~ 20分鐘左右
    大小大概有 1 GB
    載完後,它會自行安裝,直到畫面出現完成即可









    安裝完後,執行一下 Cygwin 終端機畫面
    試著輸入「make -version」和「gcc -v」看是否有執行正常












    Cocos2d-x

    最後終於來到主題「Cocos2d-x」了
    將下載下來的壓縮檔解開
    在根目錄下可以看到「create-android-project.bat」的檔案
    點擊右鍵,選擇「編輯」(預設會以「記事本」開啟)










    由於記事本實在太難看了,所以我建議可以將所有的字
    貼到 Visual Studio 或是 Eclipse 來看,會比較好看
    打開後,我們需要改三個地方











    set _CYGBIN=c:\cygwin\bin
    set _ANDROIDTOOLS=C:\Program Files\Android\android-sdk-windows\tools
    set _NDKROOT=C:\android-ndk-r8e
    

    上面三個改成你安裝和放置的目錄
    第一個是 Cygwin 的安裝位置,夜下的 bin 資料夾
    第二個是 Android SDK Tools 的位置(注意,是 tools,不是 platform-tools)
    第三個則是 Android NDK 的目錄
    改完後,將文字貼回記事本並存檔
    關閉後,我們開始利用這個 bat 檔來新增我們的 Android 專案

    (重要更新!!)

    ===================================================
    在新增專案之前,得先到使用者設定,新增「NDK_ROOT」的參數和路徑
    首先,找到 Cygwin 目錄下的「home」,底下會看到自己的使用者名稱
    資料夾裡有個名叫「.bash_profile」的檔案
    一樣使用 Visual Studio 等 IDE 編輯它
    在最下面加上兩行,一行是新增「NDK_ROOT」和路徑
    一行則是輸出「NDK_ROOT」
    例如:
    NDK_ROOT=/cygdrive/C/android-ndk-r8e
    export NDK_ROOT
    

    就像下圖一樣


    修改完後,貼回「.bash_profile」,存檔並關閉
    建議隔一行,因為貼回去「.bash_profile」之後,會因為沒有隔一行,而導致沒有空格
    所以在關閉前,也請確定貼回去之後,最後兩行有隔開,如下:







    若覺得不保險,則可以開啟「Cygwin」,並輸入「cd $NDK_ROOT」
    如果有完整輸出 NDK 路徑,則表示設定無誤

    ==========================================================

    新增專案

    首先,開啟命令提示字元(Win + R,並輸入「cmd」確定即會出現命令提示字元)
    使用 「cd」的指令,並加上 Cocos2d-x 的路徑,將現在的目錄切換過去








    輸入「create-android-project.bat」,並按下「Enter」
    畫面首先會先問你 Package 的 Path
    Android 規定得要出現一個「.」,所以你可以輸入「com.cocos2d_x」










    接著會要求你輸入專案的名稱,我輸入「Cocos2d_x_Android」
    (只能有 A-Z 0-9 還有底線)
    輸入完,按下 Enter 後,會出現目前你的 Android SDK 可以支援的 Android 版本
    你可以選擇你手上有的實體手機版本,或是你想開發的 Android 版本












    我這邊使用 Android 4.2.2 ,找到此版本的 id ,輸入後,按下確定即可










    最後出現「請按任意鍵繼續」,且並無出現錯誤,則表示完成專案的建立
    這時到 Cocos2d-x 目錄夜下,則會發現剛才我們建立的專案








    裡面包含三個資料夾
    「Classes」 = 用來放置程式碼(.cpp, .h)
    「Resources」 = 放置需用到的圖片和檔案(.png, .plist…)
    「proj.android」 = Android 專案的主體

    編譯程式碼

    完成專案的建立後
    打開我們的 Cygwin 終端機
    然後你會發現,目錄再怎麼切換都不對
    因為你可以想像他就是一個 Linux 系統
    所有的裝置都是掛載在某個目錄下
    而 Cygwin 則是將裝置掛載在「/cygdrive」
    我們的 C 槽,理所當然的就在「/cygdrive/c」(記住,是斜線,不是反斜線)
    於是我們一樣利用 「cd」指令,將目錄移到我們剛才建立的專案下「proj.android」的目錄下







    黃字代表你輸入的是正確的(注意,cygdrive 前是有斜線的哦)
    接著輸入 「sh build_native.sh」







    輸入完,按下 Enter 即會進行編譯







    第一次編譯需要一段時間,所以請耐心的等待







    最後出現這樣的畫面,表示編譯成功,並沒有任何的錯誤(過程可能會出現警告,不過可以忽略)

    建立 Eclipse 專案

    編譯完後,打開 Eclipse
    新增一個專案,並使用匯入現在程式碼的方式新增











    接著需要指定專案目錄
    這邊請特別注意
    請輸入的是 Cocos2d-x 的目錄,而不是我們新增專案的目錄
    請輸入的是 Cocos2d-x 的目錄,而不是我們新增專案的目錄
    我不是跳針,是因為很容易選錯而讓程式一直跑不起來
    選完後,下方即會馬上跑出許多專案












    我們只要勾選專案名稱為「libcocos2dx」和我們自己的專案「Cocos2d_x_Android」
    其他的專案不用選,並請記住把下方的「Copy projects into workspace」的勾取消掉
    確認無誤後,按下「Finish」,完成 Eclipse 專案的建立
    進入後,你會發現你的專案出現「錯誤」的符號
    是因為「圖示」的名稱錯了
    我們打開「AndroidManifest.xml」,切換到「Application」頁面
    並將「icon」的值改成「@drawable/ic_launcher」(不用加.png)









    輸入完後,按下「Ctrl + S」存檔,這時錯誤就會消失
    完成後,對著我們的專案點右鍵,並選擇「Run As」->「Android Application」











    執行前,請先開啟模擬器或是插入你的 Android 實體裝置









    右下方的進入顯示目前正在開個我們的應用程式
    開啟無誤後,即可以看到預設的畫面了










    新增程式碼
    當你開始寫程式,新增其他的 .cpp 和 .h 檔之後
    發現怎麼編譯都找不到你的程式碼
    原因是因為,你沒跟專案說你有哪些檔案
    你必須手動的新增這些檔案目錄
    開啟 Eclipse 專案
    在你的專案裡找到 「jni」->「Android.mk」








    將你的程式碼按照它的方式,新增上去
    標頭檔的部分則不用動,它會自己往下尋找
    例如我的專案就新增了不少檔案








    其中,我有使用到 「Box2D」
    則在最下方加入 Box2D 的類別位置

    每次新增一個程式碼,都得到「 Android.mk」裡新增你的程式碼路徑
    而每一次修改程式碼,都得利用 Cygwin
    透過「sh build_native.sh」的方式重新編譯程式碼
    我第一次使用的時候,弄了好久才弄好
    若是利用 Mac 來開發 Android 的話,則相對的快很多
    光是 Cygwin 這一段就省下來了
    其他的則和上述的步驟差不多
    我建議的開發方式如下

    沒有留言:

    張貼留言