*

Cocos2d-x v3.2の開発環境を作ってみた

公開日: : Android, Cocos2d-x, Mac, iOS

Cocos2d-x v2.2.2で構築していた開発環境を v3.2にバージョンアップしました。

HelloCocos2d-x_v3.2

Cocos2d-xは2Dゲームを作成するために必要な機能がまとめられたフレームワークで、マルチプラットフォーム開発ができることや、オープンソースで無料で使えるといった特徴があります。共通のソースコードでAndroidとiOSの両方のアプリが作れるので開発が楽になります。去年、Cocos2d-xの開発環境を作った時はv3.0がまだβ版だったこともあり、導入を見送って v2.2.2をインストールしましたが、昨日(2014/07/18) v3.2がリリースされたので思い切って、バージョンアップに踏み切りました。

ここでは、MacBook上に Cocos2d-x v3.2 の開発環境を作り、初期プロジェクトに含まれるHelloWorldアプリを、XcodeでビルドしてiOS端末で動かし、同じものをADT(Eclipse)でビルドしてAndroid端末で動かす、というクロスプラットフォーム開発を紹介します。

v2.2.2の記事はこちら→Cocos2d-xの開発環境を作ってみた。

Cocos2d-x v3.2開発環境の構成と主なバージョン

  • MacBook (Mac OS X 10.9.4)
  • Cocos2d-x v3.2
  • Xcode v5.1.1
  • ADT v23.0.2.1259578
  • Android NDK r9d

現時点で最新バージョンのCocos2d-x、Xcode、ADT(Android Developer Tools)を使っています。Android NDKはr10が最新ですがCocos2d-x v3.2が対応していないようなので、旧バージョンのr9dを使いました。

Cocos2d-x開発環境の構築手順

はじめにiOSアプリの開発環境であるXcodeを使えるようにしてから、Androidアプリの開発環境であるADT(Eclipse)を使えるようにしていきます。

  1. iOSアプリの開発環境を整える
    1. Xcodeをインストールする
    2. Cocos2d-xをインストールする
    3. プロジェクトを作成する
    4. Xcodeでビルドして実機で動作確認する
  2. Androidアプリの開発環境を整える
    1. Javaをインストールする
    2. Android SDKとNDKをインストールする
    3. Eclipseを設定する
    4. Eclipseでビルドして実機で動作確認する

iOSアプリの開発環境を整える

1. Xcodeをインストールする

Mac App Storeから最新のXcodeをダウンロードしてインストールします。最新バージョンは v5.1.1でした。

Xcode App
カテゴリ: 開発ツール
価格: 無料

2. Cocos2d-xをインストールする

Download Cocos2d-xから Cocos2d-x v3.2(cocos2d-x-3.2.zip)をダウンロードして適当なフォルダに解凍します。ここでは書類(/Users/shimodai(ユーザ名)/Documents/cocos2d-x-3.2)に配置しました。このフォルダには今後、プロジェクトを作成してプログラムコードやリソースファイル等も置いていくことにします。

Download_Cocos2d-x_v3_2

続いて、ターミナルから初期設定スクリプト(setup.py)を実行します。

    $ cd ~/Documents/cocos2d-x-3.2
    $ ./setup.py 

NDK、SDK、ANTのパスを聞かれるので入力します。
(Android用の設定なのでAndroidで開発しない場合は全てスキップしても大丈夫です)

  • NDK_ROOTのパス : /Applications/android/ndk
  • ANDROID_SDK_ROOTのパス: /Applications/android/sdk
  • ANT_ROOTのパス: (スキップ)

作業しているこのターミナルの設定を更新するために、忘れずにsourceコマンドを実行しておきます。

    $ source /Users/shimodai/.bash_profile

