• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
cocos2d-xにおけるBox2Dの利用方法および便利なツール
 

cocos2d-xにおけるBox2Dの利用方法および便利なツール

on

  • 15,544 views

 

Statistics

Views

Total Views
15,544
Views on SlideShare
6,962
Embed Views
8,582

Actions

Likes
10
Downloads
33
Comments
0

7 Embeds 8,582

http://static.wix.com 5045
http://www.cocos2d-x.jp.usrfiles.com 3386
http://www.socialtoprunners.com 126
https://twitter.com 15
http://www57.jimdo.com 6
http://htmlcomponentservice.appspot.com 2
http://static.usrfiles.com 2
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    cocos2d-xにおけるBox2Dの利用方法および便利なツール cocos2d-xにおけるBox2Dの利用方法および便利なツール Presentation Transcript

    • cocos2d-x上で Box2Dを利用してゲームを作ってみよう! 株式会社TKS2 清水友晶
    • 清水 友晶—  株式会社TKS2 http://tks2.net—  スマートフォンアプリ開発 (iOS, Android, Windows Phone 8) Webコンテンツ開発—  cocos2d-xへの開発参加 cocos2d-xを利用したアプリ開発 講演活動 執筆活動—  Twitter: tks2shimizu—  Blog: http://tks2.net/memo—  SlideShare: http://www.slideshare.net/doraemonsss—  Facebook: http://www.facebook.com/doraemonsss
    • もうすぐ出版されます! 入�門編 応用編 CCOOMMIINNGG CCOOMMIINNGG SSOOOONN SSOOOONN
    • おやこでスマほん—  株式会社スマートエデュケーション
    • —  http://cocos2d-x.jp—  cocos2d-x開発元Chukong Technologies社公認—  cocos2d-xのための自由なコミュニティー—  入門者から上級者まで誰でもOK!!ぜひご参加を!—  cocos2d-xに関することなら何でも投稿できます!!—  https://www.facebook.com/groups/152840204871454/
    • —  4/17 第7回 shinjuku.cocos2d-x—  4/20 cocos2d-xハンズオン勉強会—  5/15 shinjuku.cocos2d-x初心者ハンズオン     ∼MacでiOSアプリを作る開発環境を整えよう!∼—  5/17 cocos2d-x公開講座 in 鹿児島—  5/18 cocos2d-x実践講座 in 鹿児島—  5/22 第8回 shinjuku.cocos2d-x—  6/M shinjuku.cocos2d-x初心者ハンズオン     ∼MacでAndroidアプリを作る開発環境を整えよう!∼—  6/M 第9回 shinjuku.cocos2d-x
    • 目次—  cocos2d-xにおける物理エンジン—  Box2Dについて—  シェープを作成するツール「PhysicsEditor」—  Box2Dを利用してゲームを作ってみよう! —  PhysicsEditorでシェイプを作る —  cocos2d-xの縦画面表示 —  物理空間の作成 —  ボールの作成 —  フリッパーの作成 —  衝突判定
    • cocos2d-xにおける物理エンジン—  cocos2d-xではBox2DとChipmunkが利用できる—  大きな違いは言語 —  Box2D … C++ —  Chipmunk … C言語—  どちらの方が優れているという明確な比較結果は見当 たらない—  慣れている方を利用するのが良い—  JavaScript BindingsではChipmunkが利用されている
    • Box2Dについて—  2D向けの物理シミュレーションライブラリ—  Box2Dホームページ http://box2d.org/—  MKS単位系(密度:kg/m3, 加速度:m/s2)—  どんなことができるのか? —  FLASHで遊ぼう! - API関連一覧 http://flashjp.com/apiindex.php—  cocos2d-xにおいては「project-creator」で作成した プロジェクトは標準で利用可能
    • Box2Dについて—  Box2Dを利用するには、多くの設定が必要—  例えば、cocos2d-xのiOS向けテンプレートプロジェクトに は、1つの画像に対して物理構造を与えるのに17行分の記述 が書かれている —  HelloWorldクラスのaddNewSpriteAtPosition関数参照—  複雑な物理構造を与えるには、コーディングでは難しい
    • PhysicsEditor—  物理エンジンで利 用可能なシェイプ を作成—  条件によっては無 料で利用可能 http://www.codeandweb.com/physicseditor
    • PhysicsEditor—  PhysicsEditorで作成したシェイプをcocos2d-xで 利用するときは、 —  「Box2D generic (PLIST)」を選択して出力する —  GB2ShapeCache-xクラスを利用する https://github.com/tks2shimizu/GB2ShapeCache-x
    • Box2Dを利用してゲームを作ろう!—  PhysicsEditorでシェイ プを作る—  cocos2d-xの縦画面表示—  物理空間の作成—  ボールの作成—  フリッパーの作成—  衝突判定
    • プロジェクトの準備—  project-creatorによるプロジェクト作成 ./create_project.py -project pinball -package net.tks2.pinball - language cpp—  ゲームで使用する画像を「Resources」に配置 http://tks2.net/pinball/pinball.zip —  Xcodeの場合は、プロジェクトへ取り込む—  GB2ShapeCache-xクラスを「Classes」に配置 https://github.com/tks2shimizu/GB2ShapeCache-x —  Xcodeの場合は、プロジェクトへ取り込む —  Android向けは、Android.mkにGB2ShapeCache-x.cppを追加 cocos2d-2.1rc0-x-2.1.2/projects/pinball/proj.android/jni/Android.mk
    • PhysicsEditor—  PhysicsEditorのホームページよりダウンロード http://www.codeandweb.com/physicseditor
    • PhysicsEditor—  PhysicsEditorを起動—  プロジェクト保存—  初期設定 —  Exporter —  Exporter … Box2D generics (PLIST) —  Global parameters —  PTM-Ratio (Pixel To Meter) … 1024
    • PhysicsEditor—  「Resources」の画像を、PhysicsEditorの左ペイン へドラッグアンドドロップ —  background.png —  ball.png —  flipper_left.png —  flipper_right.png
    • PhysicsEditor—  シェイプの作成
    • PhysicsEditor—  パラメータ設定 —  アンカーポイント —  密度 —  反発係数 —  摩擦係数 —  センサー —  任意の文字列—  ファイル出力 … Publicボタン —  出力されたplistファイルを「Resources」ディレクトリへ配置 —  Xcodeの場合は、プロジェクトへ取り込む
    • cocos2d-xの縦画面表示—  iOS —  Supported Interface Orientations —  RootViewController.mm - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)in return UIInterfaceOrientationIsPortrait( interfaceOrientation );! }! ! // For ios6, use supportedInterfaceOrientations & shouldAutorotate instea - (NSUInteger) supportedInterfaceOrientations{! #ifdef __IPHONE_6_0! return UIInterfaceOrientationMaskPortrait;! #endif! }!
    • cocos2d-xの縦画面表示—  Android —  AndroidManifest.xml <activity android:name=".NyanBall"! android:label="@string/app_name"! android:screenOrientation="portrait"! android:theme="@android:style/Theme.NoTitleBar. android:configChanges="orientation">! <intent-filter>! <action android:name="android.intent.action.MAIN" <category android:name="android.intent.category.L </intent-filter>! </activity>
    • 背景画像の表示—  今回は1つの画像のみを利用して、マルチレゾリュー ション対応を行う —  AppDelegate.cpp bool AppDelegate::applicationDidFinishLaunching() {! CCDirector* pDirector = CCDirector::sharedDirector();! CCEGLView* pEGLView = CCEGLView::sharedOpenGLView();! ! pDirector->setOpenGLView(pEGLView);! pDirector->setDisplayStats(true);! pDirector->setAnimationInterval(1.0 / 60);! ! CCSize winSize = CCDirector::sharedDirector()->getWinSize();! pDirector->setContentScaleFactor(1024 / winSize.height);! ! CCScene *pScene = HelloWorld::scene();! pDirector->runWithScene(pScene);! ! return true;! }!
    • 背景画像の表示—  background.pngの表示—  ソース編集 —  HelloWorldScene.h —  HelloWorldScene.cpp https://gist.github.com/tks2shimizu/ 17994a67fdbcf89435bf
    • 物理空間の作成—  b2Worldクラスによる物理空間 (本ハンズオンでは必要最小限の設定のみとする) —  重力の設定 —  毎フレーム更新—  毎フレームの更新にupdate関数を利用する—  ソース編集 —  HelloWorldScene.h —  HelloWorldScene.cpp https://gist.github.com/tks2shimizu/d8c3df1f72d75d2b21ca
    • 背景画像に物理構造を与える—  シェイプデータの読込み —  「pinball.plist」を読込む—  b2BodyDefの定義 —  type —  position … PTM Ratioで割ることに注意 —  userData … CCSpriteを追加—  ソース編集 —  HelloWorldScene.h —  HelloWorldScene.cpp https://gist.github.com/tks2shimizu/e69d420bc53675d982c3
    • ボールの作成—  タップを有効—  毎フレーム処理—  ボール作成処理—  ソース編集 —  HelloWorldScene.h —  HelloWorldScene.cpp https://gist.github.com/tks2shimizu/ 57e6ca5ff1494a66421e
    • フリッパーの作成—  フリッパー作成処理—  ジョイント追加—  ジョイントの制限—  ソース編集 —  HelloWorldScene.h —  HelloWorldScene.cpp https://gist.github.com/tks2shimizu/ faa011e28d9cf95df0db
    • 点数の表示—  衝突判定 —  b2ContactListenerクラス—  ソース編集 —  HelloWorldScene.h —  HelloWorldScene.cpp https://gist.github.com/tks2shimizu/ beb45a3a5e6625eb679f
    • おわり—  次回「cocos2d-x JavaScript Bindings」について C++とJavaScriptの違いを中心に見てみます