Prainブログ

ゲーム開発とかIT小話とかその他雑記のブログ

*

Cocos2d-x アニメーションの画像追加を楽に行う方法

   

 楽ちん

この記事では、楽してアニメーション機能を利用する方法について紹介します。

 

【前回まで】

・第1回 : アニメーションを利用した回復エフェクトの表示方法

・第2回 : 加算合成を利用して、背景が黒い画像をアニメーションで使えるようにする方法

・第3回 : エフェクトアニメーションの終了と同時にエフェクトを消す方法

・第4回 : アニメーションをバッファリングして、高速で安定した処理を行う方法

・第5回 : アニメーションの画像追加を楽に行う方法(ここ)

 

 

前回まででCocos2d-xにおけるアニメーションの利用方法を紹介してきました。その中で、アニメーションを登録する際に下記のようなコードを書いていたと思います。


    // アニメーションに画像を追加
    Animation* animation = Animation::create();
    
    SpriteFrame* sprite0 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0000.png");
    animation->addSpriteFrame(sprite0);
    SpriteFrame* sprite1 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0001.png");
    animation->addSpriteFrame(sprite1);
    SpriteFrame* sprite2 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0002.png");
    animation->addSpriteFrame(sprite2);
    SpriteFrame* sprite3 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0003.png");
    animation->addSpriteFrame(sprite3);
    SpriteFrame* sprite4 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0004.png");
    animation->addSpriteFrame(sprite4);
    SpriteFrame* sprite5 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0005.png");
    animation->addSpriteFrame(sprite5);
    SpriteFrame* sprite6 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0006.png");
    animation->addSpriteFrame(sprite6);
    SpriteFrame* sprite7 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure01_0007.png");
    animation->addSpriteFrame(sprite7);

 

 

しかし、アニメーション複数種類を大量に登録したい場合、このようにいちいちファイル名を指定してアニメーション登録するのは現実的ではありません。

そこで、アニメーション登録処理はメソッド一つで登録できるようにして楽しちゃいましょう。「楽してアニメーション登録」のイメージは下図のイメージです。

 

楽して画像登録

 

【ポイント】

・ファイル名に規則を持たせる

プログラム中でファイル名を自動で生成し、登録処理させることが可能になる

・ファイル名をそのままキーとして利用する

管理情報がシンプルになる(ファイル名だけに注意を払えばよい)

 

 

これで、ファイルの登録を1メソッドに押し込めてしまえば、登録処理は1行プログラムを書くだけで良さそうです。とにかく楽をして成果を出しましょう。工夫によって楽をするのは正義です。手抜きがダメなだけなのです。

 

 

スポンサーリンク

 

 

AnimationUtilityクラスの作成

上記の方針に則り、AnimationUtilityクラスを作ります。面倒なことはすべてこいつに任せましょう。

 

AnimationUtilityクラス

・ファイル名に連番を振り、存在するすべてのファイルをアニメーションクラスに登録する。アニメーション間隔もここで設定する。

・指定したキー(=ファイル名)のアニメーションを取得する。

※エラー処理などの実装は割愛します。

 

 

それではプログラムを実装していきましょう。

 

 

プログラム実装

AnimationUtility.hpp

#ifndef AnimationUtility_hpp
#define AnimationUtility_hpp

#include <stdio.h>

class AnimationUtility{
private:
    AnimationUtility();
    static AnimationUtility* _animationUtility;
    
public:
    static AnimationUtility* getInstance();
    
    void addAnimation(std::string fileName, float animationInterval);
    cocos2d::Animation* getAnimation(std::string key);
    
    
    
};
#endif /* AnimationUtility_hpp */

 

AnimationUtility.cpp


#include "AnimationUtility.hpp"
#include <string>

using namespace cocos2d;

void AnimationUtility::addAnimation(std::string fileName, float animationInterval){
    
    Animation* animation = Animation::create();
    
    // ファイル名の連番は必ず0からにしておくこと
    int i = 0;
    while(true){
        std::string tt_str = "%04i.png";
        auto t_str = __String::createWithFormat(tt_str.c_str(),i);
        std::string str = fileName + "_" + t_str->getCString();
        
        SpriteFrame* sprite = SpriteFrameCache::getInstance()->getSpriteFrameByName(str.c_str());
        if(sprite == nullptr){
            break;
        }
        
        animation->addSpriteFrame(sprite);
        
        i++;
    }
    
    // アニメーションの間隔
    animation->setDelayPerUnit(animationInterval);
    
    // アニメーション終了後に最初に戻すかどうか
    animation->setRestoreOriginalFrame(true);
    
    // キーの登録
    AnimationCache::getInstance()->addAnimation(animation, fileName);

    
}


Animation* AnimationUtility::getAnimation(std::string key){
    // アニメーションの取得
    return AnimationCache::getInstance()->getAnimation(key);

}

 

「addAnimation(std::string fileName, float animationInterval)」は「”ファイル名”_0000.png」~「”ファイル名”_000n.png」ファイルが存在することを前提にして、文字列”ファイル名”に”_0000.png”~”_000n.png”を順番に付け加え、それをファイル名としたアニメーション画像を登録するメソッドです。

「getAnimation(std::string key)」はここではAnimationCacheクラスの「getAnimation」と同じですが、必要に応じて処理を追加するラップクラス的なものとして用意しました。(例えばここでaddChildするなど。)

 

 

まとめ

今回のサンプルは、プログラム的にはただの文字列操作がメインなのですが、自分の使いやすいようにプログラムを拡張してどんどん楽をしていくと良いと思います。

私の場合は画像ファイル名の一覧を外出しファイルにしておいて、そのファイルに画像ファイル名を追加するだけで、プログラムに手を加えずに新たなアニメーションを追加できるようにしたりしています。楽ちん最高!バンザイ!!

 

 - , ,

        

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

新しいファイル
ゲーム制作 Cocos2d-x関連 第8回 「より保守性のあるプログラムを目指して」

  何だこのタイトルは・・・ゲーム制作はどこに行ったの?   …

cocos2dx
Cocos2d-x カスタムイベントを削除するタイミング

こんにちは、akiです。 この記事ではカスタムイベントを削除するタイミングについ …

SDKBoxを使ってアプリ内課金をするやり方 インストール編

この記事では、アプリ課金のためのSDKBoxインストールのやり方を説明します。 …

シミュレータ
ゲーム制作 Cocos2d-x関連 第3回 「画像の表示処理 解説」

今回はCocos2d-xにおける画像表示コードの解説です。   スポン …

ゲーム制作 Cocos2d-x関連 第16回 「パズル要素を実装する」

ちょっと待って、パズル要素はどこなの???   ・・・ですよね・・・「 …