初期設定スクリプト(setup.py)が何をしているかというと、ツールの実行やビルドに必要なパスを環境変数として .bash_profileに設定しています。これによってターミナルから cocosコマンドやビルドコマンド(build_native.py)が使えるようになります。

    # Add environment variable COCOS_CONSOLE_ROOT for cocos2d-x
    export COCOS_CONSOLE_ROOT=/Users/shimodai/Documents/cocos2d-x-3.2/tools/cocos2d-console/bin
    export PATH=$COCOS_CONSOLE_ROOT:$PATH

    # Add environment variable NDK_ROOT for cocos2d-x
    export NDK_ROOT=/Applications/android/ndk
    export PATH=$NDK_ROOT:$PATH

    # Add environment variable ANDROID_SDK_ROOT for cocos2d-x
    export ANDROID_SDK_ROOT=/Applications/android/sdk
    export PATH=$ANDROID_SDK_ROOT:$PATH
    export PATH=$ANDROID_SDK_ROOT/tools:$ANDROID_SDK_ROOT/platform-tools:$PATH

3. プロジェクトを作成する

プロジェクトの作成はターミナルからcocos newコマンドを実行します。ここでは「~/Documents/cocos2d-x-3.2/projects/」フォルダにHelloWorldプロジェクトを作成しました。cocos newコマンドの使い方は「cocos new —help」で見ることができます。

$ cocos new -p jp.mnemonic.c2dx.helloworld -l cpp -d  ~/Documents/cocos2d-x-3.2/projects/ HelloWorld 

【cocos newコマンドのオプション】
-p パッケージ名:自ドメインを使って適当に
-l 開発言語(cpp、lua、js):C++で開発するので cpp
-d プロジェクトパス名:v2系と同じ ~/Documents/cocos2d-x-3.2/projects/としました
最後のパラメータはプロジェクト名です

4. Xcodeでビルドして実機で動作確認する

Xcode用のプロジェクトファイルが作成されているのでこれを開きます。「~/Documents/cocos2d-x-3.2/projects/HelloWorld/proj.ios_mac」フォルダの中にある HelloWorld.xcodeproj をXcodeで開きましょう。開いたあとはiOSシミュレータを選択してBuild & Runすれば iOS版Hello Worldアプリの完成です!

HelloWorld

Androidアプリの開発環境を整える

1. Javaをインストールする

ターミナルから java -version を実行して、Javaがインストールされているか確認して下さい。エラーになる場合は、Java for OS X 2013-005等をダウンロードしてJavaをインストールします。Javaの最新バージョンは 1.7ですが、ADTがJRE6を要求しているので 1.6を入れておくのが無難だと思います。

    $ java -version
    java version "1.6.0_65"
    Java(TM) SE Runtime Environment (build 1.6.0_65-b14-462-11M4609)
    Java HotSpot(TM) 64-Bit Server VM (build 20.65-b04-462, mixed mode)

2. Android SDKとNDKをインストールする

Android SDKはAndroidアプリのJavaの開発環境で、NDKはC/C++の開発環境です。Cocos2d-xによる開発はC++を使って行うため、Adnroid SDKと合わせてNDKのインストールが必要になります。

Android SDKは、Android SDK | Android Developersから「Download Eclipse ADT with the Android SDK Bundle for Mac」をクリックしてダウンロードします。今回は「adt-bundle-mac-x86_64-20140702.zip」をダウンロードしました。

Download ADT

Android NDKは、Android NDK | Android DevelopersからOS環境に合わせたものをダウンロードします。Mac OS X 64-bitの最新NDKは「android-ndk64-r10-darwin-x86_64.tar.bz2」ですが、Cocos2d-xはNDK r10に対応していないようなので、今回は一つ前の「android-ndk-r9d-darwin-x86_64.tar.bz2」を使いました。(公式ページには旧バージョンのダウンロードリンクが見当たりませんが、このリンクからダウンロードできます)

Download NDK

ダウンロードしたAndroid SDKと Android NDKを解凍してアプリケーションフォルダに配置します。わかりやすいパスになるようにこのようなフォルダ構成にしました。

ApplicationFolder

  • adt-bundle-mac-x86_64-20140702/eclipseをandroid/eclipseにリネーム
  • android-ndk-r9dをndkにリネーム
  • adt-bundle-mac-x86_64-20140702/sdkをandroid/sdkにリネーム

3. Eclipseを設定する

Eclipse(/Applications/android/eclipse/Eclipse.app)を起動して各種設定を行います。初回起動時に Android SDK Manager が起動してきた場合は、チェックが入っているものをインストールすれば最低限のものは入るはずです。あとは必要に応じて開発したいバージョンのAPI等を追加してください。ここでは Tools、Android 4.4.2(API 19)、Extrasの下記パッケージをインストールしました。

