cocos2d-x 3.2 環境構築ガイド:OBAKESAN.net｜オバケサン

cocos2d-x 3.2 環境構築ガイド ごあいさつ

こんにちは。OBAKESAN.net 管理人もっさんです。

マルチプラットフォームに対応した、オープンソースのゲームエンジン／フレームワーク cocos2d-x。

気がついたら、ver3.2が出ていました。なにやら今度は3Dにも対応だそうですよ。

しかし、残念ながらまたちょっとセットアップ方法に変更があったようです。

ということで、3.2セットアップ(

)ガイドを書いていこうと思います。今度は

での

の設定方法も合わせて記載していきますですよー。

ちなみに今回もMacでのお話です。Windowsはまた違った設定方法になりますので、ご了承くださいです。

そのほか、cocos2d-xに関する他の記事は、cocos2d-x タグタグよりどうぞ。

「ここがわかりにくかった」などあれば、コメント頂ければその箇所は空いた時間などに補完するかもです。

夏（この記事を書いている時）でじつに暑い日々ですが、がんばっていきましょー。

以下は目次でございますです。

目次：

・Standby-000:フォルダ構成一覧

・iOS-001:iOS用の環境を構築する(Xcode)

・Android-001:Android実機の開発者用設定を行う。

・Etc-001:更新履歴

Standby-000:フォルダ構成一覧

とりあえず先に、今回のフォルダ構成についてご説明します。

こんな感じで作っていこうと思います。

cocos2d-x本体

/DropBoxIn/Dropbox/cocos2d-x/cocos2d-x-3.2

AndroidADT

/Android_Cocos3/eclipse

/Android_Cocos3/sdk

AndroidNDK

プロジェクトフォルダ

それでは、まずcocos2d-xのダウンロード・設定を行おうと思います。次にお進みくださいです。

Standby-001:cocos2d-xをダウンロードする

まずは、www.cocos2d-x.org/download/version#Cocos2d-xより、cocos2d-xをダウンロードしましょう。

今回使うのは3.2正式版のため、v3.2をクリックしてダウンロードします。下記画像をご参考ください。

ダウンロードしたファイル[cocos2d-x-3.2.zip]をダブルクリックすると解凍されると思います。

解答されたフォルダ[

-3.2]の中を見てみましょう。

こんな感じかと思われます。

これを、フォルダにコピーします。

私は、DropBoxの中にcocos本体ごとコピーしているので、

/DropBoxIn/Dropbox/

/

-3.2

の中にいれました。今後はこれを前提に記載していきます。

Standby-002:Standby-002:Android ADTをダウンロードする

先に、Android版作成に必要となるADTをダウンロード・セットアップしようと思います。

面倒くさいと思うかもしれません。でも、ここは頑張ってやっていきましょー。

まずは、Android ADT(Eclipseセット)のダウンロードを行いましょう。

・・・なのですが、Googleは新しい開発環境「

Studio」を広めたいらしく、公式ページからEclipseセットのダウンロードができなくなってしまいました。

そこで、dl.google.comのページからダウンロードすることにします。

Mac版は、

からダウンロード可能です。

※なお、上記ダウンロードサイトへのリンクは、[cocos2d-xではじめるスマートフォンゲーム開発　[cocos2d-x Ver.3対応]　for iOS/Android]のサポートページより参考にしました。

上記の本の

には、Windows版

ADT(Eclipseセット)のリンクもあります。私もこの本、購入しましたですよー。

さて！ダウンロードが終わりましたら、ファイルを解凍しましょう。Macでしたらダブルクリックでそのままファイルが解凍できると思います。

解答すると中に[eclipse]、[sdk]の２つのフォルダがあると思います。

これをMacのフォルダに入れるわけですが、今回はルート(HDDのトップ)に[

_Cocos3]というフォルダを作って入れました。

その結果、以下のような感じになりました。

続きまして、NDKのダウンロードに進んでいきます。

Standby-003:Android NDKをダウンロードする

続いてNDKをダウンロードします。

