AncTe/HumanBreak
1
0
Fork 0
mirror of https://github.com/unanmed/HumanBreak.git synced 2025-01-19 04:19:30 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: patchProp for GraphicItemBase

Browse Source
This commit is contained in:
unanmed 2024-12-24 19:55:52 +08:00
parent 5c9419280e
commit 2aa0ffe12a
1 changed files with 104 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
src/core/render/preset/graphics.ts
View File

@ -51,6 +51,12 @@ export const enum GraphicMode {
StrokeAndFill StrokeAndFill
} }
const enum GraphicModeProp {
Fill,
Stroke,
StrokeAndFill
}
export interface EGraphicItemEvent extends ERenderItemEvent {} export interface EGraphicItemEvent extends ERenderItemEvent {}
export abstract class GraphicItemBase export abstract class GraphicItemBase
@ -68,6 +74,11 @@ export abstract class GraphicItemBase
miterLimit: number = 10; miterLimit: number = 10;
fillRule: CanvasFillRule = 'nonzero'; fillRule: CanvasFillRule = 'nonzero';
private propFill: boolean = true;
private propStroke: boolean = false;
private strokeAndFill: boolean = false;
private propFillSet: boolean = false;
/** /**
* 设置描边绘制的信息 * 设置描边绘制的信息
* @param options 线的信息 * @param options 线的信息
@ -119,6 +130,46 @@ export abstract class GraphicItemBase
this.update(); this.update();
} }
/**
* 检查渲染模式，参考 {@link GraphicPropsBase} 中的 fill stroke strokeAndFill 属性
*/
private checkMode(mode: GraphicModeProp, value: boolean) {
switch (mode) {
case GraphicModeProp.Fill:
this.propFill = value;
this.propFillSet = true;
break;
case GraphicModeProp.Stroke:
this.propStroke = value;
break;
case GraphicModeProp.StrokeAndFill:
this.strokeAndFill = true;
break;
}
if (this.strokeAndFill) {
this.mode = GraphicMode.StrokeAndFill;
} else {
if (!this.propFillSet) {
if (this.propStroke) {
this.mode = GraphicMode.Stroke;
} else {
this.mode = GraphicMode.Fill;
}
} else {
if (this.propFill && this.propStroke) {
this.mode = GraphicMode.FillAndStroke;
} else if (this.propFill) {
this.mode = GraphicMode.Fill;
} else if (this.propStroke) {
this.mode = GraphicMode.Stroke;
} else {
this.mode = GraphicMode.Fill;
}
}
}
this.update();
}
/** /**
* 设置画布的渲染状态，在实际渲染前调用 * 设置画布的渲染状态，在实际渲染前调用
* @param canvas 要设置的画布 * @param canvas 要设置的画布
@ -144,7 +195,60 @@ export abstract class GraphicItemBase
namespace?: ElementNamespace, namespace?: ElementNamespace,
parentComponent?: ComponentInternalInstance | null parentComponent?: ComponentInternalInstance | null
): void { ): void {
if (isNil(prevValue) && isNil(nextValue)) return;
switch (key) { switch (key) {
case 'fill':
if (!this.assertType(nextValue, 'number', key)) return;
this.checkMode(GraphicModeProp.Fill, nextValue);
break;
case 'stroke':
if (!this.assertType(nextValue, 'number', key)) return;
this.checkMode(GraphicModeProp.Stroke, nextValue);
break;
case 'strokeAndFill':
if (!this.assertType(nextValue, 'number', key)) return;
this.checkMode(GraphicModeProp.StrokeAndFill, nextValue);
break;
case 'fillRule':
if (!this.assertType(nextValue, 'string', key)) return;
this.setFillRule(nextValue);
break;
case 'fillStyle':
this.setFillStyle(nextValue);
break;
case 'strokeStyle':
this.setStrokeStyle(nextValue);
break;
case 'lineWidth':
if (!this.assertType(nextValue, 'number', key)) return;
this.lineWidth = nextValue;
this.update();
break;
case 'lineDash':
if (!this.assertType(nextValue, Array, key)) return;
this.lineDash = nextValue;
this.update();
break;
case 'lineDashOffset':
if (!this.assertType(nextValue, 'number', key)) return;
this.lineDashOffset = nextValue;
this.update();
break;
case 'lineJoin':
if (!this.assertType(nextValue, 'string', key)) return;
this.lineJoin = nextValue;
this.update();
break;
case 'lineCap':
if (!this.assertType(nextValue, 'string', key)) return;
this.lineCap = nextValue;
this.update();
break;
case 'miterLimit':
if (!this.assertType(nextValue, 'number', key)) return;
this.miterLimit = nextValue;
this.update();
break;
} }
super.patchProp(key, prevValue, nextValue, namespace, parentComponent); super.patchProp(key, prevValue, nextValue, namespace, parentComponent);
} }