Android
MacOSX
iOS
cocos2d-x

Mac OS X 10.9でCocos2d-x 3.2の環境構築

More than 3 years have passed since last update.


はじめに

なんだかんだでやっぱりメジャーなのがいいだろうってことで、cocos2d-xをやってみることにしました。

cocos2d-x 3.2の環境構築から、iOSとAndroidのエミュレータで初期状態のアプリを動かすところまでやってみます。


Cocos2d-x 3.2インストール


Xcodeインストール

iOS向けのビルドでXcodeが必要になるので、App Storeからインストールします。

また、インストールが終わったら一度起動してActivateしておく必要があります。


Javaインストール

Javaがインストールされていなければ、Javaをインストールします。


http://www.oracle.com/technetwork/java/javase/downloads/index.html


対応バージョンはこちらをみてください。


http://developer.android.com/tools/sdk/eclipse-adt.html


$ java -version

java version "1.7.0_67"
Java(TM) SE Runtime Environment (build 1.7.0_67-b01)
Java HotSpot(TM) 64-Bit Server VM (build 24.65-b04, mixed mode)

antもインストールしておきます。

$ brew install ant

$ ant -version
Apache Ant(TM) version 1.9.4 compiled on April 29 2014


cocos2d-xダウンロード

公式サイトからダウンロードして解凍します。

今回は~/optディレクトリに展開します。


http://cocos2d-x.org/download


$ mkdir ~/opt

$ cd ~/opt
$ wget http://www.cocos2d-x.org/filedown/cocos2d-x-3.2.zip
$ unzip cocos2d-x-3.2.zip


Android SDKダウンロード

AndroidのSDKをダウンロードします。


https://developer.android.com/sdk/index.html


~/optディレクトリに展開します。

$ unzip ~/Downloads/adt-bundle-mac-x86_64-20140702.zip -d ~/opt


Android NDKダウンロード

NDKもダウンロードして展開します。


https://developer.android.com/tools/sdk/ndk/index.html


現在の最新版はr10ですが、r10だとAndroid向けにビルドするとコンパイルエラーとなります。

そのため、r9dをインストールします。


http://www.cocos2d-x.org/news/307


$ wget https://dl.google.com/android/ndk/android-ndk-r9d-darwin-x86_64.tar.bz2

$ tar zxvf android-ndk32-r9d-darwin-x86_64.tar.bz2


cocos2d-xセットアップ

cocos2d-xに付属しているsetup.pyで、環境変数などの設定ができます。

$ cd cocos2d-x-3.2

$ ./setup.py
...
->Please enter the path of NDK_ROOT (or press Enter to skip):/Users/nownabe/opt/android-ndk-r9d
...
->Please enter the path of ANDROID_SDK_ROOT (or press Enter to skip):/Users/nownabe/opt/adt-bundle-mac-x86_64-20140702/sdk
...

コマンド実行後、~/.zshrc(~/.bashrc)を見ると環境変数が追加されているのがわかります。

$ tail -20 ~/.zshrc

alias mv='mv -i'

alias mkdir='mkdir -p'

# Add environment variable COCOS_CONSOLE_ROOT for cocos2d-x
export COCOS_CONSOLE_ROOT=/Users/nownabe/opt/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=/Users/nownabe/opt/android-ndk-r10
export PATH=$NDK_ROOT:$PATH

# Add environment variable ANDROID_SDK_ROOT for cocos2d-x
export ANDROID_SDK_ROOT=/Users/nownabe/opt/adt-bundle-mac-x86_64-20140702/sdk
export PATH=$ANDROID_SDK_ROOT:$PATH
export PATH=$ANDROID_SDK_ROOT/tools:$ANDROID_SDK_ROOT/platform-tools:$PATH

# Add environment variable ANT_ROOT for cocos2d-x
export ANT_ROOT=/usr/local/Cellar/ant/1.9.4/libexec/bin
export PATH=$ANT_ROOT:$PATH

変更を反映させます。

$ source ~/.zshrc


動かしてみる

実際にcocosのプロジェクトを作成し、エミュレータで動かしてみます。


プロジェクト作成

cocos newコマンドで作成することができます。

早速HelloCocosというプロジェクトを作成してみます。

$ cocos new HelloCocos -p com.nownabe.HelloCocos -l cpp -d ~/projects

