cocos2dのAction基本編①

cocos2dのアプリ作成もだいぶ終盤に差し掛かってきました。プログラムを初めてそろそろ2ヶ月が経過しようとしておりますが、ひとつ形になるものができあがりそうです。
cocos2dをインストールしたのが10月後半なので、cocos2dでアプリを制作し始めて1ヶ月が経過しました。はじめはほとんど理解できなかったものが少しずつ脳内整理され、最近は英語のDocumentを読んでも理解できるようになりつつあります。



先週、↑を注文してみました。英語の本買うのは大学のとき以来ですが、頑張って読みます!読んだ感想や、気づいた点は随時ブログにUPしていきますのでお楽しみに!


それでは、先週予告したとおり、cocos2dを利用した様々なActionについてまとめてみます。本日はその基本編です。

BasicActions

基本的なActionはCCActionIntervalクラスのにて初期化(生成)します。

以下にあげる、Actionはすべて、CCActionIntervalクラスのサブクラスなので、

+(id) actionWithDuration: (ccTime) d
{
	return [[[self alloc] initWithDuration:d ] autorelease];
}

(CCActionIntervalクラスを定義にジャンプしました。)


でActionが初期化されています。その後、個々のActionごとにpostionやangle、scaleを設定していくという感じです。


また、宣言時には、id型で宣言するのが一般的です。

id moveto = [CCMoveTo actionWithDuration:5.0f position:ccp(0,0)];

みたいな感じですね。


以下では、HelloWorldというプロジェクトを作成し、真ん中にIcon画像として使用されている「Icon.png」を表示させ、いろいろなActionで画像を動かしてみたいと思います。

HelloWorldScene.mの -(id) init {} 内を↓のように変更し、画像を表示させます。

-(id) init {

// ask director the the window size
CGSize size = [[CCDirector sharedDirector] winSize];

//Sprite(画像)をResourcesフォルダから読み込み表示させる
CCSprite *sprite = [CCSprite spriteWithFile:@"Icon.png"];
		sprite.position = ccp(size.width/2,size.height/2);
		[self addChild:sprite z:1];

}


移動

■CCMoveTo

id moveto = [CCMoveTo actionWithDuration:5.0f position:ccp(0,0)];
[sprite runAction:moveto];



この例だと、5.0f秒かけて、ccp(0,0)まで移動します。


■CCMoveBy

id moveby = [CCMoveBy actionWithDuration:5.0f position:ccp(50,0)];
[sprite runAction:moveby];



この例だと、5.0f秒かけて、(50,0)座標分、つまりx座標に +50 分だけ画像を移動ます。

ジャンプ

■CCJumpTo

id jumpTo = [CCJumpTo actionWithDuration:5.0f position:ccp(0,100) height:200 jumps:4];
[sprite runAction:jumpTo];

5.0f秒かけて、200座標分上に4回ジャンプしながら(0,100)に移動します。


■CCJumpBy

 id jumpBy = [CCJumpBy actionWithDuration:5.0f position:ccp(0,100) height:200 jumps:4];
[sprite runAction:jumpBy];

5.0f秒かけて、200座標分上に4回ジャンプし、最後に現在のy座標に+100したところに移動します。

回転

■CCRotateTo

id rotateTo = [CCRotateTo actionWithDuration:5.0f angle:180];
[sprite runAction:rotateTo];



5.0f秒かけて、180度画像を回転させます。


■CCRotateBy

id rotateBy = [CCRotateBy actionWithDuration:5.0f angle:180];
[sprite runAction:rotateBy];


5.0f秒かけて、180度分画像を回転させます。


■CCRotateByとCCRotateToの違い

CCRotateTo の方は、最短距離で回転する。
CCRotateByは、時計回りに指定した角度まで回転。


なので、例えば angle:270とすると違いが明確になります。

id jumpTo = [CCJumpTo actionWithDuration:5.0f position:ccp(0,100) height:200 jumps:4];

だと、最短距離で目的の角度まで回転しなければならないので、反時計回り。

id rotateBy = [CCRotateTo actionWithDuration:5.0f angle:270];

だと時計回りに回転します。

拡大

■CCScaleTo

id scaleTo = [CCScaleTo actionWithDuration:2.0f scale:2.0];
[sprite runAction:scaleTo];


2.0f秒かけてSpriteが2.0倍になります。
*注意事項 後日紹介するリバースアクションが使えない!


■CCScaleBy

id scaleBy = [CCScaleBy actionWithDuration:2.0f scale:2.0];
[sprite runAction:scaleBy];


2.0f秒かけてSpriteが2.0倍になります。
*リバース使用可能!



今日のところはここまで。
来週はこれらのActionを連続、同時に実行させる方法や、Bezier曲線を用いたActionについてアップします!