@eva/plugin-renderer-text 2.0.1-beta.36 → 2.0.1-beta.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -245,7 +245,7 @@ var _EVA_IIFE_text = function (exports, eva_js, pixi_js, pluginRenderer, rendere
245
245
  }
246
246
  });
247
247
  }
248
- processStrokeStyle(style) {
248
+ processStyle(style) {
249
249
  const processed = _extends({}, style);
250
250
  if (processed.strokeThickness) {
251
251
  const color = processed.stroke;
@@ -255,6 +255,29 @@ var _EVA_IIFE_text = function (exports, eva_js, pixi_js, pluginRenderer, rendere
255
255
  };
256
256
  delete processed.strokeThickness;
257
257
  }
258
+ if (Array.isArray(processed.fill)) {
259
+ processed.fill = processed.fill[0];
260
+ }
261
+ if (Array.isArray(processed.fillGradientStops)) {
262
+ let fontSize;
263
+ if (processed.fontSize == null) {
264
+ fontSize = pixi_js.TextStyle.defaultTextStyle.fontSize;
265
+ } else if (typeof processed.fontSize === 'string') {
266
+ fontSize = parseInt(processed.fontSize, 10);
267
+ } else {
268
+ fontSize = processed.fontSize;
269
+ }
270
+ const gradientFill = new pixi_js.FillGradient(0, 0, 0, fontSize * 1.7);
271
+ const fills = processed.fillGradientStops.map(color => pixi_js.Color.shared.setValue(color).toNumber());
272
+ fills.forEach((number, index) => {
273
+ const ratio = index / (fills.length - 1);
274
+ gradientFill.addColorStop(ratio, number);
275
+ });
276
+ processed.fill = {
277
+ fill: gradientFill
278
+ };
279
+ delete processed.fillGradientStops;
280
+ }
258
281
  return processed;
259
282
  }
260
283
  change(changed) {
@@ -266,7 +289,7 @@ var _EVA_IIFE_text = function (exports, eva_js, pixi_js, pluginRenderer, rendere
266
289
  if (changed.prop.prop[0] === 'text') {
267
290
  text.text = component.text;
268
291
  } else if (changed.prop.prop[0] === 'style') {
269
- const processedStyle = this.processStrokeStyle(component.style);
292
+ const processedStyle = this.processStyle(component.style);
270
293
  _extends(text.style, processedStyle);
271
294
  } else if (changed.prop.prop[0] === 'textureStyle' && isHTMLText) {
272
295
  const htmlComponent = component;
@@ -1 +1 @@
1
- function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)({}).hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},_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_text=function(t,e,n,o,i){"use strict";function s(t,e,n,o){var i,s=arguments.length,r=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,n,o);else for(var c=t.length-1;c>=0;c--)(i=t[c])&&(r=(s<3?i(r):s>3?i(e,n,r):i(e,n))||r);return s>3&&r&&Object.defineProperty(e,n,r),r}function r(t,e,n,o){return new(n||(n=Promise))((function(i,s){function r(t){try{l(o.next(t))}catch(t){s(t)}}function c(t){try{l(o.throw(t))}catch(t){s(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(r,c)}l((o=o.apply(t,e||[])).next())}))}function c(t){return function(e,n){var o=function(t,e){return t.constructor.IDEProps||(t.constructor.IDEProps={}),t.constructor.IDEProps[e]||(t.constructor.IDEProps[e]={}),t.constructor.IDEProps[e]}(e,n);o.key=n,o.type=t}}class l extends e.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){this.style=_extends({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),t&&(this.text=t.text)}}l.componentName="BitmapText",s([c("string")],l.prototype,"text",void 0);class a extends e.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){const e=new n.TextStyle({fontSize:20}),o={};for(const t in e)0===t.indexOf("_")&&(o[t.substring(1)]=e[t]);delete o.styleKey,this.style=o,t&&(this.text=t.text,_extends(this.style,t.style))}}a.componentName="Text",s([c("string")],a.prototype,"text",void 0);class d extends e.Component{constructor(){super(...arguments),this.text="",this.style={},this.textureStyle={}}init(t){this.style=_extends({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),this.textureStyle=_extends({scaleMode:"linear",resolution:window.devicePixelRatio||1},null==t?void 0:t.textureStyle),t&&(this.text=t.text)}}d.componentName="HTMLText",s([c("string")],d.prototype,"text",void 0);let x=class extends o.Renderer{constructor(){super(...arguments),this.name="Text",this.texts={}}init(){this.renderSystem=this.game.getSystem(o.RendererSystem),this.renderSystem.rendererManager.register(this)}componentChanged(t){return r(this,void 0,void 0,(function*(){const n="Text"===t.componentName,o="HTMLText"===t.componentName,i="BitmapText"===t.componentName;if(n||o||i)if(t.type===e.OBSERVER_TYPE.ADD)n?yield this.addTextComponent(t):o?yield this.addHTMLTextComponent(t):yield this.addBitmapTextComponent(t),this.setSize(t);else if(t.type===e.OBSERVER_TYPE.REMOVE)this.containerManager.getContainer(t.gameObject.id).removeChild(this.texts[t.gameObject.id].text),this.texts[t.gameObject.id].text.destroy({children:!0}),delete this.texts[t.gameObject.id];else{this.change(t);const e=t.component;if("style"===t.prop.prop[0]&&e.style&&e.style.fontFamily){const{text:n}=this.texts[t.gameObject.id];yield this.waitForFontResource(n,t,e.style.fontFamily)}this.setSize(t)}}))}addTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,n=_extends({},e.style),o=n.fontFamily;delete n.fontFamily;const s=o?"":e.text,r=new i.Text(s,n);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},o&&(yield this.waitForFontResource(r,t,o))}))}addHTMLTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,n=_extends({},e.style),o=n.fontFamily;delete n.fontFamily;const s=o?"":e.text,r=new i.HTMLText(_extends({text:s,style:n},e.textureStyle&&{textureStyle:e.textureStyle}));this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},o&&(yield this.waitForFontResource(r,t,o))}))}addBitmapTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,n=_extends({},e.style),o=n.fontFamily;delete n.fontFamily;const s=o?"":e.text,r=new i.BitmapText(s,n);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},o&&(yield this.waitForFontResource(r,t,o))}))}waitForFontResource(t,n,o){return r(this,void 0,void 0,(function*(){if(o)try{const i=Array.isArray(o)?o[0]:o,s=this.increaseAsyncId(n.gameObject.id);if(yield e.resource.getResource(i),!this.validateAsyncId(n.gameObject.id,s))return;const r=this.texts[n.gameObject.id].component;t.style.fontFamily=o,t.text=r.text}catch(t){console.warn(`字体资源 ${o} 加载失败:`,t)}}))}processStrokeStyle(t){const e=_extends({},t);if(e.strokeThickness){const t=e.stroke;e.stroke={color:t,width:e.strokeThickness},delete e.strokeThickness}return e}change(t){const{text:e,component:n}=this.texts[t.gameObject.id],o="HTMLText"===t.componentName;if("text"===t.prop.prop[0])e.text=n.text;else if("style"===t.prop.prop[0]){const t=this.processStrokeStyle(n.style);_extends(e.style,t)}else if("textureStyle"===t.prop.prop[0]&&o){const o=n,s=this.containerManager.getContainer(t.gameObject.id),r=s.getChildIndex(e);s.removeChild(e),e.destroy({children:!0});const c=new i.HTMLText({text:o.text,style:o.style,textureStyle:o.textureStyle});s.addChildAt(c,r),this.texts[t.gameObject.id].text=c}}setSize(t){const{transform:e}=t.gameObject;if(!e)return;const{text:n}=this.texts[t.gameObject.id],o=n.getSize();e.size.width=o.width,e.size.height=o.height}};x.systemName="Text",x=s([e.decorators.componentObserver({Text:["text",{prop:["style"],deep:!0}],HTMLText:["text",{prop:["style"],deep:!0},{prop:["textureStyle"],deep:!0}],BitmapText:["text",{prop:["style"],deep:!0}]})],x);var p=x;return t.BitmapText=l,t.HTMLText=d,t.Text=a,t.TextSystem=p,Object.defineProperty(t,"__esModule",{value:!0}),t}({},EVA,PIXI,EVA.plugin.renderer,EVA.rendererAdapter);globalThis.EVA.plugin.renderer.text=globalThis.EVA.plugin.renderer.text||_EVA_IIFE_text;
1
+ function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)({}).hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},_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_text=function(t,e,n,i,o){"use strict";function s(t,e,n,i){var o,s=arguments.length,r=s<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,n,i);else for(var l=t.length-1;l>=0;l--)(o=t[l])&&(r=(s<3?o(r):s>3?o(e,n,r):o(e,n))||r);return s>3&&r&&Object.defineProperty(e,n,r),r}function r(t,e,n,i){return new(n||(n=Promise))((function(o,s){function r(t){try{a(i.next(t))}catch(t){s(t)}}function l(t){try{a(i.throw(t))}catch(t){s(t)}}function a(t){var e;t.done?o(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(r,l)}a((i=i.apply(t,e||[])).next())}))}function l(t){return function(e,n){var i=function(t,e){return t.constructor.IDEProps||(t.constructor.IDEProps={}),t.constructor.IDEProps[e]||(t.constructor.IDEProps[e]={}),t.constructor.IDEProps[e]}(e,n);i.key=n,i.type=t}}class a extends e.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){this.style=_extends({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),t&&(this.text=t.text)}}a.componentName="BitmapText",s([l("string")],a.prototype,"text",void 0);class c extends e.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){const e=new n.TextStyle({fontSize:20}),i={};for(const t in e)0===t.indexOf("_")&&(i[t.substring(1)]=e[t]);delete i.styleKey,this.style=i,t&&(this.text=t.text,_extends(this.style,t.style))}}c.componentName="Text",s([l("string")],c.prototype,"text",void 0);class d extends e.Component{constructor(){super(...arguments),this.text="",this.style={},this.textureStyle={}}init(t){this.style=_extends({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),this.textureStyle=_extends({scaleMode:"linear",resolution:window.devicePixelRatio||1},null==t?void 0:t.textureStyle),t&&(this.text=t.text)}}d.componentName="HTMLText",s([l("string")],d.prototype,"text",void 0);let x=class extends i.Renderer{constructor(){super(...arguments),this.name="Text",this.texts={}}init(){this.renderSystem=this.game.getSystem(i.RendererSystem),this.renderSystem.rendererManager.register(this)}componentChanged(t){return r(this,void 0,void 0,(function*(){const n="Text"===t.componentName,i="HTMLText"===t.componentName,o="BitmapText"===t.componentName;if(n||i||o)if(t.type===e.OBSERVER_TYPE.ADD)n?yield this.addTextComponent(t):i?yield this.addHTMLTextComponent(t):yield this.addBitmapTextComponent(t),this.setSize(t);else if(t.type===e.OBSERVER_TYPE.REMOVE)this.containerManager.getContainer(t.gameObject.id).removeChild(this.texts[t.gameObject.id].text),this.texts[t.gameObject.id].text.destroy({children:!0}),delete this.texts[t.gameObject.id];else{this.change(t);const e=t.component;if("style"===t.prop.prop[0]&&e.style&&e.style.fontFamily){const{text:n}=this.texts[t.gameObject.id];yield this.waitForFontResource(n,t,e.style.fontFamily)}this.setSize(t)}}))}addTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,n=_extends({},e.style),i=n.fontFamily;delete n.fontFamily;const s=i?"":e.text,r=new o.Text(s,n);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},i&&(yield this.waitForFontResource(r,t,i))}))}addHTMLTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,n=_extends({},e.style),i=n.fontFamily;delete n.fontFamily;const s=i?"":e.text,r=new o.HTMLText(_extends({text:s,style:n},e.textureStyle&&{textureStyle:e.textureStyle}));this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},i&&(yield this.waitForFontResource(r,t,i))}))}addBitmapTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,n=_extends({},e.style),i=n.fontFamily;delete n.fontFamily;const s=i?"":e.text,r=new o.BitmapText(s,n);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},i&&(yield this.waitForFontResource(r,t,i))}))}waitForFontResource(t,n,i){return r(this,void 0,void 0,(function*(){if(i)try{const o=Array.isArray(i)?i[0]:i,s=this.increaseAsyncId(n.gameObject.id);if(yield e.resource.getResource(o),!this.validateAsyncId(n.gameObject.id,s))return;const r=this.texts[n.gameObject.id].component;t.style.fontFamily=i,t.text=r.text}catch(t){console.warn(`字体资源 ${i} 加载失败:`,t)}}))}processStyle(t){const e=_extends({},t);if(e.strokeThickness){const t=e.stroke;e.stroke={color:t,width:e.strokeThickness},delete e.strokeThickness}if(Array.isArray(e.fill)&&(e.fill=e.fill[0]),Array.isArray(e.fillGradientStops)){let t;t=null==e.fontSize?n.TextStyle.defaultTextStyle.fontSize:"string"==typeof e.fontSize?parseInt(e.fontSize,10):e.fontSize;const i=new n.FillGradient(0,0,0,1.7*t),o=e.fillGradientStops.map((t=>n.Color.shared.setValue(t).toNumber()));o.forEach(((t,e)=>{const n=e/(o.length-1);i.addColorStop(n,t)})),e.fill={fill:i},delete e.fillGradientStops}return e}change(t){const{text:e,component:n}=this.texts[t.gameObject.id],i="HTMLText"===t.componentName;if("text"===t.prop.prop[0])e.text=n.text;else if("style"===t.prop.prop[0]){const t=this.processStyle(n.style);_extends(e.style,t)}else if("textureStyle"===t.prop.prop[0]&&i){const i=n,s=this.containerManager.getContainer(t.gameObject.id),r=s.getChildIndex(e);s.removeChild(e),e.destroy({children:!0});const l=new o.HTMLText({text:i.text,style:i.style,textureStyle:i.textureStyle});s.addChildAt(l,r),this.texts[t.gameObject.id].text=l}}setSize(t){const{transform:e}=t.gameObject;if(!e)return;const{text:n}=this.texts[t.gameObject.id],i=n.getSize();e.size.width=i.width,e.size.height=i.height}};x.systemName="Text",x=s([e.decorators.componentObserver({Text:["text",{prop:["style"],deep:!0}],HTMLText:["text",{prop:["style"],deep:!0},{prop:["textureStyle"],deep:!0}],BitmapText:["text",{prop:["style"],deep:!0}]})],x);var p=x;return t.BitmapText=a,t.HTMLText=d,t.Text=c,t.TextSystem=p,Object.defineProperty(t,"__esModule",{value:!0}),t}({},EVA,PIXI,EVA.plugin.renderer,EVA.rendererAdapter);globalThis.EVA.plugin.renderer.text=globalThis.EVA.plugin.renderer.text||_EVA_IIFE_text;
@@ -387,10 +387,11 @@ let Text = class Text extends pluginRenderer.Renderer {
387
387
  });
