cocos2d-x 3.0(beta)を使ってみる(導入編)

最新情報

新たにcocos2d-x ver3.0正式版導入に関する記事を記載しました。
下部リンクよりご覧頂けますです。

cocos2d-x 3.0 Final(正式版、安定版)を使ってみる(導入編)

ごあいさつ

こんにちは。OBAKESAN.netの管理人もっさんです。
cocos2d-x。それはマルチプラットフォームに対応した、オープンソースのゲームエンジン／フレームワークです。
今回私はcocos2d-x ver2.2.2で開発をしていたのですが、ver3.0からはC++11準拠になったこともあり、機能アップや開発効率が上がりそうなことも含め、今のうちにVer3.0に移行したいなと考えていました。

というわけで。今回はVer3.0betaでのプロジェクト作成について行った事を記載していこうと思います。
移行完了から逆にたどって書いていますため、間違いなどがあったらコメントなどで補完頂けますと幸いです。
ちなみにMacでの環境構築についてです。Windowsについてではありませんので、ご容赦を。

※個人的にはVer2系とVer3系はEclipseの開発環境も分けたほうが良いと思いますため、すでにVer２系の開発環境があるひとも、新たに手順B-1から行うほうが良いかもしれません。
※Androidの実機を持っているという前提で書いてます。そのためAndroidエミュレーターなどについては割愛します。
※今後のバージョンアップにより導入方法は変わる可能性が多いにあります。まず変わると思います。
※その他、cocos2d-xに関することでしたら、cocos2d-x タグよりどうぞです。

目次：

A-1:iOS用の環境を構築する(Xcode)
A-2:cocos2d-xをダウンロードする。
A-3:cocos2d-xのプロジェクトの生成を行う
A-4:Xcodeで開き、編集する

B-1:Android用環境を構築する。(ADTダウンロード)
B-2:Android用環境を構築する。(NDKダウンロード)
B-3:コーヒータイム。Android実機の開発者用設定を行う。
B-4:パスを通す
B-5:Eclipseの設定を行う
B-6:libcocos2dxのインポートと設定
B-7:自分のプロジェクトをインポートする

A-1:iOS用の環境を構築する(Xcode)

Dock、もしくはLanchpadから[App Store]というアプリケーションを開きます。
右上の検索ボックスから、[Xcode]と入力してretuenキーを押します。
すると一覧がでてきますので、Xcodeを選んでインストールしましょう。
アカウント作成などについては省略します。Apple ID持ってない人はつくりましょー。

A-2:cocos2d-xをダウンロードする。

まずは、www.cocos2d-x.org/downloadより、cocos2d-xをダウンロードしましょう。
cocos2d-xの下の、[Download v3.0]というのがそうです。現在(この記事の)バージョンだと、3.0betaですね。


ダウンロードしたファイル[cocos2d-x-3.0beta.zip]をダブルクリックすると解凍されると思います。
解答されたフォルダ[cocos2d-x-3.0beta]の中を見てみましょう。


こんな感じかと思われます。
これをフォルダにコピーします。
私は、DropBoxの中にcocos本体ごとコピーしているので、
/DropBoxIn/Dropbox/cocos2d-x/cocos2d-x-3
の中にいれました。このあたりは各自の設定にお合わせください。

A-3:cocos2d-xのプロジェクトの生成を行う

※ver２系とちがって、プロジェクトを生成した時に、cocos本体もプロジェクト内に含まれるようになりました。
そのため、プロジェクトはcocosフォルダ意外の所に生成してもOKだと思います。
が、ここではver２系と同じく、cocosフォルダ内に[projects]というフォルダを作り、その中にプロジェクトを生成していこうと思います。

項目５で作成された(cocos2d-xをコピーしたフォルダ)
/DropBoxIn/Dropbox/cocos2d-x/cocos2d-x-3
内の、
tools/project-creator/
内の、
create_project.py
を実行する・・・んですが、そのままダブルクリックしても動かないかもしれません。
create_project.pyの上で右クリック(タッチパッドなら、二本指でクリック)して、
このアプリケーションで開く→アプリケーション→ユーティリティ→ターミナル　を選びます。


cocoscreatprojectなるものが開きます。
※ちなみにこのcocoscreateprojectならアプリケーション、3.0alpha以前には無かったようです。便利になりました。

