R524809
77 lines
2.3 KiB
TypeScript
77 lines
2.3 KiB
TypeScript
import { BaseMathDrawService } from './baseMathDraw';
|
|
import { drawNumberPreview } from './numberPreviewDraw';
|
|
import { drawNumberContent } from './numberContentDraw';
|
|
import { drawNumberWriteContent } from './numberWriteDraw';
|
|
|
|
/**
|
|
* 数字涂色绘制服务
|
|
* 组合使用基础绘制服务、预览区域绘制服务和内容区域绘制服务
|
|
*/
|
|
class NumberColorDraw extends BaseMathDrawService {
|
|
selectedNumber: number;
|
|
functionId: string; // 功能ID，用于判断绘制类型
|
|
|
|
constructor(
|
|
canvas: Canvas,
|
|
ctx: RenderingContext,
|
|
options?: Record<string, any>,
|
|
) {
|
|
super(canvas, ctx, options);
|
|
this.selectedNumber = 0;
|
|
this.functionId = options?.functionId || 'number-find';
|
|
}
|
|
|
|
async draw(selectedNumber: number) {
|
|
if (selectedNumber <= 0 || selectedNumber > 10) {
|
|
return;
|
|
}
|
|
|
|
this.setPrintConfig();
|
|
this.selectedNumber = selectedNumber;
|
|
this.clear();
|
|
this.setPaper();
|
|
|
|
// 绘制Header
|
|
if (this.headerType !== 'minimal') {
|
|
await this.drawHeader();
|
|
} else {
|
|
this.drawMiniHeader();
|
|
}
|
|
|
|
// 绘制预览区域
|
|
this.drawDivider();
|
|
await drawNumberPreview({
|
|
canvas: this.canvas,
|
|
ctx: this.ctx,
|
|
selectedNumber: this.selectedNumber,
|
|
canvasWidth: this.canvasWidth,
|
|
startY: this.currentY,
|
|
onDrawn: (currentY) => {
|
|
this.currentY = currentY;
|
|
},
|
|
});
|
|
|
|
// 绘制内容区域（根据 functionId 选择不同的绘制方法）
|
|
this.drawDivider();
|
|
if (this.functionId === 'number-write') {
|
|
// 书写类型：绘制书写行
|
|
drawNumberWriteContent({
|
|
ctx: this.ctx,
|
|
selectedNumber: this.selectedNumber,
|
|
canvasWidth: this.canvasWidth,
|
|
startY: this.currentY,
|
|
});
|
|
} else {
|
|
// 默认类型（number-find）：绘制数字涂色内容
|
|
drawNumberContent({
|
|
ctx: this.ctx,
|
|
selectedNumber: this.selectedNumber,
|
|
canvasWidth: this.canvasWidth,
|
|
startY: this.currentY,
|
|
});
|
|
}
|
|
}
|
|
}
|
|
|
|
export default NumberColorDraw;
|