3.2は、NDKならどのバージョンでも良いということではないようです。（修正されるらしいですが）

幸い android-ndk-r9d-darwin-x86_64.tar.bz2 が対応していますので、下記URLよりダウンロードします。

項目２で作成した[Android_Cocos3]の中に[ndk]フォルダをつくり、[android-ndk-r9d-darwin-x86_64.tar.bz2]を解凍しな中身をそこにコピーします。

Standby-002の内容と合わせて、こんなかんじになったかと思います。

続いてセットアップ、がんばりましょー。

Standby-004:cocos2d-xのsetupを行う(setup.py)

続いて、cocos2d-xのセットアップを行います。

まず、

をコピーしたフォルダ(今回は [/DropBoxIn/Dropbox/

/

-3.2])の中の、[setup.py]を実行することになります。

実行の方法ですが、そのままダブルクリックしても起動しないと思いますため、[setup.py]の上で右クリックし、

この

ケーションで開く→

ケーション→ユーティリティ→ターミナル

でターミナルより起動します。下記画像をご参考ください。

セットアッププログラムが起動したと思います。

まず、ANDROID_NDK_ROOTどこさ？と聞かれます。

今回の場合ですが、NDKのフォルダは[/Android_Cocos3/ndk]ですので、そう入力してエンターキーを押します。

続いて、ANDROID_SDK_ROOTどこさ？と聞かれます。

今回の記事の場合ですと、[/Android_Cocos3/sdk]ですので、そう入力しエンターキーを押します。

最後にANT_ROOTどこさ？と聞かれますが、これはそのままエンターでスキップしてOKです

上記が終わると、

Please execute command: "source /Users/[自分のユーザー名]/.bash_profile" to make added system variables take effect

logout

[プロセスが完了しました]

と表示されます。確認しましたら、一旦ターミナルは終了します。

自分のユーザーフォルダ(/Users/[自分のユーザ名])に.bash_profileというファイルが作成されたと思います。

なお、隠しファイルなのでそのままでは見えないかも。

※余談ですが、開発関連では隠しファイルを表示していたほうが便利なので、表示するように設定を変更すると後々便利だと思います。

表示の仕方は、

新たに アプリケーション→ユーティリティ→ターミナル でターミナルを開きます。

今後もターミナルはよく使うので、Dockに登録しておくと便利ではないかと。

.bash_profileを実行します。

ターミナルより、

source /Users/[あなたのユーザー名]/.bash_profile

と入力してエンターキーを押します。もちろん、[あなたのユーザー名]のところには貴方のユーザー名を入れます。ユーザー名はターミナルを起動すれば表示されていると思います。

これでパスが通ります。

次はプロジェクトの作成に入ります。ごめんなさい、またターミナル使います。

続いてがんばっていきましょー。

Standby-005:プロジェクトを作成する

※この項目は、jiroshinoさんの記事Cocos2d-x v3.0の使い方 を参考にしました。

ここまで大変お疲れ様でした。いよいよプロジェクトの作成に入ります。

まず先に、プロジェクトを入れるフォルダを作りましょう。

ここでは、ルートに[myprojects]というフォルダに入れると仮定します。先にFinderなどでご作成ください。

ターミナルをまた起動してください。

と入力しエンターを押します。フォルダが作られていれば、その中に入ります。続けて、

cocos new [あなたのプロジェクト名] -p [あなたのドメイン名を逆に].[あなたのプロジェクト名] -l cpp

といった形で入力します。例でいうと、

cocos new TestProject -p com.exsample.TestProject -l cpp

といったような感じです。私の場合ですとドメインが obakesan.netなので、

cocos new TestProject -p net.obakesan.TestProject -l cpp

という形になります。わたしドメインもってないよ！？という人は、今後のホームページ開設のことも兼ねて取得してこられるとよいかもかも。

そのあたりは別の話になるので割愛します。とりあえずテストで作るのであれば、[com.exsample.TestProject]でよろしいかと。

入力しエンターキーを押すと、プロジェクトがフォルダに作成されます。

