@safe-engine/cocos 2.5.9 → 2.5.10

package/dist/spine/PixiSpineSprite.js

@@ -0,0 +1,72 @@
+import { Spine } from '@esotericsoftware/spine-pixi-v8';
+import { Application, Assets } from 'pixi.js';
+export function loadSpineAssets({ skeleton, atlas, texture }) {
+    return Assets.load([skeleton, atlas, texture]);
+}
+export class PixiSpineSprite extends cc.Sprite {
+    _canvas;
+    _pixiApp;
+    _texture;
+    _config;
+    _armatureDisplay;
+    constructor(config) {
+        super();
+        super.ctor(); // always call this for compatibility with cocos2dx JS Javascript class system
+        this._canvas = document.createElement('canvas');
+        this._canvas.width = config.width || 1024;
+        this._canvas.height = config.height || 1024;
+        this._pixiApp = new Application();
+        this._pixiApp.init({
+            view: this._canvas,
+            width: this._canvas.width,
+            height: this._canvas.height,
+            backgroundAlpha: 0, // nền trong suốt
+            // transparent: true, // bắt buộc để alpha hoạt động
+            clearBeforeRender: true, // xoá trước khi vẽ frame mới
+            preserveDrawingBuffer: true, // giúp lấy ảnh từ canvas
+            antialias: true,
+        });
+        this._texture = new cc.Texture2D();
+        this._texture.initWithElement(this._canvas);
+        this._texture.handleLoadedTexture();
+        this.initWithTexture(this._texture);
+        this._config = config;
+        this._setupSpine();
+    }
+    _setupSpine() {
+        const { skeleton, atlas, loop, skin, timeScale, animationName } = this._config;
+        // console.log('_setupSpine', this._config, Assets.get(this._config.texture))
+        const display = Spine.from({ skeleton, atlas, scale: timeScale });
+        if (!display) {
+            console.error('Cannot build spine:', skeleton);
+            return;
+        }
+        if (skin) {
+            const skeletonData = display.skeleton.data;
+            const newSkin = skeletonData.findSkin(skin);
+            display.skeleton.setSkin(newSkin);
+            display.skeleton.setSlotsToSetupPose();
+        }
+        if (animationName)
+            display.state.setAnimation(0, animationName, loop);
+        display.x = this._canvas.width / 2;
+        display.y = this._canvas.height;
+        this._pixiApp.stage.addChild(display);
+        this._armatureDisplay = display;
+    }
+    updateTexture() {
+        if (this._armatureDisplay && this._pixiApp.renderer && this._texture) {
+            this._pixiApp.renderer.render(this._pixiApp.stage);
+            this._texture.initWithElement(this._canvas);
+            this._texture.handleLoadedTexture();
+            // console.log('updateTexture', this._texture.getPixelsHigh(), this._texture.getPixelsWide())
+            this.setTexture(this._texture);
+        }
+    }
+    onExit() {
+        // console.log('onExit')
+        this._pixiApp.destroy(true, { children: true });
+        this._canvas.remove();
+        super.onExit();
+    }
+}

package/dist/spine/SpineSkeleton.d.ts

@@ -11,7 +11,7 @@ interface SpineSkeletonProps {
     animation?: string;
     timeScale?: number;
     loop?: boolean;
-    onAnimationComplete?: any;
+    onAnimationComplete?: (animationName?: string, loopCount?: number) => void;
 }
 export declare class SpineSkeleton extends ComponentX<SpineSkeletonProps & BaseComponentProps<SpineSkeleton>, SkeletonAnimation> {
     set scaleX(flip: number);

package/dist/spine/SpineSkeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpineSkeleton.d.ts","sourceRoot":"","sources":["../../src/spine/SpineSkeleton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAA0B,IAAI,EAAE,MAAM,IAAI,CAAA;AACjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AAErE,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,UAAU,kBAAkB;IAC1B,IAAI,EAAE,SAAS,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,mBAAmB,CAAC,MAAA;CACrB;AACD,qBAAa,aAAc,SAAQ,UAAU,CAAC,kBAAkB,GAAG,kBAAkB,CAAC,aAAa,CAAC,EAAE,iBAAiB,CAAC;IACtH,IAAI,MAAM,CAAC,IAAI,EAAE,MAAM,EAGtB;IACD,gBAAgB;IAIhB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,UAAQ;IAOvC,eAAe,CAAC,IAAI,EAAE,SAAS;CAIhC;AAID,UAAU,+BAAgC,SAAQ,kBAAkB,CAAC,0BAA0B,CAAC;IAC9F,OAAO,EAAE,IAAI,EAAE,CAAA;IACf,SAAS,EAAE,MAAM,EAAE,CAAA;CACpB;AACD,qBAAa,0BAA2B,SAAQ,UAAU,CAAC,+BAA+B,EAAE,iBAAiB,CAAC;IAC5G,KAAK;CAYN"}
+{"version":3,"file":"SpineSkeleton.d.ts","sourceRoot":"","sources":["../../src/spine/SpineSkeleton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAA0B,IAAI,EAAE,MAAM,IAAI,CAAA;AACjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAA;AAErE,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,UAAU,kBAAkB;IAC1B,IAAI,EAAE,SAAS,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,mBAAmB,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3E;AACD,qBAAa,aAAc,SAAQ,UAAU,CAAC,kBAAkB,GAAG,kBAAkB,CAAC,aAAa,CAAC,EAAE,iBAAiB,CAAC;IACtH,IAAI,MAAM,CAAC,IAAI,EAAE,MAAM,EAGtB;IACD,gBAAgB;IAIhB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,UAAQ;IAOvC,eAAe,CAAC,IAAI,EAAE,SAAS;CAIhC;AAID,UAAU,+BAAgC,SAAQ,kBAAkB,CAAC,0BAA0B,CAAC;IAC9F,OAAO,EAAE,IAAI,EAAE,CAAA;IACf,SAAS,EAAE,MAAM,EAAE,CAAA;CACpB;AACD,qBAAa,0BAA2B,SAAQ,UAAU,CAAC,+BAA+B,EAAE,iBAAiB,CAAC;IAC5G,KAAK;CAYN"}

package/dist/spine/SpineSystem.js

@@ -27,7 +27,7 @@ export class SpineSystem {
         if (onAnimationComplete) {
             node.setCompleteListener((track, loopCount) => {
                 // console.log(track, loopCount)
-                onAnimationComplete(track, loopCount);
+                onAnimationComplete(track.animation.name, loopCount);
             });
         }
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@safe-engine/cocos",
-  "version": "2.5.9",
+  "version": "2.5.10",
   "description": "safe-engine with cocos renderer support",
   "type": "module",
   "main": "dist/index.js",