@eva/plugin-renderer-render 2.1.0-beta.3 → 2.1.0-beta.4

package/dist/EVA.plugin.renderer.render.js

@@ -0,0 +1,126 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+globalThis.EVA = globalThis.EVA || {};
+globalThis.EVA.plugin = globalThis.EVA.plugin || {};
+globalThis.EVA.plugin.renderer = globalThis.EVA.plugin.renderer || {};
+var _EVA_IIFE_render = function (exports, eva_js, pluginRenderer) {
+  'use strict';
+  function __decorate(decorators, target, key, desc) {
+    var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    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);
+  }
+  typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+  };
+  class Render$2 extends eva_js.Component {
+    constructor() {
+      super(...arguments);
+      this.sortDirty = false;
+      this.visible = true;
+      this.alpha = 1;
+      this.zIndex = 0;
+      this.sortableChildren = false;
+      this.resolution = 1;
+    }
+    init(obj) {
+      obj && _extends(this, obj);
+    }
+  }
+  Render$2.componentName = 'Render';
+  __decorate([eva_js.type('boolean'), __metadata("design:type", Boolean)], Render$2.prototype, "visible", void 0);
+  __decorate([eva_js.type('number'), eva_js.step(0.1), __metadata("design:type", Number)], Render$2.prototype, "alpha", void 0);
+  __decorate([eva_js.type('number'), eva_js.step(1), __metadata("design:type", Number)], Render$2.prototype, "zIndex", void 0);
+  __decorate([eva_js.type('boolean'), __metadata("design:type", Boolean)], Render$2.prototype, "sortableChildren", void 0);
+  __decorate([eva_js.type('number'), eva_js.step(0.1), __metadata("design:type", Number)], Render$2.prototype, "resolution", void 0);
+  let Render = class Render extends pluginRenderer.Renderer {
+    constructor() {
+      super(...arguments);
+      this.name = 'Render';
+    }
+    init() {
+      this.renderSystem = this.game.getSystem(pluginRenderer.RendererSystem);
+      this.renderSystem.rendererManager.register(this);
+    }
+    rendererUpdate(gameObject) {
+      const component = gameObject.getComponent('Render');
+      const container = this.containerManager.getContainer(gameObject.id);
+      container.alpha = component.alpha;
+      container.visible = component.visible;
+      container.zIndex = component.zIndex;
+    }
+    componentChanged(changed) {
+      if (changed.type === eva_js.OBSERVER_TYPE.ADD || changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
+        this.add(changed);
+      }
+      if (changed.type === eva_js.OBSERVER_TYPE.CHANGE) {
+        this.change(changed);
+      }
+      if (changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
+        this.remove(changed);
+      }
+    }
+    add(changed) {
+      if (changed.component.name === 'Render') {
+        this.setDirty(changed);
+        const component = changed.component;
+        const container = this.containerManager.getContainer(changed.gameObject.id);
+        if (component.resolution !== undefined && component.resolution > 0) {
+          this.applyResolution(container, component.resolution);
+        }
+      }
+    }
+    change(changed) {
+      if (changed.component.name === 'Render') {
+        if (changed.prop.prop[0] === 'zIndex') {
+          this.setDirty(changed);
+        } else if (changed.prop.prop[0] === 'resolution') {
+          const component = changed.component;
+          const container = this.containerManager.getContainer(changed.gameObject.id);
+          if (component.resolution !== undefined && component.resolution > 0) {
+            this.applyResolution(container, component.resolution);
+          }
+        }
+      }
+    }
+    remove(changed) {
+      if (changed.component.name === 'Render') {
+        const container = this.containerManager.getContainer(changed.gameObject.id);
+        container.alpha = 1;
+      }
+    }
+    setDirty(changed) {
+      const parentRender = changed.gameObject.parent && changed.gameObject.parent.getComponent('Render');
+      if (parentRender) {
+        parentRender.sortDirty = true;
+      }
+    }
+    applyResolution(container, resolution) {
+      if (!container) return;
+      window.requestAnimationFrame(() => {
+        if (container.children && Array.isArray(container.children)) {
+          for (const child of container.children) {
+            child.resolution = resolution;
+          }
+        }
+      });
+    }
+  };
+  Render.systemName = 'Render';
+  Render = __decorate([eva_js.decorators.componentObserver({
+    Render: ['zIndex', 'resolution']
+  })], Render);
+  var Render$1 = Render;
+  exports.Render = Render$2;
+  exports.RenderSystem = Render$1;
+  Object.defineProperty(exports, '__esModule', {
+    value: true
+  });
+  return exports;
+}({}, EVA, EVA.plugin.renderer);
+globalThis.EVA.plugin.renderer.render = globalThis.EVA.plugin.renderer.render || _EVA_IIFE_render;

