Framework

クロスプラットフォームの新しい選択肢「cocos2dx」でスマートフォンアプリを開発！ -導入編

Posted on：: 2011.12.27

Posted by：: 田野哲也

Tag : :: Android,; cocos2dx,; Framework,; iPhone

はじめに

スマートフォンの普及が急速に進んできた昨今、AndroidとiPhoneのどちらにも対応したアプリの開発が求められるケースが増えてきました。一般的にはAndroidならJava、iPhoneならObjective-Cといったように、OS毎に異なるプログラム言語での開発を行う必要があり、それがコスト的にもスケジュール的にも開発者を悩ませる要因となっていました。その悩みを解決するための新しい選択肢として、ワンソースでマルチデバイス向けアプリの開発が可能となるフレームワーク「cocos2dx」をご紹介いたします。

cocos2dxとは？

iPhone(iOS)向けの2Dゲームが手軽に開発できることで多くの開発者に使用されているフレームワーク「cocos2d for iPhone」。それをAndroidやblackberryなどの他プラットフォームにも対応させたのが「cocos2dx」です。デバイス毎の微調整は必要にはなりますが、事実上ワンソースでの開発が可能となりました。「cocos2d for iPhone」はObjective-Cでの開発ですが、「cocos2dx」ではC++やLuaを使用して開発します。 http://www.cocos2d-x.org/

cocos2dxのインストール

今回はiPhoneとandroid向けのアプリ開発を行いますので、開発環境はMac OS Xを使用します。またXcode、Eclipse、Android SDK、Android NDKがインストールされていることを前提としています。

使用環境

Mac OS X 10.6.8
Xcode 3.2.5
Eclipse 3.7.1
Android SDK Revision 16
Android NDK Revision 7

まずはcocos2dxのサイトから本体をダウンロード。現時点での最新版にあたる「cocos2d-1.0.1-x-0.10.0」を使用します。

ダウンロードページ

http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Download

ダウンロードが完了したら、「cocos2d-1.0.1-x-0.10.0.zip」を解凍して任意のフォルダに格納します。今回はApplications配下に格納しました。

cocos2dxのインストールはこれで完了です。

各種設定

実際にアプリ開発をする前に、インストールしたcocos2dxを開発環境に合わせて設定変更をする必要があります。

Xcode用テンプレートのインストール

iPhone開発時に使用するテンプレートをXcodeで使用できるようにします。ターミナルを起動し、cocos2dxフォルダ配下にあるXcode用テンプレート展開シェル「install-templates-xcode.sh」を実行します。 Xcodeのインストール場所によっては、シェル内の設定変更が必要な場合もありますので実行前にファイルを開いて設定を確認しましょう。

設定が問題なければ実際にシェルを実行します。 (今回の環境では権限の問題からsudoをつけています。) Xcodeのバージョンを聞かれるので数値を入力。今回はXcode 3.2.5を使用しますので、「3」と入力しました。

done!と表示されれば展開完了です。

Xcodeを起動して「新規Xcodeプロジェクトを作成」を選択すると「User Templates」カテゴリ内に「cocos2d-1.0.1-x-0.10.0」が追加されています。

これでXcode用テンプレートのインストールは完了です。

Android SDK/NDKのパス設定

今度はAndroid用の設定です。ターミナルを起動し、cocos2dxフォルダ配下にあるAndroid用プロジェクト生成シェル「create-android-project.sh」を実行します。こちらもAndroid SDK/NDKのインストール場所によって、シェル内の設定変更が必要になります。今回使用する環境では下記のように設定しました。

設定を変更したら準備完了です。

プロジェクトの作成

Android用プロジェクト

実際にアプリを開発するためのプロジェクトを作成します。ターミナルを起動し、前項で設定変更をした「create-android-project.sh」を実行しましょう。最初にパッケージパスの入力を求められます。今回開発するアプリは「jp.mdlab.example」にしました。

続いてターゲットIDの入力です。 Androidの各バージョンと、それに対応する数値がIDとして表示されますので、作成するAndroidのバージョンに応じたIDを入力します。今回はAndroid2.1向けにするため、「1」を入力しました。

最後にプロジェクト名の入力です。プロジェクト名は「example」にしました。

