CCAnimation パラパラアニメ cocos2d スプライトで作る
バッチノード、スプライトを使った CCAnimationパラパラアニメを作り方。
[作るもの]
4枚の画像をパラパラマンガのようにきりかえる
[パラパラアニメ 基礎解説]
http://dkoubou2.chips.jp/blog6/2012/04/ccanimation_cocos2d1.html
[素材]
サンプルで使用する画像ファイル
test3.png
サンプルは 32×32の画像が縦2横2で 4つ並んでいる画像を使うとする。
4枚の画像は
1.gif
2.gif
3.gif
4.gif
スプライトからパラパラアニメ |
スプライトからパラパラアニメを作る方法です。
プログラムをやってきた自分としては、これが一番解りやすかったです。
CGRectMake(0,0,32,32)で画像の座標とサイズを指定します。
//////////////////////////////////////////////////////// |
バッチノードからパラパラアニメ |
つぎはバッチノードを使った記述の仕方です。解説書によるとバッチノードを使うと処理速度が上がると書かれていました。
//////////////////////////////////////////////////////// //パラパラアニメ バッチノードVER 位置を自分で入力して登録する //////////////////////////////////////////////////////// //バッチノードの設定 ※バッチノード使うと容量を圧縮できる CCSpriteBatchNode*bbb= [CCSpriteBatchNode batchNodeWithFile:@"test3.png"]; [self addChild:bbb];//画面に登録 //スプライトをつくり バッチノードに入れる CCSprite *sp999= [CCSprite spriteWithFile:@"test3.png"]; sp999.position = ccp( 200, 150); //スプライトの位置設定 [bbb addChild:sp999]; //画像データを配列に登録 CCSpriteFrame* frame1 = [CCSpriteFrame frameWithTexture:bbb.texture rect:CGRectMake(0,0,32,32)]; CCSpriteFrame* frame2 = [CCSpriteFrame frameWithTexture:bbb.texture rect:CGRectMake(32,0,32,32)]; CCSpriteFrame* frame3 = [CCSpriteFrame frameWithTexture:bbb.texture rect:CGRectMake(0,32,32,32)]; CCSpriteFrame* frame4 = [CCSpriteFrame frameWithTexture:bbb.texture rect:CGRectMake(32,32,32,32)]; NSArray* animFrames = [NSArray arrayWithObjects: frame1, frame2,frame3,frame4,nil]; //アニメをつくる CCAnimation *animation = [CCAnimation animationWithFrames:animFrames delay:1.05f]; id repeat = [CCRepeatForever actionWithAction:[CCAnimate actionWithAnimation:animation restoreOriginalFrame:NO]]; [sp999 runAction:repeat]; //end-------------------------------------------------------- |
-------------------------------------------------------
[参考]
公式サイト
http://www.cocos2d-iphone.org/wiki/doku.php/prog_guide:index
のActions, Transformations and EffectsのAnimationに解説あり
How To Use Animations and Sprite Sheets in Cocos2D
http://www.raywenderlich.com/1271/how-to-use-animations-and-sprite-sheets-in-cocos2d
http://www.raywenderlich.com/tutorials
plistを使ったアニメーションの作り方
自堕落なページ
http://d.hatena.ne.jp/corrupt/20110523/1306143469
plistを使わず自分で スプライトシートの位置指定してアニメを作る方法 を書かれています
ハマケン100%開発
http://hamken100.blogspot.jp/2011/08/cocos2d_19.html
-------------------------------------------------------