RepeatForever と stopAllActions でアニメーションを切り替える

たとえば上下左右に歩くキャラクターのspriteを用いたアニメーションで
プレイヤーの進行方向によってアニメーションを切り替えたい場合は
RepoeatForeverとstopAllActionを用いると実現できる。

RepeatForeverは回数の指定なく永遠にアニメーションを再生するメソッドだが、
一度Repeatを走らせてしまうと後でアニメーションを切り替えたい時に上書くことができない。
そのためstopAllActionsで一度Repeatのアニメーションを止める必要がある。

sample

var Hiyoko = cc.Sprite.extend({
    ctor:function () {
        this._super();
    },
    initializeParam:function(){
        this.direction = "front";
    },
    walkFront:function(){
        if(this.direction != "front"){
            this.direction = "front";
            this.sprite.stopAllActions();
            var frameSeq = [];
            for (var i = 1; i <= 3; i++) {
                var str = "front" + i + ".png";
                var frame = cc.SpriteFrameCache.getInstance().getSpriteFrame(str);
                frameSeq.push(frame);
            }
            this.wa = cc.Animation.create(frameSeq, 0.3);
            this.ra = cc.RepeatForever.create(cc.Animate.create(this.wa));
            this.sprite.runAction(this.ra);
        }
    },
    walkLeft:function(){
        //
    },
    walkRight:function(){
        //
    },
    walkBack:function(){
        //
    },
});

var gameLayer = cc.Layer.extend({

    ctor:function () {
        this._super();
        this.init();
    },
    init:function () {
        this._super();

        this.hiyoko = new Hiyoko();
        this.addChild(this.hiyoko);
    },
    update:function(dt){
        this._super();
        this.hiyoko.walkRight(); //or walkLeft or walkFront or walkBack
    }
});

参考 pngとplist