package/dist/EVA.plugin.renderer.render.min.js

@@ -0,0 +1 @@
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},_extends.apply(null,arguments)}globalThis.EVA=globalThis.EVA||{},globalThis.EVA.plugin=globalThis.EVA.plugin||{},globalThis.EVA.plugin.renderer=globalThis.EVA.plugin.renderer||{};var _EVA_IIFE_render=function(e,t,n){"use strict";function r(e,t,n,r){var o,i=arguments.length,s=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,n):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,r);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(i<3?o(s):i>3?o(t,n,s):o(t,n))||s);return i>3&&s&&Object.defineProperty(t,n,s),s}function o(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}"function"==typeof SuppressedError&&SuppressedError;class i extends t.Component{constructor(){super(...arguments),this.sortDirty=!1,this.visible=!0,this.alpha=1,this.zIndex=0,this.sortableChildren=!1,this.resolution=1}init(e){e&&_extends(this,e)}}i.componentName="Render",r([t.type("boolean"),o("design:type",Boolean)],i.prototype,"visible",void 0),r([t.type("number"),t.step(.1),o("design:type",Number)],i.prototype,"alpha",void 0),r([t.type("number"),t.step(1),o("design:type",Number)],i.prototype,"zIndex",void 0),r([t.type("boolean"),o("design:type",Boolean)],i.prototype,"sortableChildren",void 0),r([t.type("number"),t.step(.1),o("design:type",Number)],i.prototype,"resolution",void 0);let s=class extends n.Renderer{constructor(){super(...arguments),this.name="Render"}init(){this.renderSystem=this.game.getSystem(n.RendererSystem),this.renderSystem.rendererManager.register(this)}rendererUpdate(e){const t=e.getComponent("Render"),n=this.containerManager.getContainer(e.id);n.alpha=t.alpha,n.visible=t.visible,n.zIndex=t.zIndex}componentChanged(e){e.type!==t.OBSERVER_TYPE.ADD&&e.type!==t.OBSERVER_TYPE.REMOVE||this.add(e),e.type===t.OBSERVER_TYPE.CHANGE&&this.change(e),e.type===t.OBSERVER_TYPE.REMOVE&&this.remove(e)}add(e){if("Render"===e.component.name){this.setDirty(e);const t=e.component,n=this.containerManager.getContainer(e.gameObject.id);void 0!==t.resolution&&t.resolution>0&&this.applyResolution(n,t.resolution)}}change(e){if("Render"===e.component.name)if("zIndex"===e.prop.prop[0])this.setDirty(e);else if("resolution"===e.prop.prop[0]){const t=e.component,n=this.containerManager.getContainer(e.gameObject.id);void 0!==t.resolution&&t.resolution>0&&this.applyResolution(n,t.resolution)}}remove(e){if("Render"===e.component.name){this.containerManager.getContainer(e.gameObject.id).alpha=1}}setDirty(e){const t=e.gameObject.parent&&e.gameObject.parent.getComponent("Render");t&&(t.sortDirty=!0)}applyResolution(e,t){e&&window.requestAnimationFrame(()=>{if(e.children&&Array.isArray(e.children))for(const n of e.children)n.resolution=t})}};s.systemName="Render",s=r([t.decorators.componentObserver({Render:["zIndex","resolution"]})],s);var a=s;return e.Render=i,e.RenderSystem=a,Object.defineProperty(e,"__esModule",{value:!0}),e}({},EVA,EVA.plugin.renderer);globalThis.EVA.plugin.renderer.render=globalThis.EVA.plugin.renderer.render||_EVA_IIFE_render;

package/dist/plugin-renderer-render.cjs.js