Android_SDK_Manager_Packages

続いてEclipseの各種設定を行っていきます。

Android SDKのパスを設定します。
「Eclipse」−「環境設定」−「Android」−「SDK Location」に「/Applications/android/sdk」を設定しました。

Eclipse_SDK_Location

NDKのパスをC++ Buildの環境変数に設定します。
「Eclipse」−「環境設定」−「C/C++」−「Build」−「Environment」に「Variable:NDK_ROOT Value:/Applications/android/ndk」を追加しました。

Eclipse_NDK_ROOT

4. Eclipseでビルドして実機で動作確認する

Package Explorerペインで右クリックして「Import」−「Android」−「Existing Android Code Into Workspace」を選択、「Root Directory」に「/Users/shimodai/Documents/cocos2d-x-3.2/projects/HelloWorld/proj.android」を設定して、EclipseにHelloWorldプロジェクトをインポートします。

Eclipse_Import_Project

プロジェクトをインポートするとビルドエラーが出るので修正します。

Eclipse_builderror

  • Cocos2dxActivity cannot be resolved to a type
  • The import org.cocos2dx.lib cannot be resolved

Package ExplorerペインでHelloWorldプロジェクトを右クリックして「Properties」−「Resource」−「Linked Resources」を選択、Invalid Locationになっている「libcocos2d」のパスを「PROJECT_LOC/../cocos2d/cocos/platform/android/java/src」に修正します。

Eclipse_libcocos2d

ビルドエラーが無くなったらAndroid端末の実機を接続して、HelloWorldプロジェクトを選択、「Run As」−「Android Application」で動作確認してみましょう。これでAndroid版Hello Worldアプリも完成しました!

Eclipse_RunAs

クロスプラットフォーム開発を体験する

クロスプラットフォーム開発がどんな感じなのか体験するために、プログラムを変更してみました。アプリを実行したときに表示される「Hello World」を「Hello Cocos2d-x v3.2!」に変更して文字サイズを大きくしてみます。
XcodeでHelloWorldプロジェクトを開いてClasses/HelloWorldScene.cppの57行目を書き換えました。

    // add a label shows "Hello World"
    // create and initialize a label
   
    auto label = LabelTTF::create("Hello World", "Arial", 24);
   
    // position the label on the center of the screen
    label->setPosition(Vec2(origin.x + visibleSize.width/2,
                            origin.y + visibleSize.height - label->getContentSize().height));

    // add a label shows "Hello World"
    // create and initialize a label
   
    auto label = LabelTTF::create("Hello Cocos2d-x v3.2!", "Arial", 64);
   
    // position the label on the center of the screen
    label->setPosition(Vec2(origin.x + visibleSize.width/2,
                            origin.y + visibleSize.height - label->getContentSize().height));

Xcodeでビルドして実行すればiOS端末で、Eclipseでビルドして実行すればAndroid端末で「Hello Cocos2d-x!!」に変わっているのが確認できます。
共通のソースコードでAndroid/iOSに対応できるクロスプラットフォーム開発はとても便利ですね。

Hello_Cocos2d-x_v3.2


関連記事

Mac OS X 10.9

影無しでウインドウのスクリーンショットを撮る方法

