@safe-engine/cocos 2.6.3 → 2.6.5

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/package.json

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