@eva/plugin-renderer 2.0.2-beta.3 → 2.1.0-beta.1

package/dist/plugin-renderer.esm.js

@@ -26,6 +26,10 @@ function __decorate(decorators, target, key, desc) {
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 }
 
+function __metadata(metadataKey, metadataValue) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
+}
+
 function __awaiter(thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -137,6 +141,22 @@ class RendererManager {
 }
 var RendererManager$1 = RendererManager;
 
+const toRenderBounds = (bounds, coordinateSpace, source) => {
+    const x = Number.isFinite(bounds.x) ? bounds.x : 0;
+    const y = Number.isFinite(bounds.y) ? bounds.y : 0;
+    const width = Number.isFinite(bounds.width) ? bounds.width : 0;
+    const height = Number.isFinite(bounds.height) ? bounds.height : 0;
+    return {
+        x,
+        y,
+        width,
+        height,
+        right: x + width,
+        bottom: y + height,
+        coordinateSpace,
+        source,
+    };
+};
 class ContainerManager {
     constructor() {
         this.containerMap = {};
@@ -148,6 +168,64 @@ class ContainerManager {
     getContainer(name) {
         return this.containerMap[name];
     }
+    /**
+     * Return actual rendered bounds for a GameObject.
+     *
+     * The primary path uses PixiJS Container#getBounds(), so renderers such as
+     * Text/Img/Graphics/Sprite/Spine report the real display size after loading
+     * and style application. If the display object is not ready yet, callers can
+     * fall back to Transform.size in the same Eva design/canvas coordinate space.
+     */
+    getBounds(gameObject, options = {}) {
+        if (!gameObject || gameObject.destroyed)
+            return null;
+        const coordinateSpace = options.coordinateSpace || 'world';
+        const fallbackToTransform = options.fallbackToTransform !== false;
+        const container = this.getContainer(gameObject.id);
+        if (container === null || container === void 0 ? void 0 : container.getBounds) {
+            try {
+                const bounds = container.getBounds();
+                if (bounds && Number.isFinite(bounds.width) && Number.isFinite(bounds.height) && (bounds.width !== 0 || bounds.height !== 0)) {
+                    return toRenderBounds(bounds, coordinateSpace, 'pixi');
+                }
+            }
+            catch (error) {
+                // Pixi can throw while async resources are still being attached; fallback below keeps editor tools stable.
+            }
+        }
+        if (!fallbackToTransform)
+            return null;
+        return this.getTransformBounds(gameObject, coordinateSpace);
+    }
+    getTransformBounds(gameObject, coordinateSpace) {
+        var _a, _b, _c, _d, _e, _f;
+        const transform = gameObject.transform;
+        const container = this.getContainer(gameObject.id);
+        let x = (_a = container === null || container === void 0 ? void 0 : container.worldTransform) === null || _a === void 0 ? void 0 : _a.tx;
+        let y = (_b = container === null || container === void 0 ? void 0 : container.worldTransform) === null || _b === void 0 ? void 0 : _b.ty;
+        if (!Number.isFinite(x) || !Number.isFinite(y)) {
+            const position = this.resolveFallbackWorldPosition(transform);
+            x = position.x;
+            y = position.y;
+        }
+        const scaleX = Number.isFinite((_c = transform.scale) === null || _c === void 0 ? void 0 : _c.x) ? transform.scale.x : 1;
+        const scaleY = Number.isFinite((_d = transform.scale) === null || _d === void 0 ? void 0 : _d.y) ? transform.scale.y : 1;
+        const width = Math.abs((((_e = transform.size) === null || _e === void 0 ? void 0 : _e.width) || 0) * scaleX);
+        const height = Math.abs((((_f = transform.size) === null || _f === void 0 ? void 0 : _f.height) || 0) * scaleY);
+        return toRenderBounds({ x, y, width, height }, coordinateSpace, 'transform');
+    }
+    resolveFallbackWorldPosition(transform) {
+        var _a, _b, _c, _d;
+        if (!transform)
+            return { x: 0, y: 0 };
+        const parent = transform.parent;
+        const parentPosition = parent ? this.resolveFallbackWorldPosition(parent) : { x: 0, y: 0 };
+        const parentSize = (parent === null || parent === void 0 ? void 0 : parent.size) || { width: 0, height: 0 };
+        return {
+            x: parentPosition.x + (((_a = transform.position) === null || _a === void 0 ? void 0 : _a.x) || 0) + parentSize.width * (((_b = transform.anchor) === null || _b === void 0 ? void 0 : _b.x) || 0),
+            y: parentPosition.y + (((_c = transform.position) === null || _c === void 0 ? void 0 : _c.y) || 0) + parentSize.height * (((_d = transform.anchor) === null || _d === void 0 ? void 0 : _d.y) || 0),
+        };
+    }
     removeContainer(name) {
         const container = this.containerMap[name];
         if (container) {
@@ -267,7 +345,8 @@ let Transform = class Transform extends EventEmitter {
 Transform = __decorate([
     decorators.componentObserver({
         Transform: ['_parent'],
-    })
+    }),
+    __metadata("design:paramtypes", [Object])
 ], Transform);
 var Transform$1 = Transform;
 
@@ -285,26 +364,42 @@ const enableScroll = renderer => {
     renderer.events.autoPreventDefault = false;
     renderer.canvas.style.touchAction = 'auto';
 };
+function isRendererGameLike(value) {
+    if (!value || typeof value !== 'object')
+        return false;
+    const candidate = value;
+    return Boolean(candidate.scene || candidate.gameObjects || typeof candidate.on === 'function');
+}
 let Renderer$1 = class Renderer extends System {
     constructor() {
         super(...arguments);
         this.multiApps = [];
+        this.destroyed = false;
     }
-    init(params) {
+    init(params = {}) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         return __awaiter(this, void 0, void 0, function* () {
-            this.params = params;
-            this.application = yield this.createApplication(params);
+            this.destroyed = false;
+            const gameLike = !this.game && isRendererGameLike(params) ? params : undefined;
+            if (gameLike) {
+                this.game = gameLike;
+            }
+            const rendererParams = gameLike ? this.__systemDefaultParams || {} : params;
+            this.params = rendererParams;
+            this.application = yield this.createApplication(rendererParams);
             this.containerManager = new ContainerManager();
             this.rendererManager = new RendererManager$1({
                 game: this.game,
                 rendererSystem: this,
             });
-            this.game.canvas = this.application.canvas;
+            if (this.game) {
+                this.game.canvas = this.application.canvas;
+            }
             this.transform = new Transform$1({
                 system: this,
                 containerManager: this.containerManager,
             });
-            this.game.on('sceneChanged', ({ scene, mode, params }) => __awaiter(this, void 0, void 0, function* () {
+            (_b = (_a = this.game) === null || _a === void 0 ? void 0 : _a.on) === null || _b === void 0 ? void 0 : _b.call(_a, 'sceneChanged', ({ scene, mode, params }) => __awaiter(this, void 0, void 0, function* () {
                 let application;
                 switch (mode) {
                     case LOAD_SCENE_MODE.SINGLE:
@@ -321,13 +416,13 @@ let Renderer$1 = class Renderer extends System {
                     application,
                 });
             }));
-            this.game.on('pauseScene', ({ scene }) => {
+            (_d = (_c = this.game) === null || _c === void 0 ? void 0 : _c.on) === null || _d === void 0 ? void 0 : _d.call(_c, 'pauseScene', ({ scene }) => {
                 this.onPauseScene(scene);
             });
-            this.game.on('startScene', ({ scene }) => {
+            (_f = (_e = this.game) === null || _e === void 0 ? void 0 : _e.on) === null || _f === void 0 ? void 0 : _f.call(_e, 'startScene', ({ scene }) => {
                 this.onStartScene(scene);
             });
-            this.game.on('sceneDestroyed', ({ scene }) => __awaiter(this, void 0, void 0, function* () {
+            (_h = (_g = this.game) === null || _g === void 0 ? void 0 : _g.on) === null || _h === void 0 ? void 0 : _h.call(_g, 'sceneDestroyed', ({ scene }) => __awaiter(this, void 0, void 0, function* () {
                 const index = this.multiApps.findIndex(app => app.canvas === scene.canvas);
                 if (index > -1) {
                     const app = this.multiApps.splice(index, 1)[0];
@@ -372,6 +467,8 @@ let Renderer$1 = class Renderer extends System {
         });
     }
     update() {
+        if (this.destroyed || !this.game || !this.containerManager || !this.rendererManager)
+            return;
         const changes = this.componentObserver.clear();
         for (const changed of changes) {
             this.transform.componentChanged(changed);
@@ -385,15 +482,23 @@ let Renderer$1 = class Renderer extends System {
         }
     }
     lateUpdate(e) {
+        if (this.destroyed || !this.transform || !this.application)
+            return;
         this.transform.update();
         this.application.ticker.update(e.time);
     }
     onDestroy() {
-        this.application.destroy();
+        var _a, _b, _c, _d, _e, _f, _g;
+        if (this.destroyed)
+            return;
+        this.destroyed = true;
+        (_c = (_b = (_a = this.application) === null || _a === void 0 ? void 0 : _a.ticker) === null || _b === void 0 ? void 0 : _b.stop) === null || _c === void 0 ? void 0 : _c.call(_b);
+        (_d = this.application) === null || _d === void 0 ? void 0 : _d.destroy(false, { children: true, context: true });
         for (const app of this.multiApps) {
-            app && app.destroy();
+            (_f = (_e = app === null || app === void 0 ? void 0 : app.ticker) === null || _e === void 0 ? void 0 : _e.stop) === null || _f === void 0 ? void 0 : _f.call(_e);
+            app && app.destroy(false, { children: true, context: true });
         }
-        this.transform.destroy();
+        (_g = this.transform) === null || _g === void 0 ? void 0 : _g.destroy();
         this.transform = null;
         this.params = null;
         this.rendererManager = null;
@@ -402,11 +507,102 @@ let Renderer$1 = class Renderer extends System {
         this.game = null;
         this.multiApps = null;
     }
-    resize(width, height) {
+    resize(width, height, resolution) {
         this.params.width = width;
         this.params.height = height;
+        if (resolution != null) {
+            this.params.resolution = this.clampResolution(resolution);
+        }
         // @ts-ignore
-        this.application.renderer.resize(width, height);
+        this.application.renderer.resize(width, height, this.params.resolution);
+        if (resolution != null) {
+            this.syncDisplayObjectResolution(this.params.resolution);
+        }
+    }
+    /**
+     * 更新 Pixi renderer backing-store resolution，不改变 Eva 设计坐标系。
+     *
+     * 预览画布可用该入口在 zoom/devicePixelRatio 变化时提高清晰度；
+     * getBounds/Transform/worldTransform 仍返回设计逻辑坐标，不乘 resolution。
+     */
+    resizeRenderer(options) {
+        var _a, _b, _c, _d, _e, _f;
+        const width = (_b = (_a = options.width) !== null && _a !== void 0 ? _a : this.params.width) !== null && _b !== void 0 ? _b : this.application.renderer.width;
+        const height = (_d = (_c = options.height) !== null && _c !== void 0 ? _c : this.params.height) !== null && _d !== void 0 ? _d : this.application.renderer.height;
+        const resolution = options.resolution == null
+            ? (_f = (_e = this.params.resolution) !== null && _e !== void 0 ? _e : this.application.renderer.resolution) !== null && _f !== void 0 ? _f : 1
+            : this.clampResolution(options.resolution, options.maxResolution);
+        this.params.width = width;
+        this.params.height = height;
+        this.params.resolution = resolution;
+        // @ts-ignore Pixi v8 accepts resolution as the third resize argument.
+        this.application.renderer.resize(width, height, resolution);
+        const displayResolutionSyncCount = this.syncDisplayObjectResolution(resolution);
+        return { width, height, resolution, displayResolutionSyncCount };
+    }
+    setResolution(resolution, options = {}) {
+        return this.resizeRenderer(Object.assign(Object.assign({}, options), { resolution }));
+    }
+    clampResolution(resolution, maxResolution = 3) {
+        const normalized = Number.isFinite(resolution) && resolution > 0 ? resolution : 1;
+        return Math.min(normalized, maxResolution);
+    }
+    /**
+     * Keep renderer-owned display objects that expose a resolution property in
+     * sync with the backing-store resolution. This is intentionally display-tree
+     * based rather than component-type based, so Text/HTMLText and future Pixi
+     * objects with resolution support all follow the same renderer contract.
+     */
+    syncDisplayObjectResolution(resolution) {
+        var _a;
+        const roots = ((_a = this.containerManager) === null || _a === void 0 ? void 0 : _a.containerMap) ? Object.values(this.containerManager.containerMap) : [];
+        const visited = typeof WeakSet !== 'undefined' ? new WeakSet() : undefined;
+        let syncedCount = 0;
+        const visit = (displayObject) => {
+            if (!displayObject || typeof displayObject !== 'object')
+                return;
+            if (visited === null || visited === void 0 ? void 0 : visited.has(displayObject))
+                return;
+            visited === null || visited === void 0 ? void 0 : visited.add(displayObject);
+            if ('resolution' in displayObject) {
+                const currentResolution = displayObject.resolution;
+                if ((typeof currentResolution === 'number' || currentResolution === null) &&
+                    Math.abs((currentResolution !== null && currentResolution !== void 0 ? currentResolution : 1) - resolution) > 0.001) {
+                    try {
+                        displayObject.resolution = resolution;
+                        if (typeof displayObject.resolution === 'number' &&
+                            Math.abs(displayObject.resolution - resolution) <= 0.001) {
+                            syncedCount += 1;
+                        }
+                    }
+                    catch (_) {
+                        // Some Pixi objects expose a readonly or unsupported resolution setter.
+                    }
+                }
+            }
+            if (Array.isArray(displayObject.children)) {
+                for (const child of displayObject.children) {
+                    visit(child);
+                }
+            }
+        };
+        for (const root of roots) {
+            visit(root);
+        }
+        return syncedCount;
+    }
+    /**
+     * 获取 GameObject 的真实渲染 bounds。
+     *
+     * 默认返回 PixiJS display object 的 world bounds。Eva 的 Pixi world 坐标
+     * 与 canvas/design 逻辑坐标一致；如果画布被 CSS 缩放，调用方再按
+     * canvas.getBoundingClientRect() / renderer width 做屏幕坐标换算。
+     *
+     * 当渲染对象尚未挂载或资源未加载完成时，会回退到 Transform.size。
+     */
+    getBounds(gameObject, options) {
+        var _a;
+        return ((_a = this.containerManager) === null || _a === void 0 ? void 0 : _a.getBounds(gameObject, options)) || null;
     }
     getApplicationByScene(scene) {
         const index = this.multiApps.findIndex(app => app.canvas === scene.canvas);
@@ -430,11 +626,11 @@ let Renderer$1 = class Renderer extends System {
             app.start();
         }
     }
-    resizeByScene(scene, width, height) {
+    resizeByScene(scene, width, height, resolution) {
         const app = this.getApplicationByScene(scene);
         if (app) {
             // @ts-ignore
-            app.renderer.resize(width, height);
+            app.renderer.resize(width, height, resolution);
         }
     }
 };
@@ -527,7 +723,7 @@ class Renderer extends System {
      * 每帧调用
      *
      * called by every loop
-     * @param _gameObject gameObject
+     * @param _gameObject - gameObject
      */
     rendererUpdate(_gameObject) { }
     // @ts-ignore

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eva/plugin-renderer",
-  "version": "2.0.2-beta.3",
+  "version": "2.1.0-beta.1",
   "description": "@eva/plugin-renderer",
   "main": "index.js",
   "module": "dist/plugin-renderer.esm.js",
@@ -18,8 +18,8 @@
   "license": "MIT",
   "homepage": "https://eva.js.org",
   "dependencies": {
-    "@eva/eva.js": "2.0.2-beta.3",
-    "@eva/renderer-adapter": "2.0.2-beta.3",
+    "@eva/eva.js": "2.1.0-beta.1",
+    "@eva/renderer-adapter": "2.1.0-beta.1",
     "eventemitter3": "^5.0.4",
     "lodash-es": "^4.17.21",
     "pixi.js": "^8.17.0"