-pオプションはプロジェクトを示すパッケージ名です。

-lオプションで、使用する言語を選択します。cpp(C言語)、lua、jsが選択できます。

-dはプロジェクトディレクトリの作成先です。

ディレクトリの構造はこのようになってます。

$ tree ~/projects/HelloCocos -L 1

/Users/nownabe/projects/HelloCocos
├── CMakeLists.txt
├── Classes
├── Resources
├── cocos2d
├── proj.android
├── proj.ios_mac
├── proj.linux
├── proj.win32
└── proj.wp8-xaml

cocos2dはcocos2d-xのコード群本体ですね。

プラットフォーム共通となるのが、ゲームのソースコードを入れるClassesと、画像なんかを入れるResourcesの2つみたいです。

その他は、ディレクトリ名から見てわかるように各プラットフォームのディレクトリです。


iOSエミュレータで起動

では、いよいよエミュレータでゲーム?を動かしてみます。

プロジェクトのビルドからエミュレータの起動までも非常に楽なもので、コマンド一発でできるようになってます。

$ cd ~/projects/HelloCocos

$ cocos run -p ios

スクリーンショット 2014-08-16 22.23.12.png

ひじょーに楽です。素晴らしい。


Androidエミュレータで起動

次はAndroidエミュレータで起動してみましょう。

2系の時はAndroidで動かすのは大変だったらしいですが、こちらもコマンド一発で起動できるようになってるみたいです。

素晴らしいですね。

$ cocos run -p android

...
...
building apk
Android platform not specified, searching a default one...
Can't find right android-platform for project : "/Users/nownabe/projects/HelloCocos/proj.android". The android-platform should be equal/larger than 10

一発でできませんでした。。。

なんかいろいろとしないといけないようです。

Android SDKでエミュレータはAVD(Android Virtual Device)っていう単位で管理されています。

androidコマンドとかemulatorコマンドのヘルプとかエラーメッセージを眺めるとなんとなくわかったような気になれます。

まず、ABIというエミュレータのイメージっぽいものをインストールする必要があります。

次のコマンドでAndroid SDK Managerというものを立ち上げます。

$ android

とりあえず、Android 4.4.2のイメージをインストールしてみます。

Android 4.4.2 (API19)の中にある、ARM EABI v7a System Imageにチェックをいれて、Install 1 Package...ボタンをクリックしましょう。

Acceptしてほしそうな画面が出てきたら、Acceptしてあげてください。

インストールが完了したら、次のコマンドで確認してください。

`Tag/ABIs : default/armeavi-v7aとなっていればOKです。

$ android list target

Available Android targets:
----------
id: 1 or "android-19"
Name: Android 4.4.2
Type: Platform
API level: 19
Revision: 3
Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in
Tag/ABIs : default/armeabi-v7a

次に、エミュレータを作成します。

GPUエミュレータを有効化する必要があるので、hardware profileをカスタムしましょう。

GPU emulation以外の項目は怒涛の空EnterでOKです。

$ android create avd -n cocos -t 1

Auto-selecting single ABI armeabi-v7a
Android 4.4.2 is a basic Android platform.
Do you wish to create a custom hardware profile [no]yes
...
DPad support: Whether the device has DPad keys
hw.dPad [yes]:

GPS support: Whether there is a GPS in the device.
hw.gps [yes]:

GPU emulation: Enable/Disable emulated OpenGLES GPU
hw.gpu.enabled [no]:yes

GSM modem support: Whether there is a GSM modem in the device.
hw.gsmModem [yes]:

Keyboard support: Whether the device has a QWERTY keyboard.
hw.keyboard [no]:
...

エミュレータを起動します。

$ emulator -avd cocos

初回起動時はしばらく時間がかかるみたいです。

ホーム画面が表示されるまで待ちます。

さて、もう一度cocos runを実行してみましょう。

$ cocos run -p android --ap 19

いかがでしょうか。

うまく行けば、こんな感じで表示されると思います。

スクリーンショット 2014-08-17 0.32.23.png

どうやって横表示するんでしょうかw


おわりに

Androidに意外と苦戦してしまいました。

いくらクロスプラットフォーム対応とはいえ、iOSとAndroid両方対応させるにはなかなか苦労しそうです。