上記3点の入力が完了するとプロジェクト作成処理が行われます。

cocos2dxフォルダ配下に「example」フォルダが作られました。中には下記のようにフォルダが3つ含まれています。

android:Android用アプリで使用する設定ファイルやリソース類が含まれます。 Classes:cocos2dxでの開発はこのClassesフォルダ内の*.cpp、*.hなどを編集します。 Resources:アプリで使用する各デバイス共通の画像などが含まれてます。

iPhone用プロジェクト

上記でAndroid用プロジェクトは作成できましたが、これだけではiPhone用アプリの開発はできませんので、別途iPhone用プロジェクトを作成する必要があります。 iPhone用プロジェクトの作成時、Android用プロジェクトと同じプロジェクト名にして先ほど作成したプロジェクトフォルダに上書きすると、共通のClassesファイルを使用したiPhone用/Android用それぞれのプロジェクトの作成をすることができます。共通のClassesファイルを使用することで、iPhone用とAndroid用アプリの同時開発が可能になります。

まずXcodeを起動して「新規Xcodeプロジェクトを作成」をクリック。

User Templates内の「cocos2d-1.0.1-x-0.10.0」を選択するとcocos2dx用のテンプレートが表示されますので、「cocos2d-x Application」を選択して「選択...」ボタンをクリック。

新規プロジェクト保存画面が表示されますので名前に「example」と入力し、cocos2d-1.0.1-x-0.10.0フォルダ内に保存します。

exampleプロジェクトは先ほどAndroid用プロジェクトとして作成しましたので、下記のようなアラートが表示されます。 Android用プロジェクトで作成されたClassesフォルダなどをそのままiPhone用プロジェクトとしても流用しますので、「置き換え」ボタンをクリックして上書きします。

さらに下記のような確認画面が表示されますので、「選択ファイルを上書き」ボタンをクリックして上書きします。

先ほど作成した「example」フォルダ内にxcodeprojファイルや「ios」フォルダが作成されました。これでiPhone用プロジェクトの作成は完了です。

iPhoneでの動作確認

iPhoneでの動作確認は一般的なアプリ開発時の手順と同じです。前項で作成したexample.xcodeprojファイルをXcodeで開き、 [概要]のプルダウンを「Simulator」に設定してから[ビルドと実行]をクリック。ビルド完了後にシミュレータが起動し、テンプレートに記述されたプログラムが実行されます。

※実機で動作させるには事前にプロビジョニングファイルの登録や設定が必要です。少しだけプログラムに手を加えてみます。 Classesフォルダ内にあるHelloWorldScene.cppを開き、下記のような変更をしてみました。

修正前

修正後

ファイルを保存してから再度[ビルドと実行]をクリック。先ほどHelloWorldScene.cppに加えた修正が反映されていることが確認できます。

Androidでの動作確認

続いてandroidでの動作確認です。 Androidは少し複雑で、まずはNDKのビルドから行う必要があります。ターミナルを開き、先ほど作成したプロジェクト「example」フォルダ内の「android」フォルダに移動。フォルダ内にある「build_native.sh」を実行します。

cppファイルのコンパイルが順次行われていくのですが、途中でエラーが発生してしまいました。

原因の調査をしたところ、Android NDKがRevision 7になって削除されてしまったフラグがあるらしく、 Android.mkファイルを修正しなくてはならないようです。

参考サイト

http://blog.plicatibu.com/how-to-solve-problems-with-build_native-sh-and-android-ndk-r7-on-cocos2d-x/ cocos2dxフォルダ配下のcocos2dx/Android.mkファイルを開き、「LOCAL_CFLAGS」に「-DGL_GLEXT_PROTOTYPES=1」を加えます。

再びbuild_native.shを実行したところ、今度はうまくビルドできました。

example/android/libs内に.soファイルが生成されています。

NDKのビルドが完了したらEclipseを起動。 [File]＞[New]＞[Android Project]を選択するとプロジェクト作成画面が表示されます。「Create project from existing source」をチェックし、「Location」の欄に先ほど作成した「example」フォルダ内の「android」フォルダを入力しましょう。「android」フォルダを選択した時点で、「Project Name」に「example」と自動的に入力されます。