@eva/plugin-renderer-text 2.0.1-beta.33 → 2.0.1-beta.34

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.
@@ -2,7 +2,7 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
2
2
  globalThis.EVA = globalThis.EVA || {};
3
3
  globalThis.EVA.plugin = globalThis.EVA.plugin || {};
4
4
  globalThis.EVA.plugin.renderer = globalThis.EVA.plugin.renderer || {};
5
- var _EVA_IIFE_text = function (exports, pixi_js, eva_js, pluginRenderer, rendererAdapter) {
5
+ var _EVA_IIFE_text = function (exports, eva_js, pixi_js, pluginRenderer, rendererAdapter) {
6
6
  'use strict';
7
7
  function __decorate(decorators, target, key, desc) {
8
8
  var c = arguments.length,
@@ -55,6 +55,25 @@ var _EVA_IIFE_text = function (exports, pixi_js, eva_js, pluginRenderer, rendere
55
55
  prop.type = type;
56
56
  };
57
57
  }
58
+ class BitmapText extends eva_js.Component {
59
+ constructor() {
60
+ super(...arguments);
61
+ this.text = '';
62
+ this.style = {};
63
+ }
64
+ init(obj) {
65
+ this.style = _extends({
66
+ fontSize: 24,
67
+ fill: '#000000',
68
+ fontFamily: 'Arial'
69
+ }, obj === null || obj === void 0 ? void 0 : obj.style);
70
+ if (obj) {
71
+ this.text = obj.text;
72
+ }
73
+ }
74
+ }
75
+ BitmapText.componentName = 'BitmapText';
76
+ __decorate([type('string')], BitmapText.prototype, "text", void 0);
58
77
  class Text$2 extends eva_js.Component {
59
78
  constructor() {
60
79
  super(...arguments);
@@ -119,12 +138,15 @@ var _EVA_IIFE_text = function (exports, pixi_js, eva_js, pluginRenderer, rendere
119
138
  return __awaiter(this, void 0, void 0, function* () {
120
139
  const isText = changed.componentName === 'Text';
121
140
  const isHTMLText = changed.componentName === 'HTMLText';
122
- if (!isText && !isHTMLText) return;
141
+ const isBitmapText = changed.componentName === 'BitmapText';
142
+ if (!isText && !isHTMLText && !isBitmapText) return;
123
143
  if (changed.type === eva_js.OBSERVER_TYPE.ADD) {
124
144
  if (isText) {
125
145
  yield this.addTextComponent(changed);
126
- } else {
146
+ } else if (isHTMLText) {
127
147
  yield this.addHTMLTextComponent(changed);
148
+ } else {
149
+ yield this.addBitmapTextComponent(changed);
128
150
  }
129
151
  this.setSize(changed);
130
152
  } else if (changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
@@ -187,6 +209,24 @@ var _EVA_IIFE_text = function (exports, pixi_js, eva_js, pluginRenderer, rendere
187
209
  }
188
210
  });
189
211
  }
212
+ addBitmapTextComponent(changed) {
213
+ return __awaiter(this, void 0, void 0, function* () {
214
+ const component = changed.component;
215
+ const styleWithoutFont = _extends({}, component.style);
216
+ const fontFamily = styleWithoutFont.fontFamily;
217
+ delete styleWithoutFont.fontFamily;
218
+ const initialText = fontFamily ? '' : component.text;
219
+ const bitmapText = new rendererAdapter.BitmapText(initialText, styleWithoutFont);
220
+ this.containerManager.getContainer(changed.gameObject.id).addChildAt(bitmapText, 0);
221
+ this.texts[changed.gameObject.id] = {
222
+ text: bitmapText,
223
+ component
224
+ };
225
+ if (fontFamily) {
226
+ yield this.waitForFontResource(bitmapText, changed, fontFamily);
227
+ }
228
+ });
229
+ }
190
230
  waitForFontResource(text, changed, fontFamily) {
191
231
  return __awaiter(this, void 0, void 0, function* () {
192
232
  if (!fontFamily) {
@@ -257,9 +297,14 @@ var _EVA_IIFE_text = function (exports, pixi_js, eva_js, pluginRenderer, rendere
257
297
  }, {
258
298
  prop: ['textureStyle'],
259
299
  deep: true
300
+ }],
301
+ BitmapText: ['text', {
302
+ prop: ['style'],
303
+ deep: true
260
304
  }]
261
305
  })], Text);
262
306
  var Text$1 = Text;
307
+ exports.BitmapText = BitmapText;
263
308
  exports.HTMLText = HTMLText;
264
309
  exports.Text = Text$2;
265
310
  exports.TextSystem = Text$1;
@@ -267,5 +312,5 @@ var _EVA_IIFE_text = function (exports, pixi_js, eva_js, pluginRenderer, rendere
267
312
  value: true
268
313
  });
269
314
  return exports;
270
- }({}, PIXI, EVA, EVA.plugin.renderer, EVA.rendererAdapter);
315
+ }({}, EVA, PIXI, EVA.plugin.renderer, EVA.rendererAdapter);
271
316
  globalThis.EVA.plugin.renderer.text = globalThis.EVA.plugin.renderer.text || _EVA_IIFE_text;
@@ -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 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 c=t.length-1;c>=0;c--)(o=t[c])&&(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{l(i.next(t))}catch(t){s(t)}}function c(t){try{l(i.throw(t))}catch(t){s(t)}}function l(t){var e;t.done?o(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(r,c)}l((i=i.apply(t,e||[])).next())}))}function c(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 l extends n.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){const n=new e.TextStyle({fontSize:20}),i={};for(const t in n)0===t.indexOf("_")&&(i[t.substring(1)]=n[t]);delete i.styleKey,this.style=i,t&&(this.text=t.text,_extends(this.style,t.style))}}l.componentName="Text",s([c("string")],l.prototype,"text",void 0);class a extends n.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)}}a.componentName="HTMLText",s([c("string")],a.prototype,"text",void 0);let d=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 e="Text"===t.componentName,i="HTMLText"===t.componentName;if(e||i)if(t.type===n.OBSERVER_TYPE.ADD)e?yield this.addTextComponent(t):yield this.addHTMLTextComponent(t),this.setSize(t);else if(t.type===n.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))}))}waitForFontResource(t,e,i){return r(this,void 0,void 0,(function*(){if(i)try{const o=Array.isArray(i)?i[0]:i,s=this.increaseAsyncId(e.gameObject.id);if(yield n.resource.getResource(o),!this.validateAsyncId(e.gameObject.id,s))return;const r=this.texts[e.gameObject.id].component;t.style.fontFamily=i,t.text=r.text}catch(t){console.warn(`字体资源 ${i} 加载失败:`,t)}}))}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])_extends(e.style,n.style);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 c=new o.HTMLText({text:i.text,style:i.style,textureStyle:i.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],i=n.getSize();e.size.width=i.width,e.size.height=i.height}};d.systemName="Text",d=s([n.decorators.componentObserver({Text:["text",{prop:["style"],deep:!0}],HTMLText:["text",{prop:["style"],deep:!0},{prop:["textureStyle"],deep:!0}]})],d);var x=d;return t.HTMLText=a,t.Text=l,t.TextSystem=x,Object.defineProperty(t,"__esModule",{value:!0}),t}({},PIXI,EVA,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{c(i.next(t))}catch(t){s(t)}}function l(t){try{c(i.throw(t))}catch(t){s(t)}}function c(t){var e;t.done?o(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(r,l)}c((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 c 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)}}c.componentName="BitmapText",s([l("string")],c.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}),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))}}a.componentName="Text",s([l("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([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)}}))}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])_extends(e.style,n.style);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=c,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;
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var pixi_js = require('pixi.js');
6
5
  var eva_js = require('@eva/eva.js');
7
6
  var inspectorDecorator = require('@eva/inspector-decorator');
7
+ var pixi_js = require('pixi.js');
8
8
  var pluginRenderer = require('@eva/plugin-renderer');
9
9
  var rendererAdapter = require('@eva/renderer-adapter');
10
10
 
@@ -39,6 +39,47 @@ function __awaiter(thisArg, _arguments, P, generator) {
39
39
  });
40
40
  }
41
41
 
42
+ /**
43
+ * 位图文本组件
44
+ *
45
+ * BitmapText 组件使用位图字体渲染文本,性能优于 Canvas 文本渲染。
46
+ * 适用于频繁更新的文本场景,如计分板、倒计时等。
47
+ *
48
+ * 支持两种字体模式:
49
+ * - 动态生成:指定 TextStyle,PixiJS 自动生成 bitmap font
50
+ * - 预加载字体:通过 BitmapFont.install() 预安装或从 .fnt 文件加载
51
+ *
52
+ * @example
53
+ * ```typescript
54
+ * const score = new GameObject('score');
55
+ * score.addComponent(new BitmapText({
56
+ * text: 'Score: 0',
57
+ * style: {
58
+ * fontSize: 32,
59
+ * fill: '#ffffff',
60
+ * fontFamily: 'Arial'
61
+ * }
62
+ * }));
63
+ * ```
64
+ */
65
+ class BitmapText extends eva_js.Component {
66
+ constructor() {
67
+ super(...arguments);
68
+ this.text = '';
69
+ this.style = {};
70
+ }
71
+ init(obj) {
72
+ this.style = Object.assign({ fontSize: 24, fill: '#000000', fontFamily: 'Arial' }, obj === null || obj === void 0 ? void 0 : obj.style);
73
+ if (obj) {
74
+ this.text = obj.text;
75
+ }
76
+ }
77
+ }
78
+ BitmapText.componentName = 'BitmapText';
79
+ __decorate([
80
+ inspectorDecorator.type('string')
81
+ ], BitmapText.prototype, "text", void 0);
82
+
42
83
  /**
43
84
  * 文本组件(基于 PixiJS Text)
44
85
  *
@@ -226,15 +267,19 @@ let Text = class Text extends pluginRenderer.Renderer {
226
267
  return __awaiter(this, void 0, void 0, function* () {
227
268
  const isText = changed.componentName === 'Text';
228
269
  const isHTMLText = changed.componentName === 'HTMLText';
229
- if (!isText && !isHTMLText)
270
+ const isBitmapText = changed.componentName === 'BitmapText';
271
+ if (!isText && !isHTMLText && !isBitmapText)
230
272
  return;
231
273
  if (changed.type === eva_js.OBSERVER_TYPE.ADD) {
232
274
  if (isText) {
233
275
  yield this.addTextComponent(changed);
234
276
  }
235
- else {
277
+ else if (isHTMLText) {
236
278
  yield this.addHTMLTextComponent(changed);
237
279
  }
280
+ else {
281
+ yield this.addBitmapTextComponent(changed);
282
+ }
238
283
  this.setSize(changed);
239
284
  }
240
285
  else if (changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
@@ -294,6 +339,26 @@ let Text = class Text extends pluginRenderer.Renderer {
294
339
  }
295
340
  });
296
341
  }
342
+ addBitmapTextComponent(changed) {
343
+ return __awaiter(this, void 0, void 0, function* () {
344
+ const component = changed.component;
345
+ // 创建样式副本,先不设置 fontFamily
346
+ const styleWithoutFont = Object.assign({}, component.style);
347
+ const fontFamily = styleWithoutFont.fontFamily;
348
+ delete styleWithoutFont.fontFamily;
349
+ const initialText = fontFamily ? '' : component.text;
350
+ const bitmapText = new rendererAdapter.BitmapText(initialText, styleWithoutFont);
351
+ this.containerManager.getContainer(changed.gameObject.id).addChildAt(bitmapText, 0);
352
+ this.texts[changed.gameObject.id] = {
353
+ text: bitmapText,
354
+ component,
355
+ };
356
+ // 如果指定了字体资源,等待资源加载完成后设置 fontFamily
357
+ if (fontFamily) {
358
+ yield this.waitForFontResource(bitmapText, changed, fontFamily);
359
+ }
360
+ });
361
+ }
297
362
  /**
298
363
  * 等待字体资源加载完成并更新文本
299
364
  */
@@ -361,10 +426,12 @@ Text = __decorate([
361
426
  eva_js.decorators.componentObserver({
362
427
  Text: ['text', { prop: ['style'], deep: true }],
363
428
  HTMLText: ['text', { prop: ['style'], deep: true }, { prop: ['textureStyle'], deep: true }],
429
+ BitmapText: ['text', { prop: ['style'], deep: true }],
364
430
  })
365
431
  ], Text);
366
432
  var Text$1 = Text;
367
433
 
434
+ exports.BitmapText = BitmapText;
368
435
  exports.HTMLText = HTMLText;
369
436
  exports.Text = Text$2;
370
437
  exports.TextSystem = Text$1;
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("pixi.js"),t=require("@eva/eva.js"),n=require("@eva/inspector-decorator"),i=require("@eva/plugin-renderer"),s=require("@eva/renderer-adapter");
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@eva/eva.js"),e=require("@eva/inspector-decorator"),i=require("pixi.js"),n=require("@eva/plugin-renderer"),o=require("@eva/renderer-adapter");
2
2
  /*! *****************************************************************************
3
3
  Copyright (c) Microsoft Corporation. All rights reserved.
4
4
  Licensed under the Apache License, Version 2.0 (the "License"); you may not use
@@ -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(e,t,n,i){var s,o=arguments.length,r=o<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,n,i);else for(var c=e.length-1;c>=0;c--)(s=e[c])&&(r=(o<3?s(r):o>3?s(t,n,r):s(t,n))||r);return o>3&&r&&Object.defineProperty(t,n,r),r}function r(e,t,n,i){return new(n||(n=Promise))((function(s,o){function r(e){try{a(i.next(e))}catch(e){o(e)}}function c(e){try{a(i.throw(e))}catch(e){o(e)}}function a(e){e.done?s(e.value):new n((function(t){t(e.value)})).then(r,c)}a((i=i.apply(e,t||[])).next())}))}class c extends t.Component{constructor(){super(...arguments),this.text="",this.style={}}init(t){const n=new e.TextStyle({fontSize:20}),i={};for(const e in n)0===e.indexOf("_")&&(i[e.substring(1)]=n[e]);delete i.styleKey,this.style=i,t&&(this.text=t.text,Object.assign(this.style,t.style))}}c.componentName="Text",o([n.type("string")],c.prototype,"text",void 0);class a extends t.Component{constructor(){super(...arguments),this.text="",this.style={},this.textureStyle={}}init(e){this.style=Object.assign({fontSize:24,fill:"#000000",fontFamily:"Arial"},null==e?void 0:e.style),this.textureStyle=Object.assign({scaleMode:"linear",resolution:window.devicePixelRatio||1},null==e?void 0:e.textureStyle),e&&(this.text=e.text)}}a.componentName="HTMLText",o([n.type("string")],a.prototype,"text",void 0);let d=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(e){return r(this,void 0,void 0,(function*(){const n="Text"===e.componentName,i="HTMLText"===e.componentName;if(n||i)if(e.type===t.OBSERVER_TYPE.ADD)n?yield this.addTextComponent(e):yield this.addHTMLTextComponent(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:n}=this.texts[e.gameObject.id];yield this.waitForFontResource(n,e,t.style.fontFamily)}this.setSize(e)}}))}addTextComponent(e){return r(this,void 0,void 0,(function*(){const t=e.component,n=Object.assign({},t.style),i=n.fontFamily;delete n.fontFamily;const o=i?"":t.text,r=new s.Text(o,n);this.containerManager.getContainer(e.gameObject.id).addChildAt(r,0),this.texts[e.gameObject.id]={text:r,component:t},i&&(yield this.waitForFontResource(r,e,i))}))}addHTMLTextComponent(e){return r(this,void 0,void 0,(function*(){const t=e.component,n=Object.assign({},t.style),i=n.fontFamily;delete n.fontFamily;const o=i?"":t.text,r=new s.HTMLText(Object.assign({text:o,style:n},t.textureStyle&&{textureStyle:t.textureStyle}));this.containerManager.getContainer(e.gameObject.id).addChildAt(r,0),this.texts[e.gameObject.id]={text:r,component:t},i&&(yield this.waitForFontResource(r,e,i))}))}waitForFontResource(e,n,i){return r(this,void 0,void 0,(function*(){if(i)try{const s=Array.isArray(i)?i[0]:i,o=this.increaseAsyncId(n.gameObject.id);if(yield t.resource.getResource(s),!this.validateAsyncId(n.gameObject.id,o))return;const r=this.texts[n.gameObject.id].component;e.style.fontFamily=i,e.text=r.text}catch(e){console.warn(`字体资源 ${i} 加载失败:`,e)}}))}change(e){const{text:t,component:n}=this.texts[e.gameObject.id],i="HTMLText"===e.componentName;if("text"===e.prop.prop[0])t.text=n.text;else if("style"===e.prop.prop[0])Object.assign(t.style,n.style);else if("textureStyle"===e.prop.prop[0]&&i){const i=n,o=this.containerManager.getContainer(e.gameObject.id),r=o.getChildIndex(t);o.removeChild(t),t.destroy({children:!0});const c=new s.HTMLText({text:i.text,style:i.style,textureStyle:i.textureStyle});o.addChildAt(c,r),this.texts[e.gameObject.id].text=c}}setSize(e){const{transform:t}=e.gameObject;if(!t)return;const{text:n}=this.texts[e.gameObject.id],i=n.getSize();t.size.width=i.width,t.size.height=i.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}]})],d);var l=d;exports.HTMLText=a,exports.Text=c,exports.TextSystem=l;
16
+ function s(t,e,i,n){var o,s=arguments.length,r=s<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--)(o=t[a])&&(r=(s<3?o(r):s>3?o(e,i,r):o(e,i))||r);return s>3&&r&&Object.defineProperty(e,i,r),r}function r(t,e,i,n){return new(i||(i=Promise))((function(o,s){function r(t){try{c(n.next(t))}catch(t){s(t)}}function a(t){try{c(n.throw(t))}catch(t){s(t)}}function c(t){t.done?o(t.value):new i((function(e){e(t.value)})).then(r,a)}c((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",s([e.type("string")],a.prototype,"text",void 0);class c 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))}}c.componentName="Text",s([e.type("string")],c.prototype,"text",void 0);class d 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)}}d.componentName="HTMLText",s([e.type("string")],d.prototype,"text",void 0);let l=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,o="BitmapText"===e.componentName;if(i||n||o)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 s=n?"":e.text,r=new o.Text(s,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 s=n?"":e.text,r=new o.HTMLText(Object.assign({text:s,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 s=n?"":e.text,r=new o.BitmapText(s,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 o=Array.isArray(n)?n[0]:n,s=this.increaseAsyncId(i.gameObject.id);if(yield t.resource.getResource(o),!this.validateAsyncId(i.gameObject.id,s))return;const r=this.texts[i.gameObject.id].component;e.style.fontFamily=n,e.text=r.text}catch(t){console.warn(`字体资源 ${n} 加载失败:`,t)}}))}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])Object.assign(e.style,i.style);else if("textureStyle"===t.prop.prop[0]&&n){const n=i,s=this.containerManager.getContainer(t.gameObject.id),r=s.getChildIndex(e);s.removeChild(e),e.destroy({children:!0});const a=new o.HTMLText({text:n.text,style:n.style,textureStyle:n.textureStyle});s.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}};l.systemName="Text",l=s([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}]})],l);var x=l;exports.BitmapText=a,exports.HTMLText=d,exports.Text=c,exports.TextSystem=x;
@@ -1,3 +1,4 @@
1
+ import { BitmapText as BitmapText_2 } from '@eva/renderer-adapter';
1
2
  import { Component } from '@eva/eva.js';
2
3
  import { ComponentChanged } from '@eva/eva.js';
3
4
  import { ContainerManager } from '@eva/plugin-renderer';
@@ -13,6 +14,54 @@ import { TextStyleFontWeight } from 'pixi.js';
13
14
  import { TextStyleTextBaseline } from 'pixi.js';
14
15
  import { TextStyleWhiteSpace } from 'pixi.js';
15
16
 
17
+ /**
18
+ * 位图文本组件
19
+ *
20
+ * BitmapText 组件使用位图字体渲染文本,性能优于 Canvas 文本渲染。
21
+ * 适用于频繁更新的文本场景,如计分板、倒计时等。
22
+ *
23
+ * 支持两种字体模式:
24
+ * - 动态生成:指定 TextStyle,PixiJS 自动生成 bitmap font
25
+ * - 预加载字体:通过 BitmapFont.install() 预安装或从 .fnt 文件加载
26
+ *
27
+ * @example
28
+ * ```typescript
29
+ * const score = new GameObject('score');
30
+ * score.addComponent(new BitmapText({
31
+ * text: 'Score: 0',
32
+ * style: {
33
+ * fontSize: 32,
34
+ * fill: '#ffffff',
35
+ * fontFamily: 'Arial'
36
+ * }
37
+ * }));
38
+ * ```
39
+ */
40
+ export declare class BitmapText extends Component<BitmapTextParams> {
41
+ static componentName: string;
42
+ text: string;
43
+ style: BitmapTextStyleOptions;
44
+ init(obj?: BitmapTextParams): void;
45
+ }
46
+
47
+ export declare interface BitmapTextParams {
48
+ text: string;
49
+ style?: BitmapTextStyleOptions;
50
+ }
51
+
52
+ declare interface BitmapTextStyleOptions {
53
+ fontFamily?: string | string[];
54
+ fontSize?: number | string;
55
+ fill?: string | number;
56
+ align?: 'left' | 'center' | 'right' | 'justify';
57
+ letterSpacing?: number;
58
+ padding?: number;
59
+ stroke?: string | number;
60
+ strokeThickness?: number;
61
+ fontWeight?: TextStyleFontWeight;
62
+ fontStyle?: TextStyleFontStyle;
63
+ }
64
+
16
65
  /**
17
66
  * HTML 富文本组件
18
67
  *
@@ -231,8 +280,8 @@ export declare class TextSystem extends Renderer {
231
280
  name: string;
232
281
  texts: {
233
282
  [propName: number]: {
234
- text: Text_3 | HTMLText_2;
235
- component: Text_2 | HTMLText;
283
+ text: Text_3 | HTMLText_2 | BitmapText_2;
284
+ component: Text_2 | HTMLText | BitmapText;
236
285
  };
237
286
  };
238
287
  renderSystem: RendererSystem;
@@ -242,6 +291,7 @@ export declare class TextSystem extends Renderer {
242
291
  componentChanged(changed: ComponentChanged): Promise<void>;
243
292
  private addTextComponent;
244
293
  private addHTMLTextComponent;
294
+ private addBitmapTextComponent;
245
295
  /**
246
296
  * 等待字体资源加载完成并更新文本
247
297
  */
@@ -1,8 +1,8 @@
1
- import { TextStyle } from 'pixi.js';
2
1
  import { Component, decorators, OBSERVER_TYPE, resource } from '@eva/eva.js';
3
2
  import { type } from '@eva/inspector-decorator';
3
+ import { TextStyle } from 'pixi.js';
4
4
  import { Renderer, RendererSystem } from '@eva/plugin-renderer';
5
- import { HTMLText as HTMLText$1, Text as Text$3 } from '@eva/renderer-adapter';
5
+ import { HTMLText as HTMLText$1, Text as Text$3, BitmapText as BitmapText$1 } from '@eva/renderer-adapter';
6
6
 
7
7
  /*! *****************************************************************************
8
8
  Copyright (c) Microsoft Corporation. All rights reserved.
@@ -35,6 +35,47 @@ function __awaiter(thisArg, _arguments, P, generator) {
35
35
  });
36
36
  }
37
37
 
38
+ /**
39
+ * 位图文本组件
40
+ *
41
+ * BitmapText 组件使用位图字体渲染文本,性能优于 Canvas 文本渲染。
42
+ * 适用于频繁更新的文本场景,如计分板、倒计时等。
43
+ *
44
+ * 支持两种字体模式:
45
+ * - 动态生成:指定 TextStyle,PixiJS 自动生成 bitmap font
46
+ * - 预加载字体:通过 BitmapFont.install() 预安装或从 .fnt 文件加载
47
+ *
48
+ * @example
49
+ * ```typescript
50
+ * const score = new GameObject('score');
51
+ * score.addComponent(new BitmapText({
52
+ * text: 'Score: 0',
53
+ * style: {
54
+ * fontSize: 32,
55
+ * fill: '#ffffff',
56
+ * fontFamily: 'Arial'
57
+ * }
58
+ * }));
59
+ * ```
60
+ */
61
+ class BitmapText extends Component {
62
+ constructor() {
63
+ super(...arguments);
64
+ this.text = '';
65
+ this.style = {};
66
+ }
67
+ init(obj) {
68
+ this.style = Object.assign({ fontSize: 24, fill: '#000000', fontFamily: 'Arial' }, obj === null || obj === void 0 ? void 0 : obj.style);
69
+ if (obj) {
70
+ this.text = obj.text;
71
+ }
72
+ }
73
+ }
74
+ BitmapText.componentName = 'BitmapText';
75
+ __decorate([
76
+ type('string')
77
+ ], BitmapText.prototype, "text", void 0);
78
+
38
79
  /**
39
80
  * 文本组件(基于 PixiJS Text)
40
81
  *
@@ -222,15 +263,19 @@ let Text = class Text extends Renderer {
222
263
  return __awaiter(this, void 0, void 0, function* () {
223
264
  const isText = changed.componentName === 'Text';
224
265
  const isHTMLText = changed.componentName === 'HTMLText';
225
- if (!isText && !isHTMLText)
266
+ const isBitmapText = changed.componentName === 'BitmapText';
267
+ if (!isText && !isHTMLText && !isBitmapText)
226
268
  return;
227
269
  if (changed.type === OBSERVER_TYPE.ADD) {
228
270
  if (isText) {
229
271
  yield this.addTextComponent(changed);
230
272
  }
231
- else {
273
+ else if (isHTMLText) {
232
274
  yield this.addHTMLTextComponent(changed);
233
275
  }
276
+ else {
277
+ yield this.addBitmapTextComponent(changed);
278
+ }
234
279
  this.setSize(changed);
235
280
  }
236
281
  else if (changed.type === OBSERVER_TYPE.REMOVE) {
@@ -290,6 +335,26 @@ let Text = class Text extends Renderer {
290
335
  }
291
336
  });
292
337
  }
338
+ addBitmapTextComponent(changed) {
339
+ return __awaiter(this, void 0, void 0, function* () {
340
+ const component = changed.component;
341
+ // 创建样式副本,先不设置 fontFamily
342
+ const styleWithoutFont = Object.assign({}, component.style);
343
+ const fontFamily = styleWithoutFont.fontFamily;
344
+ delete styleWithoutFont.fontFamily;
345
+ const initialText = fontFamily ? '' : component.text;
346
+ const bitmapText = new BitmapText$1(initialText, styleWithoutFont);
347
+ this.containerManager.getContainer(changed.gameObject.id).addChildAt(bitmapText, 0);
348
+ this.texts[changed.gameObject.id] = {
349
+ text: bitmapText,
350
+ component,
351
+ };
352
+ // 如果指定了字体资源,等待资源加载完成后设置 fontFamily
353
+ if (fontFamily) {
354
+ yield this.waitForFontResource(bitmapText, changed, fontFamily);
355
+ }
356
+ });
357
+ }
293
358
  /**
294
359
  * 等待字体资源加载完成并更新文本
295
360
  */
@@ -357,8 +422,9 @@ Text = __decorate([
357
422
  decorators.componentObserver({
358
423
  Text: ['text', { prop: ['style'], deep: true }],
359
424
  HTMLText: ['text', { prop: ['style'], deep: true }, { prop: ['textureStyle'], deep: true }],
425
+ BitmapText: ['text', { prop: ['style'], deep: true }],
360
426
  })
361
427
  ], Text);
362
428
  var Text$1 = Text;
363
429
 
364
- export { HTMLText, Text$2 as Text, Text$1 as TextSystem };
430
+ export { BitmapText, HTMLText, Text$2 as Text, Text$1 as TextSystem };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eva/plugin-renderer-text",
3
- "version": "2.0.1-beta.33",
3
+ "version": "2.0.1-beta.34",
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.33",
23
- "@eva/renderer-adapter": "2.0.1-beta.33",
24
- "@eva/eva.js": "2.0.1-beta.33",
25
- "pixi.js": "^8.8.1"
22
+ "@eva/plugin-renderer": "2.0.1-beta.34",
23
+ "@eva/renderer-adapter": "2.0.1-beta.34",
24
+ "@eva/eva.js": "2.0.1-beta.34",
25
+ "pixi.js": "^8.17.0"
26
26
  }
27
27
  }