388
388
  }
389
389
  /**
390
- * 将 Eva.js stroke/strokeThickness 格式转换为 PixiJS v8 格式
390
+ * 将 Eva.js 的样式格式转换为 PixiJS v8 格式
391
391
  */
392
- processStrokeStyle(style) {
392
+ processStyle(style) {
393
393
  const processed = Object.assign({}, style);
394
+ // stroke + strokeThickness -> stroke: { color, width }
394
395
  if (processed.strokeThickness) {
395
396
  const color = processed.stroke;
396
397
  processed.stroke = {
@@ -399,6 +400,31 @@ let Text = class Text extends pluginRenderer.Renderer {
399
400
  };
400
401
  delete processed.strokeThickness;
401
402
  }
403
+ // fill 数组 -> 取第一个值 (deprecated)
404
+ if (Array.isArray(processed.fill)) {
405
+ processed.fill = processed.fill[0];
406
+ }
407
+ // fillGradientStops -> FillGradient 对象
408
+ if (Array.isArray(processed.fillGradientStops)) {
409
+ let fontSize;
410
+ if (processed.fontSize == null) {
411
+ fontSize = pixi_js.TextStyle.defaultTextStyle.fontSize;
412
+ }
413
+ else if (typeof processed.fontSize === 'string') {
414
+ fontSize = parseInt(processed.fontSize, 10);
415
+ }
416
+ else {
417
+ fontSize = processed.fontSize;
418
+ }
419
+ const gradientFill = new pixi_js.FillGradient(0, 0, 0, fontSize * 1.7);
420
+ const fills = processed.fillGradientStops.map((color) => pixi_js.Color.shared.setValue(color).toNumber());
421
+ fills.forEach((number, index) => {
422
+ const ratio = index / (fills.length - 1);
423
+ gradientFill.addColorStop(ratio, number);
424
+ });
425
+ processed.fill = { fill: gradientFill };
426
+ delete processed.fillGradientStops;
427
+ }
402
428
  return processed;
403
429
  }
404
430
  change(changed) {
@@ -408,7 +434,7 @@ let Text = class Text extends pluginRenderer.Renderer {
408
434
  text.text = component.text;
409
435
  }
410
436
  else if (changed.prop.prop[0] === 'style') {
411
- const processedStyle = this.processStrokeStyle(component.style);
437
+ const processedStyle = this.processStyle(component.style);
412
438
  Object.assign(text.style, processedStyle);
413
439
  }
414
440
  else if (changed.prop.prop[0] === 'textureStyle' && isHTMLText) {
@@ -13,4 +13,4 @@ MERCHANTABLITY OR NON-INFRINGEMENT.
13
13
  See the Apache Version 2.0 License for specific language governing permissions
14
14
  and limitations under the License.
15
15
  ***************************************************************************** */
16
- function o(t,e,i,n){var s,o=arguments.length,r=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,n);else for(var c=t.length-1;c>=0;c--)(s=t[c])&&(r=(o<3?s(r):o>3?s(e,i,r):s(e,i))||r);return o>3&&r&&Object.defineProperty(e,i,r),r}function r(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{a(n.next(t))}catch(t){o(t)}}function c(t){try{a(n.throw(t))}catch(t){o(t)}}function a(t){t.done?s(t.value):new i((function(e){e(t.value)})).then(r,c)}a((n=n.apply(t,e||[])).next())}))}class c extends t.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){this.style=Object.assign({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),t&&(this.text=t.text)}}c.componentName="BitmapText",o([e.type("string")],c.prototype,"text",void 0);class a extends t.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){const e=new i.TextStyle({fontSize:20}),n={};for(const t in e)0===t.indexOf("_")&&(n[t.substring(1)]=e[t]);delete n.styleKey,this.style=n,t&&(this.text=t.text,Object.assign(this.style,t.style))}}a.componentName="Text",o([e.type("string")],a.prototype,"text",void 0);class l extends t.Component{constructor(){super(...arguments),this.text="",this.style={},this.textureStyle={}}init(t){this.style=Object.assign({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),this.textureStyle=Object.assign({scaleMode:"linear",resolution:window.devicePixelRatio||1},null==t?void 0:t.textureStyle),t&&(this.text=t.text)}}l.componentName="HTMLText",o([e.type("string")],l.prototype,"text",void 0);let d=class extends n.Renderer{constructor(){super(...arguments),this.name="Text",this.texts={}}init(){this.renderSystem=this.game.getSystem(n.RendererSystem),this.renderSystem.rendererManager.register(this)}componentChanged(e){return r(this,void 0,void 0,(function*(){const i="Text"===e.componentName,n="HTMLText"===e.componentName,s="BitmapText"===e.componentName;if(i||n||s)if(e.type===t.OBSERVER_TYPE.ADD)i?yield this.addTextComponent(e):n?yield this.addHTMLTextComponent(e):yield this.addBitmapTextComponent(e),this.setSize(e);else if(e.type===t.OBSERVER_TYPE.REMOVE)this.containerManager.getContainer(e.gameObject.id).removeChild(this.texts[e.gameObject.id].text),this.texts[e.gameObject.id].text.destroy({children:!0}),delete this.texts[e.gameObject.id];else{this.change(e);const t=e.component;if("style"===e.prop.prop[0]&&t.style&&t.style.fontFamily){const{text:i}=this.texts[e.gameObject.id];yield this.waitForFontResource(i,e,t.style.fontFamily)}this.setSize(e)}}))}addTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,i=Object.assign({},e.style),n=i.fontFamily;delete i.fontFamily;const o=n?"":e.text,r=new s.Text(o,i);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},n&&(yield this.waitForFontResource(r,t,n))}))}addHTMLTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,i=Object.assign({},e.style),n=i.fontFamily;delete i.fontFamily;const o=n?"":e.text,r=new s.HTMLText(Object.assign({text:o,style:i},e.textureStyle&&{textureStyle:e.textureStyle}));this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},n&&(yield this.waitForFontResource(r,t,n))}))}addBitmapTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,i=Object.assign({},e.style),n=i.fontFamily;delete i.fontFamily;const o=n?"":e.text,r=new s.BitmapText(o,i);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},n&&(yield this.waitForFontResource(r,t,n))}))}waitForFontResource(e,i,n){return r(this,void 0,void 0,(function*(){if(n)try{const s=Array.isArray(n)?n[0]:n,o=this.increaseAsyncId(i.gameObject.id);if(yield t.resource.getResource(s),!this.validateAsyncId(i.gameObject.id,o))return;const r=this.texts[i.gameObject.id].component;e.style.fontFamily=n,e.text=r.text}catch(t){console.warn(`字体资源 ${n} 加载失败:`,t)}}))}processStrokeStyle(t){const e=Object.assign({},t);if(e.strokeThickness){const t=e.stroke;e.stroke={color:t,width:e.strokeThickness},delete e.strokeThickness}return e}change(t){const{text:e,component:i}=this.texts[t.gameObject.id],n="HTMLText"===t.componentName;if("text"===t.prop.prop[0])e.text=i.text;else if("style"===t.prop.prop[0]){const t=this.processStrokeStyle(i.style);Object.assign(e.style,t)}else if("textureStyle"===t.prop.prop[0]&&n){const n=i,o=this.containerManager.getContainer(t.gameObject.id),r=o.getChildIndex(e);o.removeChild(e),e.destroy({children:!0});const c=new s.HTMLText({text:n.text,style:n.style,textureStyle:n.textureStyle});o.addChildAt(c,r),this.texts[t.gameObject.id].text=c}}setSize(t){const{transform:e}=t.gameObject;if(!e)return;const{text:i}=this.texts[t.gameObject.id],n=i.getSize();e.size.width=n.width,e.size.height=n.height}};d.systemName="Text",d=o([t.decorators.componentObserver({Text:["text",{prop:["style"],deep:!0}],HTMLText:["text",{prop:["style"],deep:!0},{prop:["textureStyle"],deep:!0}],BitmapText:["text",{prop:["style"],deep:!0}]})],d);var x=d;exports.BitmapText=c,exports.HTMLText=l,exports.Text=a,exports.TextSystem=x;
16
+ function o(t,e,i,n){var s,o=arguments.length,r=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,n);else for(var a=t.length-1;a>=0;a--)(s=t[a])&&(r=(o<3?s(r):o>3?s(e,i,r):s(e,i))||r);return o>3&&r&&Object.defineProperty(e,i,r),r}function r(t,e,i,n){return new(i||(i=Promise))((function(s,o){function r(t){try{l(n.next(t))}catch(t){o(t)}}function a(t){try{l(n.throw(t))}catch(t){o(t)}}function l(t){t.done?s(t.value):new i((function(e){e(t.value)})).then(r,a)}l((n=n.apply(t,e||[])).next())}))}class a extends t.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){this.style=Object.assign({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),t&&(this.text=t.text)}}a.componentName="BitmapText",o([e.type("string")],a.prototype,"text",void 0);class l extends t.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){const e=new i.TextStyle({fontSize:20}),n={};for(const t in e)0===t.indexOf("_")&&(n[t.substring(1)]=e[t]);delete n.styleKey,this.style=n,t&&(this.text=t.text,Object.assign(this.style,t.style))}}l.componentName="Text",o([e.type("string")],l.prototype,"text",void 0);class c extends t.Component{constructor(){super(...arguments),this.text="",this.style={},this.textureStyle={}}init(t){this.style=Object.assign({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==t?void 0:t.style),this.textureStyle=Object.assign({scaleMode:"linear",resolution:window.devicePixelRatio||1},null==t?void 0:t.textureStyle),t&&(this.text=t.text)}}c.componentName="HTMLText",o([e.type("string")],c.prototype,"text",void 0);let d=class extends n.Renderer{constructor(){super(...arguments),this.name="Text",this.texts={}}init(){this.renderSystem=this.game.getSystem(n.RendererSystem),this.renderSystem.rendererManager.register(this)}componentChanged(e){return r(this,void 0,void 0,(function*(){const i="Text"===e.componentName,n="HTMLText"===e.componentName,s="BitmapText"===e.componentName;if(i||n||s)if(e.type===t.OBSERVER_TYPE.ADD)i?yield this.addTextComponent(e):n?yield this.addHTMLTextComponent(e):yield this.addBitmapTextComponent(e),this.setSize(e);else if(e.type===t.OBSERVER_TYPE.REMOVE)this.containerManager.getContainer(e.gameObject.id).removeChild(this.texts[e.gameObject.id].text),this.texts[e.gameObject.id].text.destroy({children:!0}),delete this.texts[e.gameObject.id];else{this.change(e);const t=e.component;if("style"===e.prop.prop[0]&&t.style&&t.style.fontFamily){const{text:i}=this.texts[e.gameObject.id];yield this.waitForFontResource(i,e,t.style.fontFamily)}this.setSize(e)}}))}addTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,i=Object.assign({},e.style),n=i.fontFamily;delete i.fontFamily;const o=n?"":e.text,r=new s.Text(o,i);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},n&&(yield this.waitForFontResource(r,t,n))}))}addHTMLTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,i=Object.assign({},e.style),n=i.fontFamily;delete i.fontFamily;const o=n?"":e.text,r=new s.HTMLText(Object.assign({text:o,style:i},e.textureStyle&&{textureStyle:e.textureStyle}));this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},n&&(yield this.waitForFontResource(r,t,n))}))}addBitmapTextComponent(t){return r(this,void 0,void 0,(function*(){const e=t.component,i=Object.assign({},e.style),n=i.fontFamily;delete i.fontFamily;const o=n?"":e.text,r=new s.BitmapText(o,i);this.containerManager.getContainer(t.gameObject.id).addChildAt(r,0),this.texts[t.gameObject.id]={text:r,component:e},n&&(yield this.waitForFontResource(r,t,n))}))}waitForFontResource(e,i,n){return r(this,void 0,void 0,(function*(){if(n)try{const s=Array.isArray(n)?n[0]:n,o=this.increaseAsyncId(i.gameObject.id);if(yield t.resource.getResource(s),!this.validateAsyncId(i.gameObject.id,o))return;const r=this.texts[i.gameObject.id].component;e.style.fontFamily=n,e.text=r.text}catch(t){console.warn(`字体资源 ${n} 加载失败:`,t)}}))}processStyle(t){const e=Object.assign({},t);if(e.strokeThickness){const t=e.stroke;e.stroke={color:t,width:e.strokeThickness},delete e.strokeThickness}if(Array.isArray(e.fill)&&(e.fill=e.fill[0]),Array.isArray(e.fillGradientStops)){let t;t=null==e.fontSize?i.TextStyle.defaultTextStyle.fontSize:"string"==typeof e.fontSize?parseInt(e.fontSize,10):e.fontSize;const n=new i.FillGradient(0,0,0,1.7*t),s=e.fillGradientStops.map((t=>i.Color.shared.setValue(t).toNumber()));s.forEach(((t,e)=>{const i=e/(s.length-1);n.addColorStop(i,t)})),e.fill={fill:n},delete e.fillGradientStops}return e}change(t){const{text:e,component:i}=this.texts[t.gameObject.id],n="HTMLText"===t.componentName;if("text"===t.prop.prop[0])e.text=i.text;else if("style"===t.prop.prop[0]){const t=this.processStyle(i.style);Object.assign(e.style,t)}else if("textureStyle"===t.prop.prop[0]&&n){const n=i,o=this.containerManager.getContainer(t.gameObject.id),r=o.getChildIndex(e);o.removeChild(e),e.destroy({children:!0});const a=new s.HTMLText({text:n.text,style:n.style,textureStyle:n.textureStyle});o.addChildAt(a,r),this.texts[t.gameObject.id].text=a}}setSize(t){const{transform:e}=t.gameObject;if(!e)return;const{text:i}=this.texts[t.gameObject.id],n=i.getSize();e.size.width=n.width,e.size.height=n.height}};d.systemName="Text",d=o([t.decorators.componentObserver({Text:["text",{prop:["style"],deep:!0}],HTMLText:["text",{prop:["style"],deep:!0},{prop:["textureStyle"],deep:!0}],BitmapText:["text",{prop:["style"],deep:!0}]})],d);var p=d;exports.BitmapText=a,exports.HTMLText=c,exports.Text=l,exports.TextSystem=p;
@@ -297,9 +297,9 @@ export declare class TextSystem extends Renderer {
297
297
  */
298
298
  private waitForFontResource;
299
299
  /**
300
- * 将 Eva.js stroke/strokeThickness 格式转换为 PixiJS v8 格式
300
+ * 将 Eva.js 的样式格式转换为 PixiJS v8 格式
301
301
  */
302
- private processStrokeStyle;
302
+ private processStyle;
303
303
  change(changed: ComponentChanged): void;
304
304
  setSize(changed: ComponentChanged): void;
305
305
  }
