Cocos2d-JS のサンプルを動かしてみる (iOS編)
前回 ブラウザ上で Cocos2d-JS を動かしてみたので、今回は iOS アプリとして動かしてみます。
使用した環境
OS: Mac OS X 10.10.3
Xcode: 6.3.2
Cocos2d-JS: v3.6.1
iOSアプリとして実行する
Cocos2d-JS のプロジェクトを iOS アプリとして実行するには大きく分けて２つの方法があります。
- cocos run コマンドを使用する (CUIベース)
- Xcode からプロジェクトファイルを開く (GUIベース) – おすすめ
Xcode の様々な機能が利用できる 2. の方法がおすすめです。
方法１：cocos run コマンドを使用する
前回のブラウザ上での実行の際に使用した cocos run コマンドの -p オプションの引数を ios に変えるだけで、ビルド、iOS シミュレーターの起動、アプリの実行まで全部行ってくれます。最初の実行時には cocos2d ライブラリのビルドもあり、数分かかります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
$ <strong>cd MyProject</strong> $ <strong>pwd</strong> <span style="color: #339966;">/My/Test/MyProject</span> $ <span style="color: #0000ff;"><strong>cocos run -p ios </strong><span style="color: #339966;">Running command: compile</span> <span style="color: #339966;">Building mode: debug</span> <span style="color: #339966;">building</span> <span style="color: #ff00ff;">running: 'xcodebuild -project "/My/Test/MyProject/frameworks/runtime-src/proj.ios_mac/MyProject.xcodeproj" -configuration Debug -target "MyProject iOS" -arch i386 -sdk iphonesimulator CONFIGURATION_BUILD_DIR="/My/Test/MyProject/runtime/ios" VALID_ARCHS="i386"'</span> <span style="color: #339966;">Build settings from command line:</span> <span style="color: #339966;"> ARCHS = i386</span> <span style="color: #339966;"> CONFIGURATION_BUILD_DIR = /My/Test/MyProject/runtime/ios</span> <span style="color: #339966;"> SDKROOT = iphonesimulator8.3</span> <span style="color: #339966;"> VALID_ARCHS = i386</span> <span style="color: #33cccc;">=== BUILD TARGET jsbindings iOS OF PROJECT cocos2d_js_bindings WITH CONFIGURATION Debug ===</span> <span style="color: #339966;">Check dependencies</span> <span style="color: #339966;">Write auxiliary files</span> <span style="color: #339966;">/bin/mkdir -p /My/Test/MyProject/frameworks/js-bindings/bindings/proj.ios_mac/build/cocos2d_js_bindings.build/Debug-iphonesimulator/jsbindings\ iOS.build</span> <span style="color: #339966;">write-file /My/Test/MyProject/frameworks/js-bindings/bindings/proj.ios_mac/build/cocos2d_js_bindings.build/Debug-iphonesimulator/jsbindings\ iOS.build/jsbindings\ iOS-all-non-framework-target-headers.hmap</span> <span style="color: #339966;">write-file /My/Test/MyProject/frameworks/js-bindings/bindings/proj.ios_mac/build/cocos2d_js_bindings.build/Debug-iphonesimulator/jsbindings\ iOS.build/jsbindings\ iOS.hmap</span> <span style="color: #339966;">write-file /My/Test/MyProject/frameworks/js-bindings/bindings/proj.ios_mac/build/cocos2d_js_bindings.build/Debug-iphonesimulator/jsbindings\ iOS.build/jsbindings\ iOS-all-target-headers.hmap</span> <span style="color: #339966;">write-file /My/Test/MyProject/frameworks/js-bindings/bindings/proj.ios_mac/build/cocos2d_js_bindings.build/Debug-iphonesimulator/jsbindings\ iOS.build/jsbindings\ iOS-own-target-headers.hmap</span><strong> </strong></span> : : (中略) : : <span style="color: #339966;">CpResource ios/Icon-58.png /My/Test/MyProject/runtime/ios/MyProject\ iOS.app/Icon-58.png</span> <span style="color: #339966;"> cd /My/Test/MyProject/frameworks/runtime-src/proj.ios_mac</span> <span style="color: #339966;"> export PATH="/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/usr/bin:/Applications/Xcode.app/Contents/Developer/usr/bin:/opt/local/bin:/opt/cocos2d-js-v3.5/tools/cocos2d-console/bin:/opt/local/bin:/opt/local/sbin:/Applications/MAMP/Library/bin/:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin:/Applications/Xcode.app/Contents/Developer/usr/bin/"</span> <span style="color: #339966;"> builtin-copy -exclude .DS_Store -exclude CVS -exclude .svn -exclude .git -exclude .hg -resolve-src-symlinks /My/Test/MyProject/frameworks/runtime-src/proj.ios_mac/ios/Icon-58.png /My/Test/MyProject/runtime/ios/MyProject\ iOS.app</span> <span style="color: #339966;">Touch /My/Test/MyProject/runtime/ios/MyProject\ iOS.app</span> <span style="color: #339966;"> cd /My/Test/MyProject/frameworks/runtime-src/proj.ios_mac</span> <span style="color: #339966;"> export PATH="/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/usr/bin:/Applications/Xcode.app/Contents/Developer/usr/bin:/opt/local/bin:/opt/cocos2d-js-v3.5/tools/cocos2d-console/bin:/opt/local/bin:/opt/local/sbin:/Applications/MAMP/Library/bin/:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin:/Applications/Xcode.app/Contents/Developer/usr/bin/"</span> <span style="color: #339966;"> /usr/bin/touch -c /My/Test/MyProject/runtime/ios/MyProject\ iOS.app</span> <strong><span style="color: #339966;">** BUILD SUCCEEDED **</span></strong> <span style="color: #339966;">build succeeded.</span> <span style="color: #339966;">Running command: deploy</span> <span style="color: #339966;">Deploying mode: debug</span> <span style="color: #339966;">Running command: run</span> <span style="color: #339966;">starting application</span> <span style="color: #ff00ff;">running: '/opt/cocos2d-js-v3.5/tools/cocos2d-console/plugins/project_run/bin/ios-sim-xcode6 launch "/My/Test/MyProject/runtime/ios/MyProject iOS.app" &'</span> $ |
うまくいけば自動的に iOS シミュレーターが起動し、アプリが立ち上がります！！簡単！！
しかしこの方法１は何が行われているのかよく見えないことなどがあり、エキスパート向けの方法だと思います。自分は使っていません。
方法２：Xcodeからプロジェクトファイルを開く
方法２は Xcode を使う方法です。こちらがオススメのやり方です。
./frameworks/runtime-src/proj.ios_mac/<プロジェクト名>.xcodeproj に Xcode で開くことができるプロジェクトファイルがあります。
この .xcodeproj ファイルをダブルクリックなどで開きます。このバージョンの Cocos2d-JS が生成する Xcode のプロジェクトファイルは “Xcode 3.2 compatible” とのことでかなり古い形式のようですが、最新の Xcode 6.3.2 でもこのままビルドはできます。（App Store にアップするにはアイコンの追加などの修正が必要です。)
このプロジェクトは、ビルド対象がデフォルトで “jsbinding iOS” と言うライブラリになっているので、これを自分のプロジェクト名のものに変更します。
また、デバイスは実機を選ぶ場合プロビジョニングなどの設定が必要になるので、とりあえず iPhone 6 シミュレーターなどにしておくと簡単です。
あとは左上の再生ボタンを押して実行します。
問題がなければ選択した iOS デバイス上でサンプルが実行されるはずです！
Pingback: Cocos2d-JS のサンプルを動かしてみる (Android編) | tomeapp
Pingback: Cocos2d-JS で広告を表示する (iOS編) – その１ | tomeapp