mirror of
https://github.com/unanmed/HumanBreak.git
synced 2025-02-28 17:37:07 +08:00
feat: 优化文字组件
This commit is contained in:
parent
fc05ddec9b
commit
4835b0b367
@ -170,12 +170,10 @@ export class Damage extends Sprite<EDamageEvent> {
|
||||
this.setRenderFn((canvas, camera) => {
|
||||
const { ctx } = canvas;
|
||||
const { width, height } = canvas.canvas;
|
||||
ctx.save();
|
||||
ctx.imageSmoothingEnabled = false;
|
||||
this.renderDamage(camera);
|
||||
ctx.setTransform(1, 0, 0, 1, 0, 0);
|
||||
ctx.drawImage(this.damageMap.canvas, 0, 0, width, height);
|
||||
ctx.restore();
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -669,7 +669,6 @@ export class Layer extends Container {
|
||||
this.main.setRenderFn((canvas, transform) => {
|
||||
const { ctx } = canvas;
|
||||
const { width, height } = canvas.canvas;
|
||||
ctx.save();
|
||||
ctx.imageSmoothingEnabled = false;
|
||||
const need = this.calNeedRender(transform);
|
||||
this.renderMap(transform, need);
|
||||
@ -677,7 +676,6 @@ export class Layer extends Container {
|
||||
ctx.drawImage(this.backMap.canvas, 0, 0, width, height);
|
||||
ctx.drawImage(this.staticMap.canvas, 0, 0, width, height);
|
||||
ctx.drawImage(this.movingMap.canvas, 0, 0, width, height);
|
||||
ctx.restore();
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -9,6 +9,7 @@ export class Text extends Sprite {
|
||||
fillStyle?: CanvasStyle = '#fff';
|
||||
strokeStyle?: CanvasStyle;
|
||||
font?: string = '';
|
||||
strokeWidth: number = 1;
|
||||
|
||||
private length: number = 0;
|
||||
private descent: number = 0;
|
||||
@ -22,19 +23,18 @@ export class Text extends Sprite {
|
||||
if (text.length > 0) this.calBox();
|
||||
|
||||
this.renderFn = ({ canvas, ctx }) => {
|
||||
ctx.save();
|
||||
ctx.textBaseline = 'bottom';
|
||||
ctx.fillStyle = this.fillStyle ?? 'transparent';
|
||||
ctx.strokeStyle = this.strokeStyle ?? 'transparent';
|
||||
ctx.font = this.font ?? '';
|
||||
ctx.lineWidth = this.strokeWidth;
|
||||
|
||||
if (this.fillStyle) {
|
||||
ctx.fillText(this.text, 0, this.descent);
|
||||
}
|
||||
if (this.strokeStyle) {
|
||||
ctx.strokeText(this.text, 0, this.descent);
|
||||
}
|
||||
ctx.restore();
|
||||
if (this.fillStyle) {
|
||||
ctx.fillText(this.text, 0, this.descent);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@ -79,6 +79,14 @@ export class Text extends Sprite {
|
||||
this.strokeStyle = stroke;
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置描边宽度
|
||||
* @param width 宽度
|
||||
*/
|
||||
setStrokeWidth(width: number) {
|
||||
this.strokeWidth = width;
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算字体所占空间,从而确定这个元素的大小
|
||||
*/
|
||||
|
@ -29,7 +29,9 @@ export class Sprite<E extends ESpriteEvent = ESpriteEvent> extends RenderItem<
|
||||
canvas: MotaOffscreenCanvas2D,
|
||||
transform: Transform
|
||||
): void {
|
||||
canvas.ctx.save();
|
||||
this.renderFn(canvas, transform);
|
||||
canvas.ctx.restore();
|
||||
}
|
||||
|
||||
setRenderFn(fn: RenderFunction) {
|
||||
|
@ -1,6 +1,5 @@
|
||||
import { logger } from '@/core/common/logger';
|
||||
import { mainSetting } from '@/core/main/setting';
|
||||
import { Camera } from '@/core/render/camera';
|
||||
import {
|
||||
Damage,
|
||||
DamageRenderable,
|
||||
|
Loading…
Reference in New Issue
Block a user