@@ -1,6 +1,6 @@
1
1
  import { Component, decorators, OBSERVER_TYPE, resource } from '@eva/eva.js';
2
2
  import { type } from '@eva/inspector-decorator';
3
- import { TextStyle } from 'pixi.js';
3
+ import { TextStyle, FillGradient, Color } from 'pixi.js';
4
4
  import { Renderer, RendererSystem } from '@eva/plugin-renderer';
5
5
  import { HTMLText as HTMLText$1, Text as Text$3, BitmapText as BitmapText$1 } from '@eva/renderer-adapter';
6
6
 
@@ -383,10 +383,11 @@ let Text = class Text extends Renderer {
383
383
  });
384
384
  }
385
385
  /**
386
- * 将 Eva.js stroke/strokeThickness 格式转换为 PixiJS v8 格式
386
+ * 将 Eva.js 的样式格式转换为 PixiJS v8 格式
387
387
  */
388
- processStrokeStyle(style) {
388
+ processStyle(style) {
389
389
  const processed = Object.assign({}, style);
390
+ // stroke + strokeThickness -> stroke: { color, width }
390
391
  if (processed.strokeThickness) {
391
392
  const color = processed.stroke;
392
393
  processed.stroke = {
@@ -395,6 +396,31 @@ let Text = class Text extends Renderer {
395
396
  };
396
397
  delete processed.strokeThickness;
397
398
  }
399
+ // fill 数组 -> 取第一个值 (deprecated)
400
+ if (Array.isArray(processed.fill)) {
401
+ processed.fill = processed.fill[0];
402
+ }
403
+ // fillGradientStops -> FillGradient 对象
404
+ if (Array.isArray(processed.fillGradientStops)) {
405
+ let fontSize;
406
+ if (processed.fontSize == null) {
407
+ fontSize = TextStyle.defaultTextStyle.fontSize;
408
+ }
409
+ else if (typeof processed.fontSize === 'string') {
410
+ fontSize = parseInt(processed.fontSize, 10);
411
+ }
412
+ else {
413
+ fontSize = processed.fontSize;
414
+ }
415
+ const gradientFill = new FillGradient(0, 0, 0, fontSize * 1.7);
416
+ const fills = processed.fillGradientStops.map((color) => Color.shared.setValue(color).toNumber());
417
+ fills.forEach((number, index) => {
418
+ const ratio = index / (fills.length - 1);
419
+ gradientFill.addColorStop(ratio, number);
420
+ });
421
+ processed.fill = { fill: gradientFill };
422
+ delete processed.fillGradientStops;
423
+ }
398
424
  return processed;
399
425
  }
400
426
  change(changed) {
@@ -404,7 +430,7 @@ let Text = class Text extends Renderer {
404
430
  text.text = component.text;
405
431
  }
406
432
  else if (changed.prop.prop[0] === 'style') {
407
- const processedStyle = this.processStrokeStyle(component.style);
433
+ const processedStyle = this.processStyle(component.style);
408
434
  Object.assign(text.style, processedStyle);
409
435
  }
410
436
  else if (changed.prop.prop[0] === 'textureStyle' && isHTMLText) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eva/plugin-renderer-text",
3
- "version": "2.0.1-beta.36",
3
+ "version": "2.0.1-beta.37",
4
4
  "description": "@eva/plugin-renderer-text",
5
5
  "main": "index.js",
6
6
  "module": "dist/plugin-renderer-text.esm.js",
@@ -19,9 +19,9 @@
19
19
  "homepage": "https://eva.js.org",
20
20
  "dependencies": {
21
21
  "@eva/inspector-decorator": "^0.0.5",
22
- "@eva/plugin-renderer": "2.0.1-beta.36",
23
- "@eva/renderer-adapter": "2.0.1-beta.36",
24
- "@eva/eva.js": "2.0.1-beta.36",
22
+ "@eva/plugin-renderer": "2.0.1-beta.37",
23
+ "@eva/renderer-adapter": "2.0.1-beta.37",
24
+ "@eva/eva.js": "2.0.1-beta.37",
25
25
  "pixi.js": "^8.17.0"
26
26
  }
27
27
  }