今回の記事では、上記の通りプロジェクトフォルダ [/myprojects/TestProject]内のプロジェクトとして話を進めていきます。

cocos newの時点で命令が実行できない場合には、パスの設定がちゃんとできたかどうかを見直しましょう。

次の項目からは、iOS編とAndroid編に分かれます。

ここらで一呼吸おいて、次へすすみましょー。

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

Dock、もしくはLanchpadから[App Store]というアプリケーションを開きます。

右上の検索ボックスから、[

]と入力してretuenキーを押します。

すると一覧がでてきますので、

を選んで

しましょう。

アカウント作成などについては省略します。Apple ID持ってない人はつくりましょー。

iOS-002:Xcodeで開き、編集する

プロジェクトフォルダ[/myprojects/TestProject]内の、[proj.ios_mac]を開きます。

その中にある[プロジェクト名].xcodeproj をダブルクリック。

これで

で

プロジェクトが開きます。

試しに実行してみると、こんな形に表示されると思います。お疲れ様でした。

続けて、Xcodeでのビルド時間を短縮する作業を行おうと思います。

iOS-003:cocos2d-xのビルドの時間を短縮する

これは必須項目ではありません。やりたい方のみで大丈夫です。

cocos2d-xですが、ver3.0になってから標準時のファイルが多くなったためか、ビルドの時間がver2系よりも長くなったように感じます。

そのため、

でビルド時間を短縮する為の設定を行おうと思います。

dSYMを無効化する

※この項目は、#junki::acousticさんの記事

を参考に致しました。

デバッグリポート時に使用するdSYM作成を無効化してスピードアップします。

なお、

をAppleStoreに送信する際は、こちらを有効化に戻してからビルドしてください。そうしないと、Appleからエラーリポートが来ても照らし合わせができません；

まずは、左上のプロジェクト名のところをクリックします。現在選択されているところですね。

続いて右側TARGETS一覧の、[プロジェクト名] iOS となっているところを選択します。

続いて、右上の検索欄に[Debug Information Format]と入力します。

そうしますと、Build Optionsに[Debug Information Format]が出ますため、項目を[DWARF]にします。ドワーフ！

下記画像をご参考ください。

うまくいきましたでしょうか？次は[Find Implicit Dependencies]の設定方法です。

[Find Implicit Dependencies]設定を行う

※この項目は、hirobeさんの記事CocoaPodsのビルドをスキップするを参考に致しました。

こちらも、アプリをAppStoreに出す時には、設定を元に戻してからビルドしたほうが良いと思います。

Xcodeで、Find Implicit Dependenciesの設定を行います。

まずは、

画面左上のプロジェクト名を右クリック(タッチパッドの人は、日本指でクリック)。

続いて、[Edit scheme]を選びます。

[Find Implicit Dependencies]のチェックを外す。そのあと、右下の[OK]を押す。

続きまして、Gitの設定を行おうと思います。

iOS-004:Gitの設定を行う

これは必須項目ではありません。やりたい方のみで大丈夫です。

※この項目は、よく寝てちょっと食べる(laynts)さんの

を参考にしました。

cocos2d-xで開発していて、こんな経験はないでしょうか。

いじる。→実行しようとする→エラー発生→いろいろ元に戻すが全然消えない→Mac Linker Errorは消えず、鎮座したままだ→もうだめだ。

Gitを使えば、これまでの工程を見なおしたり、元に戻したり、あらたな経路を作成することも可能です。

多人数開発でなくとも、その恩恵は大きいものではないかと。

ここでは

そのものについて細かく解説はしませんが、今回作成したプロジェクトに

を設定する方法を記載しようと思います。

さて。今回の例でいえば、プロジェクトは、

/myprojects/TestProject/ に作成されていると思います。

ターミナルを開き、

cd /myprojects/TestProject/Classes

と入力し、エンターを押しましょう。これでカレントフォルダ(今いるフォルダ)が/myprojects/TestProject/Classes に移動します。

続けて、

git init

git add .

git commit -m "TestProjectClasses commit"

([TestProjectClasses]の部分はお好きな名前でどうぞです)

