【工具類】CocosCreator Spine在場景編輯器實時預覽（論壇水友分享的）

參考：

( 完美解決)spine在場景編輯器不能實時預覽動作的問題

 

方法一

下載地址：SkeletonExt.zip

 

逛論壇看到這個spine實時預覽的解決方案，不需要改動源碼，覺得十分的方便。

將文件SkeletonExt.js放在項目目錄文件夾libs下，勾選運行編輯器加載即可。

 

 

 

 

spine預覽效果

 

源碼的位置：

 

 

SkeletonExt.js完整代碼：

cc.game.once(cc.game.EVENT_ENGINE_INITED, function () {

    cc.js.mixin(sp.Skeleton.prototype, {
        update (dt) {
            // if (CC_EDITOR) return;
            
            if (CC_EDITOR) {
                cc.engine._animatingInEditMode = 1;
                cc.engine.animatingInEditMode = 1;
            }

            if (this.paused) return;
    
            dt *= this.timeScale * sp.timeScale;
    
            if (this.isAnimationCached()) {
    
                // Cache mode and has animation queue.
                if (this._isAniComplete) {
                    if (this._animationQueue.length === 0 && !this._headAniInfo) {
                        let frameCache = this._frameCache;
                        if (frameCache && frameCache.isInvalid()) {
                            frameCache.updateToFrame();
                            let frames = frameCache.frames;
                            this._curFrame = frames[frames.length - 1];
                        }
                        return;
                    }
                    if (!this._headAniInfo) {
                        this._headAniInfo = this._animationQueue.shift();
                    }
                    this._accTime += dt;
                    if (this._accTime > this._headAniInfo.delay) {
                        let aniInfo = this._headAniInfo;
                        this._headAniInfo = null;
                        this.setAnimation (0, aniInfo.animationName, aniInfo.loop);
                    }
                    return;
                }
    
                this._updateCache(dt);
            } else {
                this._updateRealtime(dt);
            }
        }
    })

})

 

 方法二

粘貼如下代碼到任意文件里，不要放在onLoad等里面，放在最外面。

如下，代碼粘貼到SpineEx.ts里：

const { ccclass, property } = cc._decorator;

// 重寫update方法 達到在編輯模式下 自動播放動畫的功能
if (CC_EDITOR) {
    sp.Skeleton.prototype['update'] = function (dt) {
        if (CC_EDITOR) {
            cc['engine']._animatingInEditMode = 1;
            cc['engine'].animatingInEditMode = 1;
        }
        if (this.paused) return;

        dt *= this.timeScale * sp['timeScale'];

        if (this.isAnimationCached()) {

            // Cache mode and has animation queue.
            if (this._isAniComplete) {
                if (this._animationQueue.length === 0 && !this._headAniInfo) {
                    let frameCache = this._frameCache;
                    if (frameCache && frameCache.isInvalid()) {
                        frameCache.updateToFrame();
                        let frames = frameCache.frames;
                        this._curFrame = frames[frames.length - 1];
                    }
                    return;
                }
                if (!this._headAniInfo) {
                    this._headAniInfo = this._animationQueue.shift();
                }
                this._accTime += dt;
                if (this._accTime > this._headAniInfo.delay) {
                    let aniInfo = this._headAniInfo;
                    this._headAniInfo = null;
                    this.setAnimation(0, aniInfo.animationName, aniInfo.loop);
                }
                return;
            }

            this._updateCache(dt);
        } else {
            this._updateRealtime(dt);
        }
    }
}

@ccclass
export default class SpineEx {

}