@@ -0,0 +1,238 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var eva_js = require('@eva/eva.js');
+var pluginRenderer = require('@eva/plugin-renderer');
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    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);
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+/**
+ * 渲染属性组件
+ *
+ * Render 组件控制游戏对象的渲染相关属性，如可见性、透明度、层级等。
+ * 这些属性影响对象的显示效果和渲染顺序，
+ * 适用于需要控制显示状态、淡入淡出、层级排序等场景。
+ *
+ * 主要属性：
+ * - visible - 控制对象是否可见
+ * - alpha - 控制对象透明度（0-1）
+ * - zIndex - 控制对象渲染层级
+ * - sortableChildren - 是否对子对象按 zIndex 排序
+ * - resolution - 渲染分辨率，值越大越清晰但性能消耗越大
+ *
+ * @example
+ * ```typescript
+ * // 创建带渲染属性的对象
+ * const sprite = new GameObject('sprite');
+ * sprite.addComponent(new Img({ resource: 'player' }));
+ * sprite.addComponent(new Render({
+ *   visible: true,
+ *   alpha: 1,
+ *   zIndex: 10
+ * }));
+ *
+ * // 控制可见性
+ * const render = sprite.getComponent('Render');
+ * render.visible = false; // 隐藏对象
+ *
+ * // 淡入淡出效果
+ * let alpha = 1;
+ * setInterval(() => {
+ *   alpha -= 0.01;
+ *   if (alpha <= 0) alpha = 1;
+ *   render.alpha = alpha;
+ * }, 16);
+ *
+ * // 设置渲染层级
+ * render.zIndex = 100; // 越大越靠前
+ *
+ * // 启用子对象排序
+ * const container = new GameObject('container');
+ * container.addComponent(new Render({
+ *   sortableChildren: true // 子对象将按 zIndex 排序
+ * }));
+ *
+ * // 设置渲染分辨率
+ * const text = new GameObject('text');
+ * text.addComponent(new Text({ text: 'High Resolution' }));
+ * text.addComponent(new Render({
+ *   resolution: 2 // 2倍分辨率，使渲染更清晰
+ * }));
+ * ```
+ */
+class Render$2 extends eva_js.Component {
+    constructor() {
+        super(...arguments);
+        /** 排序脏标记 */
+        this.sortDirty = false;
+        /** 是否可见 */
+        this.visible = true;
+        /** 透明度（0-1，0 为完全透明，1 为完全不透明） */
+        this.alpha = 1;
+        /** 渲染层级（数值越大越靠前） */
+        this.zIndex = 0;
+        /** 是否对子对象按 zIndex 排序 */
+        this.sortableChildren = false;
+        /** 渲染分辨率（值越大越清晰但性能消耗越大，默认为 1） */
+        this.resolution = 1;
+    }
+    /**
+     * 初始化组件
+     * @param obj - 初始化参数
+     * @param obj.visible - 是否可见
+     * @param obj.alpha - 透明度
+     * @param obj.zIndex - 渲染层级
+     * @param obj.sortableChildren - 是否对子对象排序
+     * @param obj.resolution - 渲染分辨率
+     */
+    init(obj) {
+        obj && Object.assign(this, obj);
+    }
+}
+/** 组件名称 */
+Render$2.componentName = 'Render';
+__decorate([
+    eva_js.type('boolean'),
+    __metadata("design:type", Boolean)
+], Render$2.prototype, "visible", void 0);
+__decorate([
+    eva_js.type('number'),
+    eva_js.step(0.1),
+    __metadata("design:type", Number)
+], Render$2.prototype, "alpha", void 0);
+__decorate([
+    eva_js.type('number'),
+    eva_js.step(1),
+    __metadata("design:type", Number)
+], Render$2.prototype, "zIndex", void 0);
+__decorate([
+    eva_js.type('boolean'),
+    __metadata("design:type", Boolean)
+], Render$2.prototype, "sortableChildren", void 0);
+__decorate([
+    eva_js.type('number'),
+    eva_js.step(0.1),
+    __metadata("design:type", Number)
+], Render$2.prototype, "resolution", void 0);
+
+let Render = class Render extends pluginRenderer.Renderer {
+    constructor() {
+        super(...arguments);
+        this.name = 'Render';
+    }
+    init() {
+        this.renderSystem = this.game.getSystem(pluginRenderer.RendererSystem);
+        this.renderSystem.rendererManager.register(this);
+    }
+    rendererUpdate(gameObject) {
+        const component = gameObject.getComponent('Render');
+        const container = this.containerManager.getContainer(gameObject.id);
+        container.alpha = component.alpha;
+        container.visible = component.visible;
+        container.zIndex = component.zIndex;
+    }
+    componentChanged(changed) {
+        if (changed.type === eva_js.OBSERVER_TYPE.ADD || changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
+            this.add(changed);
+        }
+        if (changed.type === eva_js.OBSERVER_TYPE.CHANGE) {
+            this.change(changed);
+        }
+        if (changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
+            this.remove(changed);
+        }
+    }
+    add(changed) {
+        if (changed.component.name === 'Render') {
+            this.setDirty(changed);
+            // 初始化时应用 resolution
+            const component = changed.component;
+            const container = this.containerManager.getContainer(changed.gameObject.id);
+            if (component.resolution !== undefined && component.resolution > 0) {
+                this.applyResolution(container, component.resolution);
+            }
+        }
+    }
+    change(changed) {
+        if (changed.component.name === 'Render') {
+            if (changed.prop.prop[0] === 'zIndex') {
+                this.setDirty(changed);
+            }
+            else if (changed.prop.prop[0] === 'resolution') {
+                // 当 resolution 改变时，重新应用到子对象
+                const component = changed.component;
+                const container = this.containerManager.getContainer(changed.gameObject.id);
+                if (component.resolution !== undefined && component.resolution > 0) {
+                    this.applyResolution(container, component.resolution);
+                }
+            }
+        }
+    }
+    remove(changed) {
+        if (changed.component.name === 'Render') {
+            const container = this.containerManager.getContainer(changed.gameObject.id);
+            container.alpha = 1;
+        }
+    }
+    setDirty(changed) {
+        const parentRender = changed.gameObject.parent && changed.gameObject.parent.getComponent('Render');
+        if (parentRender) {
+            parentRender.sortDirty = true;
+        }
+    }
+    /**
+     * 递归应用 resolution 到容器中所有支持该属性的子对象
+     */
+    applyResolution(container, resolution) {
+        if (!container)
+            return;
+        window.requestAnimationFrame(() => {
+            // 遍历容器的所有子对象
+            if (container.children && Array.isArray(container.children)) {
+                for (const child of container.children) {
+                    child.resolution = resolution;
+                }
+            }
+        });
+    }
+};
+Render.systemName = 'Render';
+Render = __decorate([
+    eva_js.decorators.componentObserver({
+        Render: ['zIndex', 'resolution'],
+    })
+], Render);
+var Render$1 = Render;
+
+exports.Render = Render$2;
+exports.RenderSystem = Render$1;