ProjectNameにプロジェクト名(もちろん英語)を、
PackageNameにパッケージ名を入れます。自分のドメインを逆にたどっていくので、私(OBAKESAN.net)の場合は
net.obakesan.AppName とかになります。AppNameにプロジェクト名でよろしいかと。

今回は、
プロジェクト名:TestProject
パッケージ名:com.example.TestProject

にしました。
最後にプロジェクトの場所を決めます。

Ver3.0betaはcocos2d-x本体もプロジェクトファイル内に含むようになったようですが、ここではVer2系と同じく、
cocos2d-x本体フォルダに[projects]というフォルダをつくり、その中に入れることにしました。

すると、こんなかんじに。

createボタンを押して、プロジェクトを作成します。

A-4:Xcodeで開き、編集する

プロジェクトフォルダ内の、[proj.ios_mac]を開きます。
その中にある[プロジェクト名].xcodeproj をダブルクリック。
編集したり実行したり。

HAPPY END!

※開かない場合には、Xcodeのインストールを終えたかを、もう一度確認してみてください。

B-1:Android用環境を構築する。(ADTダウンロード)

http://developer.android.com/sdk/index.htmlより、Android開発環境をダウンロードします。
解答すると中に[eclipse]、[sdk]の２つのフォルダがあると思います。
これをMacのフォルダに入れるわけですが、今回はルート(HDDのトップ)に[Android_Cocos3]というフォルダを作って入れました。

B-2:Android用環境を構築する。(NDKダウンロード)

続いてNDKをダウンロードします。
http://developer.android.com/tools/sdk/ndk/index.htmlから、リスト内の[Mac OS X 64-bit]のものを選んでダウンロードしましょう。この記事を記載している時だと、[android-ndk-r9c-darwin-x86_64.tar.bz2]ですね。
解凍して、項目２で作成した[Android_Cocos3]のフォルダに入れましょう。
B-1と合わせて、こんなかんじになったかと思います。

B-3:コーヒータイム。Android実機の開発者用設定を行う。

今回はAndroidの実機をもっているという前提で書いています。まだ持っていない方は、Nexus7 2013などいかがでしょう。私はとても気に入っています。
開発者用設定を行うには、以下の検索結果に表示された方法で行えるかと思えます。
Android 開発者設定 での検索結果

B-4:パスを通す

パスってなにさ。パスって大事なものさ。それってなにさ。パス通さないとMacがどこに大事なものがあるのかわからないのさ。
ということで、パスを通します。
パスを通すには、本体の.bash_profileというものを設定しなければなりません。

こちらのURLの情報を参考にさせて頂きました。
hisasann.com：Mac OS Xで環境変数にPATHを追加する方法
YOMiTOKU：macで.bash_profileの場所が見つからないときは
KOBAブロ：macでのcocos2d-x環境構築手順
ありがとうございますです。

今回の場合ですと、.bash_profileの内容はこんなかんじでしょうか。
わたしの場合は、作成された.bash_profileの中に直接テキストエディッタで記載しました。
------------------------
#Android NDK PATH
ANDROID_NDK=/Android_Cocos3/android-ndk-r9c
export PATH=$PATH:${ANDROID_NDK}

#Android SDK PATH
ANDROID_SDK=/Android_Cocos3/sdk
export PATH=$PATH:${ANDROID_SDK}

export NDK_ROOT="$ANDROID_NDK"
------------------------

なおbash_profileを反映させるのを忘れずに。
ターミナルから
source ~/.bash_profile
でござんす。

B-5:Eclipseの設定を行う

疲れてきたかと思います。でもAndoridでの実行するためには、まだやることがあります；がんばっていきましょー。

なお、ここで注意点ですが、私はEclipseを英語版のまま使っているので、この先も英語版のUI名でご説明致します。

項目２で作ったフォルダ[Android_Cocos3]の中の、[eclipse]フォルダの中の、Eclipse.appを開きましょう。
Eclipseが起動します。最初にWorkspaceフォルダを決めろと言われますので、どこかにフォルダをつくって、そこを指定しましょう。
・・・えっ、どこでもいいのっ　と思われましたか。cocosのフォルダがそこにないといけないわけではないので、ご自分の好きなところでよろしいかと思うのです。

続いて、Eclipseの設定を行います。
設定は、こちらの記事を参考にしました。
メモブログ:Android/iOSアプリ開発 環境構築編その３

