Cocos2d-x iOS アプリ

Cocos2d-x エフェクトアニメーションの終了と同時にエフェクトを消す方法

投稿日:2016年8月17日 更新日:

effect_movie03_01

この記事では、アニメーションを表示し終わった後に、アニメーション表示を消す方法を紹介します。

 

ゲーム中であれば、アニメーションが1ループしたら消してしまいたいことも多いと思います。

方法を知っていれば簡単なのですが、私は知らなかったためドハマりしてしまいました。

 

【前回まで】

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

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

 

 

結論

結論から言うと、

1.アニメーションをRepeatアクションに設定

2.コールバックにアニメーション削除処理を記述

3.SequeceでRepeatとコールバックを連結

4.runActionでSequenceを実行

 

と、これだけです。それでは、具体的にプログラムを見ていきます。

 

 

プログラムの実装


    Size visibleSize = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();
    
    cocos2d::SpriteFrameCache::getInstance()->addSpriteFramesWithFile("sprites.plist");
    
    Sprite* sprite = Sprite::createWithSpriteFrameName("effect_cure02_0000.png");
    sprite->setPosition(Vec2(visibleSize.width/10 * 5 + origin.x, visibleSize.height/2 + origin.y));
    sprite->setScale(1.5);
    this->addChild(sprite);
    
    // 加算合成
    BlendFunc func;
    func.src = GL_SRC_ALPHA;
    func.dst = GL_ONE;
    sprite->setBlendFunc(func);

    // アニメーションの作成
    Animation* animation = Animation::create();

    SpriteFrame* sprite0 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0000.png");
    animation->addSpriteFrame(sprite0);
    SpriteFrame* sprite1 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0001.png");
    animation->addSpriteFrame(sprite1);
    SpriteFrame* sprite2 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0002.png");
    animation->addSpriteFrame(sprite2);
    SpriteFrame* sprite3 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0003.png");
    animation->addSpriteFrame(sprite3);
    SpriteFrame* sprite4 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0004.png");
    animation->addSpriteFrame(sprite4);
    SpriteFrame* sprite5 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0005.png");
    animation->addSpriteFrame(sprite5);
    SpriteFrame* sprite6 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0006.png");
    animation->addSpriteFrame(sprite6);
    SpriteFrame* sprite7 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0007.png");
    animation->addSpriteFrame(sprite7);
    SpriteFrame* sprite8 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0008.png");
    animation->addSpriteFrame(sprite8);
    SpriteFrame* sprite9 = SpriteFrameCache::getInstance()->getSpriteFrameByName("effect_cure02_0009.png");
    animation->addSpriteFrame(sprite9);
    
    // アニメーションの間隔
    animation->setDelayPerUnit(0.1);
    
    // アニメーション終了後に最初に戻すかどうか
    animation->setRestoreOriginalFrame(true);
    
    // アクションの設定
    FiniteTimeAction* repeat = Repeat::create(Animate::create(animation), 5);
    
    // コールバック
    auto remove = CallFunc::create([sprite](){
        CCLOG("animation remove");
        sprite->removeFromParent();
    });
    
    // アクションとコールバックをシーケンス
    auto seq = Sequence::create(repeat, remove, nullptr);
    
    // アクションの実行
    sprite->runAction(seq);
    
    return true;

 

 

エフェクトアニメーションの表示~エフェクトアニメーションの削除

アニメーションが1回だと一瞬で終わってしまうため、今回はアニメーションが5回ループしたら削除するようにしました。1回だけ表示して消したい場合はRepeatの回数を1に設定すればOKです。

effect_movie03_01

 

補足

Cocos2d-x v3.9からアニメーションコールバックの機能が追加されているようです。

 

 

2017/06/25 追記

このやり方だと、アニメーションをaddChildした親レイヤがreplaceSceneなどを行っていて既に存在しない場合にメモリリークすることがあるようです。

既に存在しない親レイヤに対してremoveFromParentを行うタイミングだと、おそらくですがremoveFromParentがうまく機能せず、アニメーションオブジェクトがうまくリリースされないのだと思います。

 

ですので、アニメーションの途中で親レイヤが破棄されるようなケースでは、明示的にアニメーションを破棄するような実装が必要となります。

 

以上です。

PrainGoogleAdSense

PrainGoogleAdSense

-Cocos2d-x, iOS, アプリ
-, ,

執筆者:


comment

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

関連記事

新作iOSアプリ 「フェリクスマギアの魔女」公開中です!

新作iOSアプリ 「フェリクスマギアの魔女」公開しました 下の「AppStoreからダウンロード」アイコンからダウンロード画面に行けます フェリマギ ダウンロード無料(アプリ内アイテム課金あり)です。 …

ゲーム制作 Cocos2d-x関連 最終回 「勝利演出、敗北演出の追加」

勝利演出、敗北演出を実装していきます。今回で最終回です!     仕様の検討 1.バトル中、プレイヤーのHPが0になった場合 → 勝利演出 → 勝利演出中に画面をタップするとスター …

動作確認画像

Cocos2d-x アプリ起動画面(スプラッシュ画像)の変更方法について

この記事では、アプリの起動画面(スプラッシュ画像)の変更のやり方について説明します。     このスプラッシュ画像、どうやって変更するのか結構わかりづらいと思います。私もしばらくや …

スプライトシート作成

Cocos2d-x スプライトシートを作成して画像を楽に管理したい

Cocos2d-x スプライトシートを作成して画像を楽に管理したい この記事では、スプライトシートの作成方法と、スプライトシートを利用することのメリットについて紹介します。     …

cocos2dx

Cocos2d-x Http通信の完了に同期して処理を実行する

  こんにちは、akiです。 この記事ではHttp通信処理の完了に同期して任意の処理を実行するやり方を説明します。 やり方は簡単でHttp通信のコールバックの中にカスタムイベントを発行する処 …