Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Cocos2d xをさらにさわってみよう!

30,630 views

Published on

Cocos2d xをさらにさわってみよう!
・これだけ覚えていればC++は怖くない
・クロスプラットフォーム開発環境構築

Published in: Technology
  • Be the first to comment

Cocos2d xをさらにさわってみよう!

  1. 1. Cocos2d-xをさらにさわってみよう! これだけ覚えていればC++は怖くない クロスプラットフォーム開発環境構築術 株式会社TKS2 清水友晶
  2. 2. 清水 友晶(株)TKS2スマートフォンアプリ開発iOS, Android, (Windows Phone 8)WebコンテンツTwitter: tks2shimizufacebook:http://www.facebook.com/doraemonsssslide share:http://www.slideshare.net/doraemonsss 2
  3. 3. 資料のダウンロード TKS2ホームページ http://tks2.net 3
  4. 4. 目次前回のおさらいCocos2d-xに必要なC++の知識 型・構造体・列挙型・配列 基本構文 クラスCocos2d-xで用意されている便利なマクロクロスプラットフォーム開発環境構築開発の流れ リソースの追加 ソースファイルの追加解像度の異なるスクリーンに対応する 4
  5. 5. 前回のおさらいCocos2d-xをさわってみよう!http://www.slideshare.net/doraemonsss/cocos2d-x-14842614 5
  6. 6. C++の型char ... 整数型int ... 整数型short ... 整数型long ... 整数型float ... 少数型double ... 少数型long double ... 少数型bool ... 真偽値(true, false)string ... 文字列 6
  7. 7. C++の型int hoge;float fuga;bool foo;string bar;int hoge = 12345;float fuga = 1.2345f;bool foo = true;string bar = "Cocos2d-x"; 7
  8. 8. C++の構造体struct t_hoge { int fuga; string foo;};t_hoge hoge;hoge.fuga = 12345;hoge.foo = "Cocos2d-x"; 8
  9. 9. C++の列挙型enum kHoge { kHoge_1, kHoge_2,};kHoge hoge = kHoge_1; 9
  10. 10. C++の配列vector ... 一次元配列map ... 連想配列list ... リストstack ... スタック(LIFO)queue ... キュー(FIFO)set ... セット 10
  11. 11. C++の配列(vector)vector<int> hoge;hoge.push_back(12345);int fuga = hoge[0];hoge[0] = 23456;hoge.resize(100);hoge[50] = 34567;hoge.clear(); 11
  12. 12. C++の配列(map)map<string, int> hoge;hoge["fuga"] = 12345;int foo = hoge["fuga"];hoge["fuga"] = 23456;int size = hoge.size();hoge.erace("fuga");hoge.clear(); 12
  13. 13. 基本構文選択構造 if文 switch文反復構造 for文 while文 13
  14. 14. C++のif文if (hoge == 1) { //your code} else if (hoge == 2 || hoge == 3) { //your code} else if (hoge == 4 && fuga == 1) { //your code} else { //your code} 14
  15. 15. C++のswitch文switch (hoge) { case 1: //your code break; case 2: //your code break; default: //your code break;} 15
  16. 16. C++のfor文for (int i = 0; i < 10; i++) { //your code} 16
  17. 17. C++のfor文(iterator)vector<string> hoge;hoge.push_back("foo");hoge.push_back("bar");vector<string>::iterator it;for (it=hoge.begin(); it!=hoge.end(); ++it) { string fuga = *it;} 17
  18. 18. C++のwhile文while (hoge) { //your code}do { //your code} while (hoge); 18
  19. 19. C++のクラス(ヘッダー)HelloWorldScene.h #include "cocos2d.h" class HelloWorld : public cocos2d::CCLayer { public: virtual bool init(); static cocos2d::CCScene *scene(); void menuCloseCallback(CCObject *pSender); CREATE_FUNC(HelloWorld); }; 19
  20. 20. C++のクラス(実装)HelloWorldScene.cpp #include "HelloWorldScene.h" using namespace cocos2d; CCScene *HelloWorld::scene() { CCScene *scene = CCScene::create(); HelloWorld *layer = HelloWorld::create(); scene->addChild(layer); return scene; } 20
  21. 21. Cocos2d-xで用意されている便利なクラス CCArray CCDictionary CCObject CCString CCFileUtils CCUserDefault CCHttpRequest 21
  22. 22. Cocos2d-xで用意されている便利なマクロ CCPlatformMacro.h CREATE_FUNC(__TYPE__) CCLOG(format, ...) CCMacro.h CCAssert(cond, msg) CCRANDOM_0_1() CCGeometry.h CCPointMake(x, y) CCSizeMake(width, height) CCRectMake(x, y, width, height) CCPointExtension.h ccp(__x__,__y__) ccTypes.h ccc3(r, g, b) 22
  23. 23. 例題ランダムでネコが表示されるシーンを作ってみよう!ランダムでネコがアクションを起こすシーンを作ってみよう! 23
  24. 24. クロスプラットフォーム開発環境構築 iOS向け Android向け Classes proj.android Resources 24
  25. 25. クロスプラットフォーム開発環境構築 Xcodeのインストール手順は省略 Cocos2d-xのダウンロード Cocos2d-2.0-x-2.0.4.zip ダウンロードしたファイルを任意のディレクトリへ展開する (/Users/xxxx/cocos2d-2.0-x-2.0.4) 25
  26. 26. クロスプラットフォーム開発環境構築テンプレートのインストール(cocos2d-2.0-x-2.0.4/install-templates-xcode.sh) ターミナル.app起動 (アプリケーション/ユーティリティ/ターミナル.app) cocos2d-2.0-x-2.0.4のディレクトリへ移動して install-templates-xcode.shの実行 cd cocos2d-2.0-x-2.0.4 ./install-templates-xcode.sh -u 26
  27. 27. クロスプラットフォーム開発環境構築 iOS向けプロジェクトの作成 新規プロジェクトの作成 cocos2dxを選択 テンプレートよりプロジェクトを任意のディレクト リへ作成 (/Users/xxxx/MyProject) プロジェクトを実行 Run 27
  28. 28. クロスプラットフォーム開発環境構築EclipseおよびAndroid SDKのインストール手順は省略Android NDKをダウンロードandroid-ndk-r8bダウンロードしたファイルを任意のディレクトリへ展開する(/Users/xxxx/android-ndk-r8b) 28
  29. 29. クロスプラットフォーム開発環境構築 Android向けプロジェクトの作成 cocos2d-2.0-x-2.0.4配下のcreate-android- project.shを編集 8行目 NDK_ROOT_LOCAL 9行目 ANDROID_SDK_ROOT_LOCAL create-android-project.shの実行 パッケージパスの入力...net.tks2.MyProject ターゲット設定 プロジェクト名入力...MyProject cocos2d-2.0-x-2.0.4ディレクトリ内にプロジェ クトが作成される 29
  30. 30. クロスプラットフォーム開発環境構築 ディレクトリ構成Android iOS 30
  31. 31. クロスプラットフォーム開発環境構築Android向けプロジェクトの作成 javaファイルのコピー cocos2d-2.0-x-2.0.4/cocos2dx/platform/android/java/src/org/ cocos2dx/lib /Users/xxxx/MyProject/MyProject/proj.android/src/org/ cocos2dx/lib build_native.sh編集 32行目にNDK_ROOTを追加 NDK_ROOT="/Users/xxxx/android-ndk-r7b" 40行目のCOCOS2DX_ROOTを変更 COCOS2DX_ROOT="/Users/xxxx/cocos2d-2.0-x-2.0.4" build_native.sh実行 31
  32. 32. build_native.shとは?リソースのコピーアイコンのコピーAndroid NDKにより共有ライブラリとしてビルドMyProject/MyProject/proj.android/libs/armeabi/libgame.so 32
  33. 33. クロスプラットフォーム開発環境構築 Android向けプロジェクトの作成 Eclipseでプロジェクトを開く File > New > Project... Android Project from Existing Code MyProject/MyProject/proj.android選択 * もしエラーがある場合は、 JDK Compiler > 1.6 になっているかチェック 33
  34. 34. 開発の流れ1. Xcode上でソースを編集2. Xcode上でiOS向けプロジェクトを実行3. MyProject/MyProject/proj.android/ build_native.sh 実行4. Eclipse上でAndroid向けプロジェクト を実行 34
  35. 35. リソースファイルの追加Resourcesディレクトリにファイル追加するXcode上でプロジェクトにファイルを追加するbuild_native.shを実行する(シェルでassetsにコピーされる) 35
  36. 36. ソースファイルの追加HogeSceneクラスを追加する Xcode上でファイルを追加する ヘッダ部の追加 実装部の追加 Android.mkの編集 36
  37. 37. ヘッダ部(HogeScene.h)の追加HogeSceneクラスを追加する ClassesでNew File...を選択しファイルを追加する 37
  38. 38. ヘッダ部(HogeScene.h)の追加C and C++ の Header File を選択 38
  39. 39. ヘッダ部(HogeScene.h)の追加HogeScene.h を Classes へ作成 39
  40. 40. 実装部(HogeScene.cpp)の追加C and C++ の C++ Class を選択 40
  41. 41. 実装部(HogeScene.cpp)の追加HogeScene.cpp を Classes へ作成 41
  42. 42. Android.mkの編集MyProject/MyProject/proj.android/jni/Android.mk 9行目 LOCAL_SRC_FILES にHogeScene.cppを追 加する LOCAL_SRC_FILES := hellocpp/main.cpp ../../Classes/AppDelegate.cpp ../../Classes/HelloWorldScene.cpp ../../Classes/HogeScene.cppbuild_native.sh実行時にHogeSceneが含まれる 42
  43. 43. 解像度の異なるスクリーンに対応する iOS iPad...1024x768, 2048x1536 iPhone...480x320, 960x640 iPhone5...1136x640 Android 320x240 ~ 2560x1600 2012年モデルは1280x720が多い 43
  44. 44. 解像度の異なるスクリーンに対応する表示スケールの変更 CCDirectorクラス CCDirector::sharedDirector()->setContentScaleFactor(2.0f);画面サイズの取得 CCDirectorクラス CCDirector::sharedDirector()->getWinSize(); 44
  45. 45. 解像度の異なるスクリーンに対応するbool AppDelegate::applicationDidFinishLaunching(){ CCDirector *pDirector = CCDirector::sharedDirector(); pDirector->setOpenGLView(CCEGLView::sharedOpenGLView()); pDirector->setContentScaleFactor(480.0f / pDirector->getWinSize().width); pDirector->setDisplayStats(true); pDirector->setAnimationInterval(1.0 / 60); CCScene *pScene = HelloWorld::scene(); pDirector->runWithScene(pScene); return true;} 45
  46. 46. 解像度の異なるスクリーンに対応するCocos2d-x 2.0.4より、解像度の異なるスクリーン対応が容易になったHelloCpp参照cocos2d-2.0-x-2.0.4/samples/HelloCpp/proj.ios解説http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Multi_resolution_support要点 Resource designResolutionSize resolutionPolicy 46
  47. 47. 今後の予定Cocos2d-xをもっとさわってみるCocos2d-xの拡張外部ツールの利用Box2Dの利用OSとの連携 47

×