feat: 优化文字组件

This commit is contained in:
unanmed 2024-08-22 23:51:22 +08:00
parent fc05ddec9b
commit 4835b0b367
5 changed files with 15 additions and 10 deletions

View File

@ -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();
});
}

View File

@ -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();
});
}

View File

@ -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;
}
/**
*
*/

View File

@ -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) {

View File

@ -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,