cocos2d-xでシーンを切り替える
概要
- タイトル、ゲームメニュー、ゲームのように複数シーンの時の切り替え処理を作る
シーンクラス追加
- 新規でシーンクラスを作る
- メニューと選択物は下記画像参照
背景画像用意
- タイトルシーン用背景を作成してプロジェクトに追加
- TitleSceneで読み込んでる背景画像名を変更する
TitleScene.cpp
// add "HelloWorld" splash screen"
CCSprite* pSprite = CCSprite::create("title_back.png");
起動時のシーンをタイトルシーンにする
- AppDelegate.cppのrunWithSceneの引数をTItleSceneのオブジェクトにする
AppDelegate.cpp
// create a scene. it's an autorelease object
CCScene *pScene = Title::scene();
- とりあえずここまでで動かす
タイトルシーンから次のシーンに行くボタンをつける
- とりあえずなんかボタン押したらcocos2d-xの画面が出るようにする
- ボタン作成とコールバックはHelloWorldから持ってくる
TitleScene.h
// a selector callback
void menuChangeScene(CCObject* pSender);TitleScene.cpp:ボタン作成
/////////////////////////////
// 2. add a menu item with change scene
CCMenuItemImage *pChangeSceneItem = CCMenuItemImage::create(
"CloseNormal.png",
"CloseSelected.png",
this,
menu_selector(Title::menuChangeScene) );
pChangeSceneItem->setPosition( ccp(CCDirector::sharedDirector()->getWinSize().width - 20, 20) );
// create menu, it's an autorelease object
CCMenu* pMenu = CCMenu::create(pChangeSceneItem, NULL);
pMenu->setPosition( CCPointZero );
this->addChild(pMenu, 1);TitleScene.cpp:ボタンのコールバック
void Title::menuChangeScene(CCObject *pSender)
{
CCDirector::sharedDirector()->replaceScene( HelloWorld::scene());
}
動かす
- 最初にタイトルが出てボタンを押すとcocos2d-xのマスコットの画面が出る
cocos2d-xで画像を動かす
追記
- githubにサンプルプロジェクト作成
- https://github.com/kambayashia/cocos2d-x-game/tree/develop/move-sprite
画像配置コード確認
- 今までのサンプルでも参考にしているHelloWorldの全画面に出ている画像をどう出しているか確認する
- コードは前回ボタンを追加したコードにそのまま追加。なのでボタン２つでてる
// add "HelloWorld" splash screen"
CCSprite* pSprite = CCSprite::create("HelloWorld.png");
// position the sprite on the center of the screen
pSprite->setPosition( ccp(size.width/2, size.height/2) );
// add the sprite as a child to this layer
this->addChild(pSprite, 0);
左右に揺らしてみる
- 正弦の値を使って揺らす
追加するメンバ
- ひと揺れの中のフレーム番号(ループ変数)
- 動かす画像オブジェクト
- 定期的に呼び出される関数
class HelloWorld : public cocos2d::CCLayer
{
private:
cocos2d::CCLabelTTF *mLabel; // ボタンを押したときにテキストを変更するラベル
int mLoopCount; // ひと揺れの中のフレーム番号
cocos2d::CCSprite *mSprite; // 動かす画像オブジェクト
public:
// Here's a difference. Method 'init' in cocos2d-x returns bool, instead of returning 'id' in cocos2d-iphone
virtual bool init();
// there's no 'id' in cpp, so we recommand to return the exactly class pointer
static cocos2d::CCScene* scene();
// a selector callback
void menuCloseCallback(CCObject* pSender);
// new callback function
void menuTextChangeCallback(CCObject *pSender);
// move sprite logic
void gameLogic();
// implement the "static node()" method manually
LAYER_CREATE_FUNC(HelloWorld);
};
画像オブジェクト保存
// add "HelloWorld" splash screen"
CCSprite* pSprite = CCSprite::create("HelloWorld.png");
this->mSprite = pSprite; // 画像オブジェクトを保存
毎フレーム座標更新
- チュートリアルを参考に定期的に呼び出されるメソッドの準備をする
this->schedule( schedule_selector(HelloWorld::gameLogic), 1.0 / 60.0 );
return true;
}
- 画像移動処理実装
- 久しぶりに書いたら三角関数忘れてたのでコード汚いけどこんな感じ
void HelloWorld::gameLogic()
{
float x = 0;
CCSize size = CCDirector::sharedDirector()->getWinSize();
const float PI = 3.1415f;
int max_loop_count = 60 * 1;
float cos_value = cosf(PI * ((float)this->mLoopCount++ / (float)max_loop_count));
x = (float)size.width * cos_value;
if( this->mLoopCount > (max_loop_count * 2) )
{
this->mLoopCount = 0;
}
this->mSprite->setPosition( ccp( x + size.width / 2, size.height / 2) );
}
画面
- 静止画だけど左右に揺れてる
cocos2d-xでボタンを作る
ボタン機能を見てみる
- 付属しているサンプルをもとにUIのボタンを追加してみる。
- HelloWorld.cppの中を見るとこんな感じでボタンを作っている。
/////////////////////////////
// 2. add a menu item with "X" image, which is clicked to quit the program
// you may modify it.
// add a "close" icon to exit the progress. it's an autorelease object
CCMenuItemImage *pCloseItem = CCMenuItemImage::create(
"CloseNormal.png",
"CloseSelected.png",
this,
menu_selector(HelloWorld::menuCloseCallback) );
pCloseItem->setPosition( ccp(CCDirector::sharedDirector()->getWinSize().width - 20, 20) );画面中の右下の丸いのがこのボタンで押すとmenuCloseCallbackが呼ばれてアプリが終了する。
このボタンの上に表示されるようにボタンを追加してみる。
コード追加
- 元のボタン作成コードのすぐ下で変数名、コールバック名、座標をかえたコードを入れる。
- CCMenuのオブジェクトを作ったあとにaddChildでボタンをメニューに追加する。
- CCLabelTTFで作成しているテキストラベルはあとで変更できるようにメンバ変数として保存する
- まだこの段階ではコールバック関数がなくてエラーで動かない
/////////////////////////////
// 2. add a menu item with "X" image, which is clicked to quit the program
// you may modify it.
// add a "close" icon to exit the progress. it's an autorelease object
CCMenuItemImage *pCloseItem = CCMenuItemImage::create(
"CloseNormal.png",
"CloseSelected.png",
this,
menu_selector(HelloWorld::menuCloseCallback) );
pCloseItem->setPosition( ccp(CCDirector::sharedDirector()->getWinSize().width - 20, 20) );
CCMenuItemImage *pTextChangeItem = CCMenuItemImage::create(
"CloseNormal.png",
"CloseSelected.png",
this,
menu_selector(HelloWorld::menuTextChangeCallback) );
pTextChangeItem->setPosition( ccp(CCDirector::sharedDirector()->getWinSize().width - 20, 40) );
// create menu, it's an autorelease object
CCMenu* pMenu = CCMenu::create(pCloseItem, NULL);
pMenu->addChild(pTextChangeItem, 1);
pMenu->setPosition( CCPointZero );
this->addChild(pMenu, 1);
/////////////////////////////
// 3. add your codes below...
// add a label shows "Hello World"
// create and initialize a label
CCLabelTTF* pLabel = CCLabelTTF::create("Hello World", "Thonburi", 34);
this->mLabel = pLabel;
ヘッダ編集
- ラベルを保存する変数をメンバに追加
- コールバックで呼ばれる関数を追加
class HelloWorld : public cocos2d::CCLayer
{
private:
cocos2d::CCLabelTTF *mLabel; // ボタンを押したときにテキストを変更するラベル
public:
// Here's a difference. Method 'init' in cocos2d-x returns bool, instead of returning 'id' in cocos2d-iphone
virtual bool init();
// there's no 'id' in cpp, so we recommand to return the exactly class pointer
static cocos2d::CCScene* scene();
// a selector callback
void menuCloseCallback(CCObject* pSender);
// new callback function
void menuTextChageCallback(CCObject *pSender);
// implement the "static node()" method manually
LAYER_CREATE_FUNC(HelloWorld);
};
コールバック関数の実装追加
- cppにもどりコールバック関数を実装する
void HelloWorld::menuTextChangeCallback(CCObject* pSender)
{
this->mLabel->setString("Pressed");
}
画面
- ボタンが表示されて押すと画面上部のテキストが変わった
cocos2d-x入門
概要
- cocos2d-xはcocos2dというiphone用ゲーム開発フレームワークをマルチプラットフォームにしてなんやかんやしたゲーム開発フレームワーク
- できることとか機能とか -> http://www.cocos2d-x.org/projects/cocos2d-x/wiki
- クラスリファレンスとかのドキュメント -> http://www.cocos2d-x.org/reference/native-cpp/index.html
ダウンロード
- ここの一番上にiphone用があるのでダウンロード -> http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Download
- 最新はcocos2d-2.0-rc2-x-2.0.1 @ Jun 29 2012
サンプル
- サンプルについてるhelloworldを開いて動かしてみる
xcodeにテンプレート追加
- なんかダウンロードファイル内にインストールスクリプトがあったので動かした
kamihayashi-no-MacBook-Air:cocos2d-2.0-rc2-x-2.0.1 kambayashia$ cd ~/Downloads/cocos2d-2.0-rc2-x-2.0.1 kamihayashi-no-MacBook-Air:cocos2d-2.0-rc2-x-2.0.1 kambayashia$ ./install-templates-xcode.sh -u cocos2d-x template installer Installing Xcode 4 cocos2d-x iOS template ---------------------------------------------------- ...creating destination directory: /Users/kambayashia/Library/Developer/Xcode/Templates/cocos2d-x/ ...copying cocos2d files ...copying CocosDenshion files ...copying template files done! Installing Xcode 4 Chipmunk iOS template ---------------------------------------------------- ...copying Chipmunk files done! Installing Xcode 4 Box2d iOS template ---------------------------------------------------- ...copying Box2D files done! Installing Xcode 4 lua iOS template ---------------------------------------------------- ...copying lua files done! done!
プロジェクト作成
- とりあえずxcodeを再起動したほうがいいかも。追加したテンプレートが読み込まれるかよくわからんので
- サンプルを参考にプロジェクト作ってみる
ビルド
- Runのボタンを押すだけ
画像変更
- 表示される画像をかえてみる
- http://dummyimage.com/ で適当に画像作ってプロジェクト内の画像ファイルと置き換える
kamihayashi-no-MacBook-Air:~ kambayashia$ cp ~/Downloads/dummy600x400.png ~/projects/ios/cocos2dsample/cocos2dsample/Resources/HelloWorld.png
macportsとgccとgitインストール
macports
- なんかmacで使われているパッケージインストールマネージャ的なものでいろいろお世話になるそうなので入れる
インストール
- ダブルクリックして通常パッケージと同様にインストール
- 特に設定する項目なし
設定
- 設定ファイルとかリポジトリ管理サーバとかを最新にするための更新
kamihayashi-no-MacBook-Air:ios kambayashia$ sudo port -v selfupdate : : The ports tree has been updated. To upgrade your installed ports, you should run port upgrade outdated
gitインストール
- gitインストールしようとしたらmakeとかgccがなかった
- http://stackoverflow.com/questions/6767481/where-can-i-find-make-program-for-mac-os-x-lion
- xcodeの設定->downloadからcommandline toolみたいなのを入れる必要があったので入れる
- ようやくインストール
- これでなんやかんや入る
kamihayashi-no-MacBook-Air:ios kambayashia$ sudo port install git-core Password:
git clone
- これでclone可能
kamihayashi-no-MacBook-Air:ios kambayashia$ git clone git@xxxxxxx.jp:xxxxxxxxxxxx/hogehoge.git Cloning into 'hogehoge'... The authenticity of host 'xxxxxxxxxxxxxxxxxxxxxxx' can't be established. RSA key fingerprint is xxxxxxxxxxxxxxxxxxxxxxxxxx Are you sure you want to continue connecting (yes/no)? yes Warning: Permanently added 'xxxxxxxxxxxxxxxxxxxxxxxxx' (RSA) to the list of known hosts. Identity added: /Users/kambayashia/.ssh/id_rsa (/Users/kambayashia/.ssh/id_rsa) remote: Counting objects: 207, done. remote: Compressing objects: 100% (191/191), done. remote: Total 207 (delta 9), reused 207 (delta 9) Receiving objects: 100% (207/207), 10.44 MiB | 2.23 MiB/s, done. Resolving deltas: 100% (9/9), done.