package/dist/plugin-renderer-render.cjs.prod.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@eva/eva.js"),t=require("@eva/plugin-renderer");function n(e,t,n,r){var o,i=arguments.length,s=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,n):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,r);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(i<3?o(s):i>3?o(t,n,s):o(t,n))||s);return i>3&&s&&Object.defineProperty(t,n,s),s}function r(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}"function"==typeof SuppressedError&&SuppressedError;class o extends e.Component{constructor(){super(...arguments),this.sortDirty=!1,this.visible=!0,this.alpha=1,this.zIndex=0,this.sortableChildren=!1,this.resolution=1}init(e){e&&Object.assign(this,e)}}o.componentName="Render",n([e.type("boolean"),r("design:type",Boolean)],o.prototype,"visible",void 0),n([e.type("number"),e.step(.1),r("design:type",Number)],o.prototype,"alpha",void 0),n([e.type("number"),e.step(1),r("design:type",Number)],o.prototype,"zIndex",void 0),n([e.type("boolean"),r("design:type",Boolean)],o.prototype,"sortableChildren",void 0),n([e.type("number"),e.step(.1),r("design:type",Number)],o.prototype,"resolution",void 0);let i=class extends t.Renderer{constructor(){super(...arguments),this.name="Render"}init(){this.renderSystem=this.game.getSystem(t.RendererSystem),this.renderSystem.rendererManager.register(this)}rendererUpdate(e){const t=e.getComponent("Render"),n=this.containerManager.getContainer(e.id);n.alpha=t.alpha,n.visible=t.visible,n.zIndex=t.zIndex}componentChanged(t){t.type!==e.OBSERVER_TYPE.ADD&&t.type!==e.OBSERVER_TYPE.REMOVE||this.add(t),t.type===e.OBSERVER_TYPE.CHANGE&&this.change(t),t.type===e.OBSERVER_TYPE.REMOVE&&this.remove(t)}add(e){if("Render"===e.component.name){this.setDirty(e);const t=e.component,n=this.containerManager.getContainer(e.gameObject.id);void 0!==t.resolution&&t.resolution>0&&this.applyResolution(n,t.resolution)}}change(e){if("Render"===e.component.name)if("zIndex"===e.prop.prop[0])this.setDirty(e);else if("resolution"===e.prop.prop[0]){const t=e.component,n=this.containerManager.getContainer(e.gameObject.id);void 0!==t.resolution&&t.resolution>0&&this.applyResolution(n,t.resolution)}}remove(e){if("Render"===e.component.name){this.containerManager.getContainer(e.gameObject.id).alpha=1}}setDirty(e){const t=e.gameObject.parent&&e.gameObject.parent.getComponent("Render");t&&(t.sortDirty=!0)}applyResolution(e,t){e&&window.requestAnimationFrame(()=>{if(e.children&&Array.isArray(e.children))for(const n of e.children)n.resolution=t})}};i.systemName="Render",i=n([e.decorators.componentObserver({Render:["zIndex","resolution"]})],i);var s=i;exports.Render=o,exports.RenderSystem=s;