と入力します。各行でエンターキーを押すこともお忘れなく。

あとは

を再起動すれば、上部メニューの[Source Control]から

が使えます。とりあえずCommitしてみてはいかがでしょう。

開発が進むにつれバージョン管理はややこしくなるので、

を使ってわかりやすくしておきたいものです。

ちなみに、広告などでiOS機能部分も使う場合は、

同じように proj.ios_mac/ios も追加しておくと良いかもしれません。

さて！次はAndroid環境構築にすすみます。ここらでコーヒーでも飲んで一休みして、続けてがんばりましょー。

Android-001:Android実機の開発者用設定を行う。

Android用設定を行う前に、実機の開発者用設定を行いましょう。

開発者用モードに入らないと、実機でのテストができません。

モードに入るための方法は、

のバージョンによって違います。

今回はAndroidの実機をもっているという前提で書いていますが、まだ持っていない方は、Nexus7 2013などいかがでしょう。私はとても気に入っています。

開発者用設定を行うには、以下の検索結果に表示された方法で行えるかと思えます。

Android-002:Eclipseの設定を行う

cocos2d-xでAndroid用開発を行うためには、Eclipseを使います。新たにcocos IDEというものもできたそうですが、ここでは一緒にダウンロードしてきたEclipseで解説致します。

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

Standby-002の通りに行っている場合、[Android_Cocos3]　フォルダの中に、[eclipse]というフォルダが有ると思います。

その中の[Eclipse.app]を開きましょう。

Eclipseが起動します。最初にWorkspaceフォルダを決めろと言われますので、どこかにフォルダをつくって、そこを指定しましょう。

・・・えっ、どこでもいいのっ　と思われましたか。cocosのフォルダがそこにないといけないわけではないので、ご自分の好きなところでよろしいかと思うのです。

続いて、Eclipseの設定を行います。

なお設定は、こちらの記事を参考にしています。

Macの場合は、左上のメニューから[ADT]をクリックし、

[環境設定]→[General]→[Workspace]→右三角をクリックして[Linked Resources]

右項目内の[New]ボタンを押します。

今回の場合は、

Name:

COCOS2DX

Location:

/DropBoxIn/Dropbox/

/

-3.2

にしました

その後も記事と同じく、

メニュー左上[ADT]→[環境設定]→[C/C++]→[Build]→[Environment]より、

[Add]ボタンを押して、Andoid NDKのフォルダを指定します。

記事に合わせて今回の場合だと、

Name:

NDK_ROOT

Value:

_Cocos3/ndk

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

続いて、Android SDK Managerを起動します。

上のメニューから、[Window]→[

SDK Manager]で起動します。

SDK　Managerにつきましては、

の、[SDKマネージャーを使ったライブラリの

]からが参考になります。

上記記事とおなじく、私は

「

4.0.3(API 15)」「

2.3.3(API 10)」

のSDKを

しました。

後は、Eclipseを再起動しましょう。

libcocos2dx、libContorollerManualAdapter、google_play_service_libのインポートと設定

続いて

・libcocos2dx

・libContorollerManualAdapter

・google_play_service_lib

をインポート・設定しようと思います。

まずは libcocos2dxとlibContorollerManualAdapterをインポートしてみましょう。

インポートの仕方は、Eclipseの左上メニューから

[File]→[New]→[Project]→[

]→[

Project from Exisiting Code]

その後、右上の[Browse]で、cocos2d-x本体フォルダ[cocos2d-x-3.2]内の

[cocos]→[platform]→[android]を指定します。

(/DropBoxIn/Dropbox/

/

-3.2/cocos/platform/android)

※なお、Copy projects into workspace にはチェックは入れません。

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

続いて、google_play_service_libをインポートします。

同じようにEclipseの左上メニューから

[File]→[New]→[Project]→[

]→[

Project from Exisiting Code] を選び、

今度は

[

_Cocos3]→[sdk]→[extras]→[google]→[google_play_services]→[libproject]→[google-play-services_lib]

(/

_Cocos3/sdk/extras/google/google_play_services/libproject/google-play-services_lib)

