CocosCreator开发笔记(15)-如何处理Spine动画的结束回调

CocosCreator提供了很方便的Spine动画接口，我们常常会在播放Spine动画完成后做一些处理，这就需要知道Spine动画播放完成的准确时机。

有两种注册结束回调的方法，一是使用 setCompleteListener，它是针对单个动画的，一般使用这个就可以了。示例代码如下：

playSpine: function(animName, loop, callback) {
    let spine = this.node.getComponent(sp.Skeleton);
    let track = spine.setAnimation(0, animName, loop);
    if (track) {
        // 注册动画的结束回调
        spine.setCompleteListener((trackEntry, loopCount) => {
            let name = trackEntry.animation ? trackEntry.animation.name : '';
            if (name === animName && callback) {
                callback(); // 动画结束后执行自己的逻辑
            }
        });
    }
},

二是使用 setAnimationListener，它可以处理所有的动画事件（该接口从Creator2.0开始可能会弃用）。示例代码如下：

playSpine: function(loop, callback) {
    let spine = this.node.getComponent(sp.Skeleton);
    spine.setAnimation(0, 'run', loop); // 播放名为run的动画
    spine.setAnimationListener(this, this.spineEventCallback); // 注册回调
},

Spine动画事件的回调函数实现如下：

spineEventCallback: function(skeletonNode, trackEntry, eventType, event, loopCount) {
    // 如果动画播放完成且名字等于run，则销毁该节点
    if (eventType === sp.AnimationEventType.COMPLETE && trackEntry.animation && trackEntry.animation.name === 'run') {
        this.node.destroy();
    }
},

引擎中对Spine事件类型的定义如下：

sp.AnimationEventType = cc.Enum({
      START: 0,
      INTERRUPT: 1,
      END: 2,
      DISPOSE: 3,
      COMPLETE: 4,
      EVENT: 5
    });

注：如果动画是循环的，则每完成一次循环都会触发COMPLETE。