【iOS-Cocos2d游戲開發之二十一】自定義精靈類并為你的精靈設置攻擊幀(指定開始幀)以及擴展Cocos2d源碼的CCAnimation簡化動畫創建！ · iphone游戲開發專欄

[?李華明Himi?](http://www.himigame.com/about-himi)原創,轉載務必在明顯處注明：轉載自[【黑米GameDev街區】](http://www.himigame.com/)?原文鏈接:?[http://www.himigame.com/iphone-cocos2d/525.html](http://www.himigame.com/iphone-cocos2d/525.html "【iOS-Cocos2d游戲開發之二十一") [](http://blog.csdn.net/xiaominghimi/article/details/6993764) 上周貌似沒有寫新的博文，那么今天Himi寫個精品的博文奉獻給童鞋們；（不少童鞋說Himi的教程最近都沒有源碼放出=。 =，這里我解釋下，一般我沒有放出源碼的博文那肯定已經將代碼貼出來了，這點是肯定的，否則Himi一定給出源碼的）本篇的知識點如下： 1.兩種方式實現自定義精靈； 2.兩種方式讓精靈利用多幀播放動畫 3.為你的精靈設置帶有攻擊幀的動畫，當執行攻擊動作的中間會執行扣血等邏輯，然后接著播放動作喔～首先第一種如何自定義精靈：兩種自定義一個精靈當然無疑我們仍然繼承CCSprite，首先看第一種自定義方式，Himi新建一個類，名字是MySprite，代碼如下，大家一看就很清晰了； **MySprite.h** ~~~ // // MySprite.h // HimiAnimationsTestPro // // Created by 華明李 on 11-11-20. // Copyright (c) 2011年 __MyCompanyName__. All rights reserved. // #import "CCSprite.h" @interface MySprite : CCSprite{ } +(id) mySpriteInitWithImage:(NSString*)fileName; -(id) initWithMySpriteImage:(NSString*)fileName; @end ~~~ **MySprite.m** ~~~ // // MySprite.m // HimiAnimationsTestPro // // Created by 華明李 on 11-11-20. // Copyright (c) 2011年 __MyCompanyName__. All rights reserved. // #import "MySprite.h" @implementation MySprite +(id) mySpriteInitWithImage:(NSString*)fileName { return [[[self alloc] initWithMySpriteImage:fileName] autorelease];//這里仿照cocos2d原理，自動清理精靈 } -(id) initWithMySpriteImage:(NSString*)fileName { if ((self = [super initWithFile:fileName])) { //初始化的東東都寫在這里喔～ } return self; } -(void) dealloc { //內存清理 [super dealloc]; } @end ~~~ 大家以后自定義精靈的時候可以將我這個當模版即可！如果你不想自定義的精靈傳參，那就直接自己修改下構造函數即可，初始化的時候寫死名字即可（比如一般游戲主角不需要傳入圖片名字作為參數，直接在我們主角類的構造中將圖片資源名寫死即可）然后我們用第二種方式，所謂第二種方式其實就是修改我們的初始化函數，讓其精靈初始化的方式改成幀緩存創建：（適合利用TP打包工具出的圖進行來創建精靈）代碼如下：（這里Himi為了讓童鞋們看得清楚，Himi新建一個類，名字是MySpriteByFrame） **MySpriteByFrame.h** ~~~ // // MySprite.h // HimiAnimationsTestPro // // Created by 華明李 on 11-11-20. // Copyright (c) 2011年 __MyCompanyName__. All rights reserved. // #import "CCSprite.h" @interface MySpriteByFrame : CCSprite{ } +(id) mySpriteInitWithFrameName:(NSString*)frameName; -(id) initWithMySpriteFrameName:(NSString*)frameName; @end ~~~ **MySpriteByFrame.m** ~~~ // // MySprite.m // HimiAnimationsTestPro // // Created by 華明李 on 11-11-20. // Copyright (c) 2011年 __MyCompanyName__. All rights reserved. // #import "MySpriteByFrame.h" @implementation MySpriteByFrame +(id) mySpriteInitWithFrameName:(NSString*)fileName { return [[[self alloc] initWithMySpriteFrameName:fileName] autorelease];//這里仿照cocos2d原理，自動清理精靈 } -(id) initWithMySpriteFrameName:(NSString*)fileName { if ((self = [super initWithSpriteFrameName:fileName])) { //初始化的東東都寫在這里喔～ } return self; } -(void) dealloc { //內存清理 [super dealloc]; } @end ~~~ 大家注意兩種自定義精靈.m類中的 if((self = XXX)這里是重要的區別，一個是直接索引資源名稱，一個是通過名稱找到幀緩存中的幀； OK,兩種創建的方式的自定義精靈都完成了，下面我們來嘗試創建吧： ~~~ //---------創建一個我們自定義的MySprite精靈吧（利用文件名直接創建） //1.import 自定義類.h (#import "MySprite.h") MySprite*mySprite=[MySprite mySpriteInitWithImage:@"Icon.png"]; mySprite.position=ccp(70,size.height*0.5); [self addChild:mySprite]; //---------創建一個我們自定義的MySpriteByFrame精靈吧（利用幀緩存中的文件名創建） //@@@@注意因為是從幀緩存里找到對應名字的幀，那么肯定需要將用到的幀放在緩存里。 [[CCSpriteFrameCache sharedSpriteFrameCache]addSpriteFramesWithFile:@"mySpriteFrames-hd.plist"]; MySpriteByFrame *mySpriteByF =[MySpriteByFrame mySpriteInitWithFrameName:@"himi.png"]; mySpriteByF.position=ccp(300,size.height*0.5); [self addChild:mySpriteByF]; ~~~ 注意：利用幀來創建的時候必須要將使用的幀首先加載到幀緩存中，這里Himi利用TP打包工具將一張名字為himi.png的圖打包到mySpriteFrames-hd.plist中了，也就是下面這句代碼將himi.png圖加載到幀緩存中了，否則報錯找不到喔； ~~~ [[CCSpriteFrameCache sharedSpriteFrameCache]addSpriteFramesWithFile:@"mySpriteFrames-hd.plist"]; ~~~ 加載的圖片資源圖如下： ![](https://box.kancloud.cn/2016-03-31_56fcd01e32be2.png) 注意這里的-hd 文件和非-hd的文件的區別，不太懂的童鞋請移步到這篇博文： [【iOS-Cocos2d游戲開發之九】講解CCSpriteBatchNode與TP工具的".pvr.ccz",".plist"共用的終極精靈優化及注意事項！](http://blog.csdn.net/xiaominghimi/article/details/6761811) 運行截圖如下： ![](https://box.kancloud.cn/2016-03-31_56fcd01e4d252.png) 下面Himi來介紹第二個知識點：兩種方式讓精靈利用多幀播放動畫 Himi這里就不細說了，直接提供給大家Himi封裝好的兩個方法：（Himi使用的cocos2d-iphone版本是1.0.0）先嘮叨一句，剛才上面說過了，創建精靈一種是利用直接索引文件名字來創建，另外一種就是直接利用幀緩存來創建，那么讓一個精靈實現動畫的播放當然也一樣對應分為兩種方式；直接上代碼:** **CCAnimationHelper.h** ~~~ // // CCAnimationHelper.h // SpriteProject // // Created by Himi on 11-8-6. // Copyright 2011 __MyCompanyName__. All rights reserved. // #import "cocos2d.h" @interface CCAnimation (Helper) //直接索引圖片名稱 +(CCAnimation*) animationWithFile:(NSString*)name frameCount:(int)frameCount delay:(float)delay; //利用幀緩存中的幀名稱 +(CCAnimation*) animationWithFrame:(NSString*)frame frameCount:(int)frameCount delay:(float)delay; @end ~~~ **CCAnimationHelper.m** ~~~ // CCAnimationHelper.m // SpriteProject // // Created by Himi #import "CCAnimationHelper.h" @implementation CCAnimation (Helper) //直接索引圖片名稱 +(CCAnimation*) animationWithFile:(NSString*)name frameCount:(int)frameCount delay:(float)delay { NSMutableArray* frames = [NSMutableArray arrayWithCapacity:frameCount]; NSString* file; for (int i = 0; i < frameCount; i++) { file =nil; file = [NSString stringWithFormat:@"%@%i.png", name, i]; CCTexture2D* texture = [[CCTextureCache sharedTextureCache] addImage:file]; CGSize texSize = texture.contentSize; CGRect texRect = CGRectMake(0, 0, texSize.width, texSize.height); CCSpriteFrame* frame = [CCSpriteFrame frameWithTexture:texture rect:texRect]; [frames addObject:frame]; } return [CCAnimation animationWithFrames:frames delay:delay]; } //利用幀緩存中的幀名稱 +(CCAnimation*) animationWithFrame:(NSString*)frame frameCount:(int)frameCount delay:(float)delay { NSMutableArray* frames = [NSMutableArray arrayWithCapacity:frameCount]; NSString* file; for (int i = 1; i <= frameCount; i++) { file =nil; file = [NSString stringWithFormat:@"%@%i.png", frame, i]; CCSpriteFrameCache* frameCache = [CCSpriteFrameCache sharedSpriteFrameCache]; CCSpriteFrame* frame = [frameCache spriteFrameByName:file]; [frames addObject:frame]; } return [CCAnimation animationWithFrames:frames delay:delay]; } @end ~~~ ~~~ +(CCAnimation*) animationWithFile:(NSString*)name frameCount:(int)frameCount delay:(float)delay{}; //參數講解：name：資源文件名；frameCount 總幀數； delay ：每一幀的刷新時間 +(CCAnimation*) animationWithFrame:(NSString*)frame frameCount:(int)frameCount delay:(float)delay{}; //參數講解：frame：幀文件名；frameCount 總幀數； delay ：每一幀的刷新時間 ~~~ 注意： 1、類有(help)的表示對原有的類進行擴展； 2、動作幀都要按照himi0.png,himi1.png,himi2.png,這樣子命名，當然拉你不想這樣可以修改這兩個方法即可； 3.注意Himi這里的兩個方法，一個是從0開始喔，另外一個是從1開始的，如果你用幀緩存進行創建動作就要從himi1.png,開始命名，嘿嘿～** 下面是使用方法： ~~~ //--@@@@@@@--第二個知識點--@@@@@@@ //利用文件名創建動作 //--首先導入#import "CCAnimationHelper.h" MySprite*mySprite=[MySprite mySpriteInitWithImage:@"himi0.png"]; mySprite.position=ccp(140,mySprite.contentSize.height*0.5); [self addChild:mySprite]; CCAnimation*anim=[CCAnimation animationWithFile:@"himi" frameCount:12 delay:0.1]; CCAnimate* animate = [CCAnimate actionWithAnimation:anim]; CCSequence *seq = [CCSequence actions:animate,nil]; CCRepeatForever* repeat = [CCRepeatForever actionWithAction:seq]; [mySprite runAction:repeat]; //利用幀緩存中的文件名創建動作 //--首先導入#import "CCAnimationHelper.h" [[CCSpriteFrameCache sharedSpriteFrameCache]addSpriteFramesWithFile:@"animationsFrames.plist"]; MySpriteByFrame *mySpriteByF =[MySpriteByFrame mySpriteInitWithFrameName:@"himi1.png"]; mySpriteByF.position=ccp(350,size.height*0.5); [self addChild:mySpriteByF]; anim=[CCAnimation animationWithFrame:@"himi" frameCount:12 delay:0.1]; animate = [CCAnimate actionWithAnimation:anim]; seq = [CCSequence actions:animate,nil]; repeat = [CCRepeatForever actionWithAction:seq]; [mySpriteByF runAction:repeat]; ~~~ 這里要提醒童鞋們的有兩點： 1.利用幀緩存創建動畫的時候要注意要提前將幀加載到緩存里喔～ 2.Himi這兩個方法沒有寫一樣，所以動作幀的命名一個從0開始，另外一個從1開始！童鞋們可以自行改過來哈運行截圖如下： ![](https://box.kancloud.cn/2016-03-31_56fcd01e7670f.png) 【扯皮一下，如果你在我的Android或者iOS群中，你感覺這張哆啦A夢圖熟悉不～嘿嘿，Himi的7個群都是這個GIF做為群頭像，娃哈哈，我自己做的娃哈哈；】第三點知識點：為你的精靈設置攻擊幀；首先跟一些童鞋簡單說下何謂攻擊幀，假如主角攻擊一個怪物的時候，肯定播放攻擊動作，但是！你是在攻擊動作開始的時候就扣怪物血還是攻擊動作結束后扣怪物血呢？都不是！！！因為很不真實！所以我們應該當攻擊動作播放到設定的某一幀的時候進行扣怪物血或者其他邏輯，然后繼續播放剩下的攻擊動作，這樣才更加的真實！那么OK，這里Himi仍然封裝成一個方法讓你直接使用即可；首先看下代碼： ~~~ //帶有攻擊幀的動畫 +(CCAnimation*) animationWithFrameFromStartFrameIndex:(NSString*)frame startFrameCountIndex:(int)startFrameIndex frameCount:(int)frameCount delay:(float)delay { NSMutableArray* frames = [NSMutableArray arrayWithCapacity:frameCount]; NSString* file; file =nil; for (int i = startFrameIndex; i < frameCount+startFrameIndex; i++) { file = [NSString stringWithFormat:@"%@%i.png", frame, i]; CCSpriteFrameCache* frameCache = [CCSpriteFrameCache sharedSpriteFrameCache]; CCSpriteFrame* frame = [frameCache spriteFrameByName:file]; [frames addObject:frame]; } return [CCAnimation animationWithFrames:frames delay:delay]; } ~~~ ~~~ +(CCAnimation*) animationWithFrameFromStartFrameIndex:(NSString*)frame startFrameCountIndex:(int)startFrameIndex frameCount:(int)frameCount delay:(float)delay {} //參數介紹：frame ：幀名字； startFrameIndex：指定播放起始幀； frameCount：幀總數； delay：每幀的刷新時間 ~~~ 使用方法如下： ~~~ //--@@@@@@@--第三個知識點--@@@@@@@ [[CCSpriteFrameCache sharedSpriteFrameCache]addSpriteFramesWithFile:@"animationsFrames.plist"]; MySpriteByFrame *mySpriteAni =[MySpriteByFrame mySpriteInitWithFrameName:@"himi1.png"]; mySpriteAni.position=ccp(260,size.height*0.5); [self addChild:mySpriteAni]; //首先執行前6幀動畫 CCAnimation*anim=[CCAnimation animationWithFrameFromStartFrameIndex:@"himi" startFrameCountIndex:1 frameCount:6 delay:0.1]; CCAnimate* animate = [CCAnimate actionWithAnimation:anim]; //攻擊幀執行的函數 CCCallFunc *downEnemyHp =[CCCallFunc actionWithTarget:self selector:@selector(downEnemyHp)]; //后6幀動畫 anim=[CCAnimation animationWithFrameFromStartFrameIndex:@"himi" startFrameCountIndex:7 frameCount:6 delay:0.1 ]; CCAnimate* animateForAttackIndex = [CCAnimate actionWithAnimation:anim]; CCSequence *seq = [CCSequence actions:animate,downEnemyHp,animateForAttackIndex,nil]; [mySpriteAni runAction:seq]; ---------回調函數 -(void)downEnemyHp{ CCLabelTTF *label = (CCLabelTTF*)[self getChildByTag:99]; [label setString:@"攻擊幀"]; } ~~~ 前六幀-》回調downEnemyHp函數-》繼續播放剩下的播放幀數運行截圖如下： ![](https://box.kancloud.cn/2016-03-31_56fcd01eb2233.png) ![](https://box.kancloud.cn/2016-03-31_56fcd01eea069.png) OK，繼續忙了～由于本文知識點較多和較細節，這里Himi放出源碼，我的動作相關的封裝都在CCAnimationHelper.h/.m中喔，注意不要改類名，因為這個類是Himi對cocos2d源碼進行的擴展！** [http://www.himigame.com/iphone-cocos2d/525.html](http://www.himigame.com/iphone-cocos2d/525.html "【iOS-Cocos2d游戲開發之二十一")