Successfully reported this slideshow.

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

22

Share

1 of 47
1 of 47

More Related Content

More from Tomoaki Shimizu

Related Books

Free with a 14 day trial from Scribd

See all

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

  1. 1. Cocos2d-xを さらにさわってみよう! これだけ覚えていればC++は怖くない クロスプラットフォーム開発環境構築術 株式会社TKS2 清水友晶
  2. 2. 清水 友晶 (株)TKS2 スマートフォンアプリ開発 iOS, Android, (Windows Phone 8) Webコンテンツ Twitter: tks2shimizu facebook: http://www.facebook.com/doraemonsss slide 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.cpp build_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

×