Mac OS Xでウインドウのスクリーンショットを撮る(Cmd+Shift+4、Space、クリック

記事を読む

iPhone5_home_thumb

iPhone必須アプリまとめ(4) エンタメ

エンタメ 書籍、音楽、動画、ゲームなど趣味や遊びに使うアプリ。徒歩や電車移動に欠かせない音楽、Po

記事を読む

iPhone5_home_thumb

iPhone必須アプリまとめ(5) 環境設定

環境設定 iPhoneそのものの使い勝手を良くするアプリ。アプリストア、壁紙、メモリ開放、デバイス

記事を読む

iPhone5_home_thumb

iPhoneから外せない必須アプリをまとめてみた。

先月開発機として購入したAndroid端末、Xperia Z1f がサックサクでなかなか使い易か

記事を読む

AppStoreToPlayStore

iPhoneアプリの代替になるAndroidアプリを探してみた。

iPhoneからAndroidに移行したい必須アプリ68本のうち、Android版が提供されていない

記事を読む

iphone

iPhone/iPadゲームアプリのセーブデータをバックアップする方法

iPhone/iPadゲームアプリを消してもセーブデータは残しておきたい iPhone/iPadの

記事を読む

Cocos2d-xの開発環境を作ってみた。 Image

Cocos2d-xの開発環境を作ってみた。

AndroidとiOSのクロスプラットフォームで楽してゲーム開発をしたいなぁ、ということで Coc

記事を読む

iPhone5_home_thumb

iPhone必須アプリまとめ(1) コミュニケーション

コミュニケーション 遠隔地にいる人とのコミュニケーションや情報共有に活用しているアプリ。スマートフ

記事を読む

iPhone5_home_thumb

iPhone必須アプリまとめ(2) 情報収集

情報収集 情報閲覧・収集、調べものに活用しているアプリ。スマートフォンの「インターネット端末」とし

記事を読む

iPhone5_home_thumb

iPhone必須アプリまとめ(3) 仕事効率化

仕事効率化 情報整理・記録や、仕事や生活を効率化してくれるアプリ。スマートフォンの「電子手帳、小型

記事を読む

Comment

  1. sj より:

    はじめまして。
    記事通りに進めてビルドすることができました。大変参考になりました。
    eclipseでのビルド時に記事と同様にWarning がいくつか出ていますが、問題ないでしょうか?

    • admin より:

      感想ありがとうございます。お役に立てて良かったです。
      HelloWorldのビルドで出る警告ですが、どれも問題ありません。警告を出しているResourceが自分の書いたプログラムであれば見直して修正しますが、Cocos2d-xのライブラリ内なので、修正する事もできますが、リスクを考えるとそのままにしておくのが無難だと思います。Cocos2d-xのライブラリはバージョンアップを続けてきたコードなので古いコードやゴミが残っていることが結構あり、こういった警告はたくさん出ます。

      empty struct has size 0 in C, size 1 in C++
      missing sentinel in function call
      最初の2つは2回目のビルドから表示されなくなると思います。

      Resource leak: ‘inputStream’ is never closed
      finally句でストリームをCloseしていないのでメモリリークを指摘されていますが、例外はOpenに失敗したときに起こるのでCloseしなくて問題ありません。

      The import ***** is never used
      インポートしているクラスが使われていない(無駄にインポートしているだけ)なので問題ありません。

      The method ***** is never used locally
      ローカルメソッドが定義されているが使われていない(無駄なメソッドがあるだけ)なので問題ありません。

      The method ***** is deprecated
      非推奨メソッドが使われています。Cocos2d-xがバージョンアップすると動かなくなるかもしれませんが、その時はここも整合性をとって変更されるでしょうから問題ありません。

      The value of the field ***** is not used
      フィールドが定義されているが使われていない(無駄なフィールドがあるだけ)なので問題ありません。

  2. より:

    ありがとうございます
    他のサイトだと情報古かったりわかりにくいですが。
    ここのはちゃんと出来ました。
    「2d」の部分がいらないとかバグやん。アレはわからん。
    環境変数もeclipse上で設定できるんですねぇ。
    イラン手間かかった

  3. […] ■Cocos2d-x v3.2の開発環境を作ってみた http://www.mnemonic.jp/shimodai/post-453/ v2.2で開発していた人がv3.2へバージョンアップしたようです。 Cocos2d-xの開発環境の作り方が画像入りで手順が書かれ […]

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

c40e609e2241f4f8ec1f3302b897530e.jpg
爆発エフェクトの作り方

  第2回アビガンで1位頂きました。アビーさん、ありがとう! 視聴

100x100bb.png
Mars Edit 4で投稿してみる

ブログエディタMars Edit 4を導入。ブログが続かない理由って「

no image
Ingressを習慣化する10ヶ条

Ingressを楽しんでプレイすることはもちろんですが、レベルアップの

no image
Suicaインターネットサービスでチャージできない

久しぶりにSuicaインターネットサービスでチャージしようとしたら「ブ

スクリーンショット 2015-09-19 22.43.32b
ブログエディタ Writerを導入

ブログエディタ Windows Live Writerをインストールし

→もっと見る

PAGE TOP ↑