Macの場合は、左上のメニューから[ADT]をクリックし、
[環境設定]→[General]→[Workspace]→右三角をクリックして[Linked Resources]
右項目内の[New]ボタンを押します。


今回の場合は、
Location:
[/DropBoxIn/Dropbox/cocos2d-x/cocos2d-x-3]

Name:
参考にさせて頂いた記事と同じく、
[COCOS2DX]にしました。


その後も記事と同じく、
メニュー左上[ADT]→[環境設定]→[C/C++]→[Build]→[Environment]より、
[Add]ボタンを押して、Andoid NDKのフォルダを指定します。
記事に合わせて今回の場合だと、

Value:
Android_Cocos3/android-ndk-r9c

Valiable:
NDK_ROOT

ですね。今回は手動で入力する必要があります。フォルダを選んで自動入力はしてくれません。


続いて、Android SDK Managerを起動します。
上のメニューから、[Window]→[Android SDK Manager]で起動します。
Android SDK　Managerにつきましては、
Java Drive：Android SDKのダウンロードとインストール
の、[SDKマネージャーを使ったライブラリのインストール]からが参考になります。

上記記事とおなじく、私は
「Android 4.0.3(API 15)」「Android 2.3.3(API 10)」
のSDKをインストールしました。
インストール後は、Eclipseを再起動しましょう。

B-6:libcocos2dxのインポートと設定

続いてlibcocos2dxというものをインポートすることになります。

インポートの仕方は、左上メニューから
[File]→[New]→[Project]→[Android]→[Android Project from Exisiting Code]
その後、右上の[Browse]で、cocos2d-x本体フォルダ[cocos2d-x-3]内の
[cocos]→[2d]→[platform]→[android]を指定します。
※なお、Copy projects into workspace にはチェックは入れません。

こんな感じになりましたでしょうか。

初期状態だと文字コードがSHIFT_JISになっているかもしれません。

インポートされたlibcocos2dxの上で右クリックして、[Properties]を選びます。
Text File EncodingをUTF-8にします、こんなかんじに。

B-7:自分のプロジェクトをインポートする

続いて、自分のプロジェクトをインポートするのですが、その前にやることがあります。
まずは、Android.mkを編集します。
このAndroid.mkですが、「このプロジェクトにはこんなファイルがあるんですよー」というようなインデックスの役目を果たします。

この中に一つ一つ自分で追加したものを手作業で追加してもよいのですが、
しすぜろ:Cocos2d-xで新しく作ったクラスを毎回Android.mkに追加せずに済ます
こちらの方の記事を参考にすると、とても楽にできます。素晴らしき！

私は上記記事を参考に、こんな形になりました。


A-3でcreate_project.pyを実行した要領で、
プロジェクト(TestProject)のフォルダ→[proj.android]内の、
build_native.py をターミナルで実行します。
これでEclipseで実行できる形になります。

ファイルが多い場合には、ある程度時間がかかると思います。

終わるまでの間、もう一杯コーヒーでもどうでしょう。
セブン-イレブンが近くにある人がうらやましい。
関係無いですねすいません。

libcocos2d-xをインポートした要領で、作成したプロジェクト[TestProject]フォルダ内の[proj.android]をインポートします。
ついでに同じく、SHIFT_JISからUTF-8にしましょう。
こちらも、Copy projects into workspaceにチェックは入れずにFinishボタンを押します。

B-8:うーん？

インポートしたプロジェクトにエラーがつくかもしれません。インポートした自分のプロジェクト(TestProject)の上で右クリック、[Properties]→[Android]を見てみます。
Referenceの所にエラーがついていました。

この場合、まずバツ印を選択してから、右の[Remove]を押してこれを消します。
その次に、右の[Add]ボタンを押して、libcocos2dxを選択。
無事エラーが消えました。
続いて、上の所にあるTargetNameを私は4.0(API 15)に選択しました。

B-9:実行してテストしてみる。

あとは、Android実機(開発者用設定済み)をつなぎ、自分のプロジェクトの上で右クリック→[Run As]→[Android Application]で実行です。
おつかれさまでした。

iOS(Xcode)で動かすのは楽なのに、Androidのほうはえらい大変だったと思います；
もしつまったら、一からやり直していくのも手かも。
Android開発に慣れている人のほうが、Eclipseの設定は楽でしょうね。


次の記事もcocos2d-x3.0 betaに関することの予定です。
それではまた次回にお会いしませう。