package/dist/plugin-renderer-render.d.ts

@@ -0,0 +1,117 @@
+import { Component } from '@eva/eva.js';
+import { ComponentChanged } from '@eva/eva.js';
+import { ContainerManager } from '@eva/plugin-renderer';
+import { GameObject } from '@eva/eva.js';
+import { Renderer } from '@eva/plugin-renderer';
+import { RendererManager } from '@eva/plugin-renderer';
+import { RendererSystem } from '@eva/plugin-renderer';
+
+/**
+ * 渲染属性组件
+ *
+ * Render 组件控制游戏对象的渲染相关属性，如可见性、透明度、层级等。
+ * 这些属性影响对象的显示效果和渲染顺序，
+ * 适用于需要控制显示状态、淡入淡出、层级排序等场景。
+ *
+ * 主要属性：
+ * - visible - 控制对象是否可见
+ * - alpha - 控制对象透明度（0-1）
+ * - zIndex - 控制对象渲染层级
+ * - sortableChildren - 是否对子对象按 zIndex 排序
+ * - resolution - 渲染分辨率，值越大越清晰但性能消耗越大
+ *
+ * @example
+ * ```typescript
+ * // 创建带渲染属性的对象
+ * const sprite = new GameObject('sprite');
+ * sprite.addComponent(new Img({ resource: 'player' }));
+ * sprite.addComponent(new Render({
+ *   visible: true,
+ *   alpha: 1,
+ *   zIndex: 10
+ * }));
+ *
+ * // 控制可见性
+ * const render = sprite.getComponent('Render');
+ * render.visible = false; // 隐藏对象
+ *
+ * // 淡入淡出效果
+ * let alpha = 1;
+ * setInterval(() => {
+ *   alpha -= 0.01;
+ *   if (alpha <= 0) alpha = 1;
+ *   render.alpha = alpha;
+ * }, 16);
+ *
+ * // 设置渲染层级
+ * render.zIndex = 100; // 越大越靠前
+ *
+ * // 启用子对象排序
+ * const container = new GameObject('container');
+ * container.addComponent(new Render({
+ *   sortableChildren: true // 子对象将按 zIndex 排序
+ * }));
+ *
+ * // 设置渲染分辨率
+ * const text = new GameObject('text');
+ * text.addComponent(new Text({ text: 'High Resolution' }));
+ * text.addComponent(new Render({
+ *   resolution: 2 // 2倍分辨率，使渲染更清晰
+ * }));
+ * ```
+ */
+export declare class Render extends Component<RenderParams> {
+    /** 组件名称 */
+    static componentName: string;
+    /** 排序脏标记 */
+    sortDirty: boolean;
+    /** 是否可见 */
+    visible: boolean;
+    /** 透明度（0-1，0 为完全透明，1 为完全不透明） */
+    alpha: number;
+    /** 渲染层级（数值越大越靠前） */
+    zIndex: number;
+    /** 是否对子对象按 zIndex 排序 */
+    sortableChildren: boolean;
+    /** 渲染分辨率（值越大越清晰但性能消耗越大，默认为 1） */
+    resolution: number;
+    /**
+     * 初始化组件
+     * @param obj - 初始化参数
+     * @param obj.visible - 是否可见
+     * @param obj.alpha - 透明度
+     * @param obj.zIndex - 渲染层级
+     * @param obj.sortableChildren - 是否对子对象排序
+     * @param obj.resolution - 渲染分辨率
+     */
+    init(obj?: RenderParams): void;
+}
+
+export declare interface RenderParams {
+    alpha?: number;
+    zIndex?: number;
+    visible?: boolean;
+    sortableChildren?: boolean;
+    resolution?: number;
+}
+
+export declare class RenderSystem extends Renderer {
+    static systemName: string;
+    name: string;
+    renderSystem: RendererSystem;
+    rendererManager: RendererManager;
+    containerManager: ContainerManager;
+    init(): void;
+    rendererUpdate(gameObject: GameObject): void;
+    componentChanged(changed: ComponentChanged): void;
+    add(changed: ComponentChanged): void;
+    change(changed: ComponentChanged): void;
+    remove(changed: ComponentChanged): void;
+    setDirty(changed: ComponentChanged): void;
+    /**
+     * 递归应用 resolution 到容器中所有支持该属性的子对象
+     */
+    private applyResolution;
+}
+
+export { }