を指定してインポートします。同じくCopy projects into workspace にはチェックは入れません。

以下の様になったと思います。

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

とりあえず最初にインポートされたlibcocos2dxの上で右クリックして、[Properties]を選びます。

インポートされたlibcocos2dxの上で右クリックして、[Properties]を選びます。

[Text File Encoding]をUTF-8にします、こんなかんじに。

同じように、

・libcocos2dx

・libContorollerManualAdapter

・google_play_service_lib

の3つともUTF-8にしましょう。プロパティにはなんだか一杯項目があってドキドキしますが、落ち着いてやっていきましょう。失敗してもまたやり直せばOKOK。

さて！次はいよいよ自分のプロジェクトをインポートしていこうと思います。

Android-004:自分のプロジェクトをインポートし、Android.mkを編集する

自分のプロジェクトをインポートするのですが、その前にやることがあります。

まずは、

.mkというものを編集します。

.mkは、プロジェクトフォルダ(/myprojects/TestProject)内の[proj.android/jni/

.mk]にあります。テキストエディッタなどで開きましょう。

このAndroid.mkですが、「このプロジェクトにはこんなファイルがあるんですよー」というようなインデックスの役目を果たします。

この中に一つ一つ自分で追加したものを手作業で追加してもよいのですが、はっきりいって大変です。

特に

で作成していく場合、

でのフォルダ構成はそのままだと維持できないため、平たくファイルを作っていくとバージョンアップ時などにえらい苦労することにもなりかねません。

そこで！Classesのフォルダ構成を参照できるよう、前回とは違って新たに いちおくまんえんさんの記事

を参考に、以下のように変更しました。

LOCAL_PATH := $(call my-dir)
include $(CLEAR_VARS)

$(call import-add-path,$(LOCAL_PATH)/../../cocos2d)

LOCAL_MODULE := cocos2dcpp_shared

# 追加分

# 旧

LOCAL_WHOLE_STATIC_LIBRARIES := cocos2dx_static

# LOCAL_WHOLE_STATIC_LIBRARIES += box2d_static

include $(BUILD_SHARED_LIBRARY)

# $(call import-module,Box2D)

この状態で保存します。Android.mkは保存後閉じてかまいません。

Stanby-004でsetup.pyを実行した要領で、

プロジェクト(TestProject)のフォルダ→[proj.android]内の、

build_native.py をターミナルで実行します。

これでEclipseで実行できる形になります。

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

終わるまでの間、もう一杯コーヒーでもどうでしょう。

セブン-イレブンが近くにある人がうらやましい。

関係無いですねすいません。

libcocos2d-xをインポートした要領で、作成したプロジェクト[TestProject]フォルダ内の[proj.android]をインポートします。

こちらも、Copy projects into workspaceにチェックは入れずにFinishボタンを押します。

こちらもlibcocos2dxの時と同じく、SHIFT_JISからUTF-8に設定しなおしましょう。

Android-005:Eclipseに追加したプロジェクトの補足作業

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

Referenceの所にエラーがついていました。

この場合、まずバツ印を選択してから、右の[Remove]を押してこれを消します。

その次に、右の[Add]ボタンを押して、libcocos2dxを選択。

無事エラーが消えました。

続いて、上の所にあるTargetNameを私は4.0(API 15)に選択しました。

Android-006:実行してテストしてみる

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

・・・おつかれさまでした。

こうやって見返してみると、結構長く感じるかもしれません。でも一回できれば、後はもう慣れると思います。

途中つまづきやすいのはNDK、SDKなどのパスを通す所ではないでしょうか。詰まったら1からやり直すのも手だと思います。

「ここがわかりにくかった」などあった場合には、コメント等で記載頂ければ開いた時間に補足するかもしれませんです。

それでは良き開発ライフをですです。素敵なアプリを楽しみにしてますですよー。

Etc-001:更新履歴

2015/03/03 AndroidADTのリンクを追加(公式DLページのファイルが、Android Studioになってしまったため)

2014/08/24 ファーストバージョン