cocos2d-xの開発に欠かせない CocosBuilderについて

株式会社TKS2 清水友晶

清水 友晶 �  株式会社TKS2

スマートフォンアプリ開発 (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

�  6/25発売 �  2,800円 ＋ 税

�  400ページ

�  6/18発売 �  2,980円 ＋ 税

�  312ページ

�  http://cocos2d-x.jp

�  cocos2d-x開発元Chukong Technologies社公認

�  cocos2d-xのための自由なコミュニティー

�  入門者から上級者まで誰でもOK!!ぜひご参加を!

�  cocos2d-xに関することなら何でも投稿できます!!

�  https://www.facebook.com/groups/cocos2dxjp/

�  8/23 第2回cocos2d-x開発技術勉強会

�  8/29 第11回 shinjuku.cocos2d-x

�  9/12 shinjuku.cocos2d-x初心者ハンズオン 　　　　～cocos2d-xを利用したクロスプラットフォーム開発環境構築～

�  9/26 第12回 shinjuku.cocos2d-x

�  10/M shinjuku.cocos2d-x初心者ハンズオン 　　　　～CocosBuilderを利用した開発の進め方～

�  10/M 第13回 shinjuku.cocos2d-x

目次 �  CocosBuilderとは

�  CocosBuilderデモ

�  本に載っていない使い方

�  CocosBuilderに関するハンズオンの紹介

CocosBuilderとは �  http://cocosbuilder.com

�  cocos2dのレイアウトやアニメーションをGUIで調整可能

�  オープンソース(MITライセンス)

�  最新版CocosBuilder 3.0 Alpha �  JSB(JavaScript bindings)の機能が大幅に追加 �  CocosPlayer (for JSB) �  cocos2d-xやcocos2d-iphoneでも利用可能

�  cocos2d-xではCCBReaderクラスを利用して連携可能

�  初心者向けの主な情報源 �  CocosBuilder User Guide �  cocos2d-xサンプル「TestCpp」

CocosBuilderでの注意 �  次のバージョンに揃える必要がある

�  cocos2d-x 2.1.4 (cocos2d-x 3.0 alpha0-pre) �  CocosBuilder 3.0 alpha 5

�  Mac OS X 10.8を使用すること �  Mac OS X 10.7以前の場合、ファイルを読込めないバグがある

�  参考になるプロジェクト �  cocos2d-xプロジェクト

�  cocos2d-x-2.1.4/samples/Cpp/TestCpp �  CocosBuilderプロジェクト

�  cocos2d-x-2.1.4/samples/Cpp/TestCpp/Resources/CocosBuilderExample.ccbproj

本に載っていない情報 �  ガイドの操作

�  効果音

�  コールバック関数

�  パーティクル

�  タイムラインの編集

�  Sprite Sheetの取り込み

�  Smart Sprite Sheetの利用

ガイドの操作 �  ガイドの追加

�  ものさし上からドラッグ&ドロップ

�  ガイドの移動 �  command + クリック è マウスの移動

�  ガイドの削除 �  ガイドを画面外へ移動する

�  ガイドにスナップ �  できません。ソース上でコメントアウトされている

�  なぜ使用不可なのか不明… �  CocosScene.m 823~843行目をアンコメントし、適切に修正

することで利用可能になるかも?

効果音 �  キーフレームの追加は、alt + クリック

�  設定はキーフレームをダブルクリック

�  Resourcesに含まれる音声ファイルから選択

コールバック関数 �  キーフレームの追加は、alt + クリック

�  設定はキーフレームをダブルクリック

�  C++の場合は、onResolveCCBCallFuncSelector関数にて設定 è CCB_SELECTORRESOLVER_CALLFUNC_GLUEマクロ

パーティクル �  FXボタンをクリックするとパーティクルが作成できる

�  使い勝手はParticleDesignerの方が良い

タイムラインの編集 �  キーフレームをダブルクリックすることにより、簡単に編集可能

�  キーフレームのコピー&ペーストが可能

�  キーフレームを複数選択することで、Animationメニューより次の項目が利用可能 �  Reverse Selected Keyframes

èキーフレームの順序を反転する �  Stretch Selected Keyframes...

èキーフレームの間隔を変更する

Sprite Sheetの取り込み �  TexturePackerなどで作成されたSprite Sheetは、

CocosBuilderから読み込み可能なディレクトリに配置するだけで利用可能 �  xxxx.plist �  xxxx.png

�  一連の画像から一度にキーフレームを作成することが可能 �  Create Keyframes from Selection

Smart Sprite Sheetの利用 �  ディレクトリのコンテキストメニュー

�  Make Smart Sprite Sheetを選択

�  Edit Smart Sprite Sheet...を選択

CocosBuilderを利用した ハンズオンの予定

�  8/29(木) 第11回 shinjuku.cocos2d-x

�  10/M shinjuku.cocos2d-x初心者ハンズオン ～CocosBuilderを利用した開発の進め方～

おわり �  ご清聴ありがとうございました。