package/dist/plugin-renderer-render.esm.js

@@ -0,0 +1,233 @@
+import { Component, type, step, OBSERVER_TYPE, decorators } from '@eva/eva.js';
+import { Renderer, RendererSystem } from '@eva/plugin-renderer';
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    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);
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+/**
+ * 渲染属性组件
+ *
+ * Render 组件控制游戏对象的渲染相关属性，如可见性、透明度、层级等。
+ * 这些属性影响对象的显示效果和渲染顺序，
+ * 适用于需要控制显示状态、淡入淡出、层级排序等场景。
+ *
+ * 主要属性：
+ * - visible - 控制对象是否可见
+ * - alpha - 控制对象透明度（0-1）
+ * - zIndex - 控制对象渲染层级
+ * - sortableChildren - 是否对子对象按 zIndex 排序
+ * - resolution - 渲染分辨率，值越大越清晰但性能消耗越大
+ *
+ * @example
+ * ```typescript
+ * // 创建带渲染属性的对象
+ * const sprite = new GameObject('sprite');
+ * sprite.addComponent(new Img({ resource: 'player' }));
+ * sprite.addComponent(new Render({
+ *   visible: true,
+ *   alpha: 1,
+ *   zIndex: 10
+ * }));
+ *
+ * // 控制可见性
+ * const render = sprite.getComponent('Render');
+ * render.visible = false; // 隐藏对象
+ *
+ * // 淡入淡出效果
+ * let alpha = 1;
+ * setInterval(() => {
+ *   alpha -= 0.01;
+ *   if (alpha <= 0) alpha = 1;
+ *   render.alpha = alpha;
+ * }, 16);
+ *
+ * // 设置渲染层级
+ * render.zIndex = 100; // 越大越靠前
+ *
+ * // 启用子对象排序
+ * const container = new GameObject('container');
+ * container.addComponent(new Render({
+ *   sortableChildren: true // 子对象将按 zIndex 排序
+ * }));
+ *
+ * // 设置渲染分辨率
+ * const text = new GameObject('text');
+ * text.addComponent(new Text({ text: 'High Resolution' }));
+ * text.addComponent(new Render({
+ *   resolution: 2 // 2倍分辨率，使渲染更清晰
+ * }));
+ * ```
+ */
+class Render$2 extends Component {
+    constructor() {
+        super(...arguments);
+        /** 排序脏标记 */
+        this.sortDirty = false;
+        /** 是否可见 */
+        this.visible = true;
+        /** 透明度（0-1，0 为完全透明，1 为完全不透明） */
+        this.alpha = 1;
+        /** 渲染层级（数值越大越靠前） */
+        this.zIndex = 0;
+        /** 是否对子对象按 zIndex 排序 */
+        this.sortableChildren = false;
+        /** 渲染分辨率（值越大越清晰但性能消耗越大，默认为 1） */
+        this.resolution = 1;
+    }
+    /**
+     * 初始化组件
+     * @param obj - 初始化参数
+     * @param obj.visible - 是否可见
+     * @param obj.alpha - 透明度
+     * @param obj.zIndex - 渲染层级
+     * @param obj.sortableChildren - 是否对子对象排序
+     * @param obj.resolution - 渲染分辨率
+     */
+    init(obj) {
+        obj && Object.assign(this, obj);
+    }
+}
+/** 组件名称 */
+Render$2.componentName = 'Render';
+__decorate([
+    type('boolean'),
+    __metadata("design:type", Boolean)
+], Render$2.prototype, "visible", void 0);
+__decorate([
+    type('number'),
+    step(0.1),
+    __metadata("design:type", Number)
+], Render$2.prototype, "alpha", void 0);
+__decorate([
+    type('number'),
+    step(1),
+    __metadata("design:type", Number)
+], Render$2.prototype, "zIndex", void 0);
+__decorate([
+    type('boolean'),
+    __metadata("design:type", Boolean)
+], Render$2.prototype, "sortableChildren", void 0);
+__decorate([
+    type('number'),
+    step(0.1),
+    __metadata("design:type", Number)
+], Render$2.prototype, "resolution", void 0);
+
+let Render = class Render extends Renderer {
+    constructor() {
+        super(...arguments);
+        this.name = 'Render';
+    }
+    init() {
+        this.renderSystem = this.game.getSystem(RendererSystem);
+        this.renderSystem.rendererManager.register(this);
+    }
+    rendererUpdate(gameObject) {
+        const component = gameObject.getComponent('Render');
+        const container = this.containerManager.getContainer(gameObject.id);
+        container.alpha = component.alpha;
+        container.visible = component.visible;
+        container.zIndex = component.zIndex;
+    }
+    componentChanged(changed) {
+        if (changed.type === OBSERVER_TYPE.ADD || changed.type === OBSERVER_TYPE.REMOVE) {
+            this.add(changed);
+        }
+        if (changed.type === OBSERVER_TYPE.CHANGE) {
+            this.change(changed);
+        }
+        if (changed.type === OBSERVER_TYPE.REMOVE) {
+            this.remove(changed);
+        }
+    }
+    add(changed) {
+        if (changed.component.name === 'Render') {
+            this.setDirty(changed);
+            // 初始化时应用 resolution
+            const component = changed.component;
+            const container = this.containerManager.getContainer(changed.gameObject.id);
+            if (component.resolution !== undefined && component.resolution > 0) {
+                this.applyResolution(container, component.resolution);
+            }
+        }
+    }
+    change(changed) {
+        if (changed.component.name === 'Render') {
+            if (changed.prop.prop[0] === 'zIndex') {
+                this.setDirty(changed);
+            }
+            else if (changed.prop.prop[0] === 'resolution') {
+                // 当 resolution 改变时，重新应用到子对象
+                const component = changed.component;
+                const container = this.containerManager.getContainer(changed.gameObject.id);
+                if (component.resolution !== undefined && component.resolution > 0) {
+                    this.applyResolution(container, component.resolution);
+                }
+            }
+        }
+    }
+    remove(changed) {
+        if (changed.component.name === 'Render') {
+            const container = this.containerManager.getContainer(changed.gameObject.id);
+            container.alpha = 1;
+        }
+    }
+    setDirty(changed) {
+        const parentRender = changed.gameObject.parent && changed.gameObject.parent.getComponent('Render');
+        if (parentRender) {
+            parentRender.sortDirty = true;
+        }
+    }
+    /**
+     * 递归应用 resolution 到容器中所有支持该属性的子对象
+     */
+    applyResolution(container, resolution) {
+        if (!container)
+            return;
+        window.requestAnimationFrame(() => {
+            // 遍历容器的所有子对象
+            if (container.children && Array.isArray(container.children)) {
+                for (const child of container.children) {
+                    child.resolution = resolution;
+                }
+            }
+        });
+    }
+};
+Render.systemName = 'Render';
+Render = __decorate([
+    decorators.componentObserver({
+        Render: ['zIndex', 'resolution'],
+    })
+], Render);
+var Render$1 = Render;
+
+export { Render$2 as Render, Render$1 as RenderSystem };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eva/plugin-renderer-render",
-  "version": "2.1.0-beta.3",
+  "version": "2.1.0-beta.4",
   "description": "@eva/plugin-renderer-render",
   "main": "index.js",
   "module": "dist/plugin-renderer-render.esm.js",
@@ -19,9 +19,9 @@
   "homepage": "https://eva.js.org",
   "dependencies": {
     "@eva/inspector-decorator": "^2.0.0-beta.0",
-    "@eva/plugin-renderer": "2.1.0-beta.3",
-    "@eva/renderer-adapter": "2.1.0-beta.3",
-    "@eva/eva.js": "2.1.0-beta.3",
+    "@eva/plugin-renderer": "2.1.0-beta.4",
+    "@eva/renderer-adapter": "2.1.0-beta.4",
+    "@eva/eva.js": "2.1.0-beta.4",
     "pixi.js": "^8.17.0"
   }
 }