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についてアップします!