close

製作基本的 Animate Sprites

 
 

這裡示範如何使用一張包含所有連續動畫的動作圖片 Animation Texture Atlas,來製作 Flipbook 動畫效果,所謂 Flipbook 動畫效果,就是利用多張圖片快速置換,使眼睛產生圖片會動的錯覺,這種效果在遊戲中很常使用。

首先我們必需要有一張包含所有分解動作的影像,而且要確切知道每個的分解動作片段的影像大小,如下圖(每個分解動作大小為 90 x 90 Pixel)。


接著在的 cocos2d 專案內增加一個 CCSprite 的 Subclass,並將其命名為 HawkSprite,這麼做的目的是我們希望利用此類別來產生動畫,日後當我們需要使用此動畫時,只需在場景內建立該類別的物件即可,而不是將動畫的生成方法直接寫在場景裡,這樣會很亂也不符合效益。

接著在 HawkSprite 類別的建構式裡寫下動畫產生的方法,其程式碼如下。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
-(id)init {
   self= [superinit];
 
   if(self) {
 
       //Animation Texture Atlas的設定(包含層級與標籤)
       CCSpriteBatchNode*hawkBatchNode = [CCSpriteBatchNodebatchNodeWithFile:@"Hawk.png"];
       [selfaddChild:hawkBatchNode z:0tag:0];
 
       //製作第一個動畫片段
       CCSprite*hawkSprite = [CCSpritespriteWithTexture:hawkBatchNode.textureAtlas.texture rect:CGRectMake(0,0,90,90)];
       [hawkBatchNode addChild:hawkSprite];
 
       //將動畫片段放置於畫面中心並放大兩倍
       CGSizesize = [[CCDirectorsharedDirector] winSize];
       hawkSprite.position = ccp(size.width/2, size.height/2);
       hawkSprite.scale =2.0f;
 
       //宣告一個陣列來放置所有的動畫片段             
       NSMutableArray*hawkArray = [NSMutableArrayarray];
 
       //將所有動畫片段放入陣列中
       intframeCount =0;
       for(inty =0; y <3; y++) {   
           for(intx =0; x <5; x++) {                                 
 
                 //單一動畫片段
                 CCSpriteFrame*frame = [CCSpriteFrameframeWithTexture:hawkBatchNode.textureAtlas.texture rect:CGRectMake(x*90, y*90,90,90)];                
                 [hawkArray addObject:frame];                 
 
                 frameCount++;    
                 if(frameCount ==14)     
                     break;   
           }  
       }               
 
         //製作動畫與設定每個影格的延遲時間      
         CCAnimation*hawkAnimation = [CCAnimationanimationWithFrames:hawkArray delay:0.1f];
 
         //將動畫設定成無限循環 
         CCAnimate*hawkAction = [CCAnimateactionWithAnimation:hawkAnimation];
         CCRepeatForever*repeat = [CCRepeatForeveractionWithAction:hawkAction]; 
 
         //執行動畫
         [hawkSprite runAction:repeat];
   }   
 
   returnself;
}

在上述程式碼中的 CCSpriteBatchNode 其實就是 CCSpriteSheet,只是現在 CCSpriteSheet 已經從 cocos2d 中移除了,現在都改用 CCSpriteBatchNode 來設定放置這些 CCSprite。

最後,只需要在場景內鍵入以下程式碼,就可以將動畫置入場景中。

1
2
3
HawkSprite *hawk = [[HawkSpritealloc] init];
[selfaddChild:hawk];
[hawkrelease];
 
arrow
arrow
    全站熱搜

    zer931 發表在 痞客邦 留言(0) 人氣()