feat: 字母描红页样式开发基本完成

miniprogram/core/draw/baseHeaderDraw.ts

@@ -0,0 +1,129 @@
+import { getMiniCodeImage, getImage } from '../../utils/index';
+
+/**
+ * 绘制数学模块页眉的参数接口（尺寸除以3）
+ */
+interface drawBaseHeaderParams {
+    canvas: WechatMiniprogram.Canvas;
+    ctx: RenderingContext;
+    headerType: PrintHeader;
+    options: {
+        appName: string;
+        appHint: string;
+        title: string;
+        subTitle: string;
+    };
+    onHeaderDrawn?: (currentY: number) => void;
+}
+
+/**
+ * 绘制数学模块完整页眉（尺寸除以3）
+ */
+export async function drawBaseHeader({
+    canvas,
+    ctx,
+    headerType,
+    options,
+    onHeaderDrawn,
+}: drawBaseHeaderParams): Promise<void> {
+    const { appName, appHint, title, subTitle } = options;
+
+    let titleX = 108; // 约109.33
+    const titleY = 25; // 约26.67
+
+    const logoX = 24; // 约26.67
+    const logoY = 20; // 20
+    const logoWidth = 65; // 约66.67
+    const logoHeight = 65; // 约66.67
+
+    // 根据 headerType 绘制 Logo 或调整标题位置
+    switch (headerType) {
+        case 'LogoImage': {
+            const image = await getImage(
+                canvas,
+                '/assets/imgs/doodle-logo.png',
+            );
+            ctx.drawImage(image, logoX, logoY, logoWidth, logoHeight);
+            break;
+        }
+        case 'noLogoImage': {
+            titleX = 40;
+            break;
+        }
+        case 'minimal': {
+            titleX = 40;
+            break;
+        }
+        default: {
+            const image = await getMiniCodeImage(canvas);
+            ctx.drawImage(image, logoX, logoY, logoWidth, logoHeight);
+            break;
+        }
+    }
+
+    // 绘制应用名称（字体大小除以3）
+    ctx.font = 'bold 22px "Microsoft Yahei"';
+    ctx.fillStyle = '#000';
+    ctx.textAlign = 'left';
+    ctx.textBaseline = 'top';
+    ctx.fillText(appName, titleX, titleY);
+
+    // 绘制应用提示（字体大小除以3）
+    ctx.font = '16px "Microsoft Yahei"';
+    ctx.fillStyle = '#666';
+    ctx.fillText(appHint, titleX, 66);
+
+    // 绘制标题（字体大小除以3）
+    ctx.font = 'bold 22px "Microsoft Yahei"';
+    ctx.fillStyle = '#000';
+    ctx.fillText(title, 280, titleY);
+
+    // 绘制副标题（字体大小除以3）
+    ctx.font = '16px "Microsoft Yahei"';
+    ctx.fillStyle = '#666';
+    ctx.fillText(subTitle, 280, 66);
+
+    // 调用回调函数
+    if (onHeaderDrawn) {
+        onHeaderDrawn(104);
+    }
+}
+
+/**
+ * 绘制数学模块迷你页眉的参数接口（尺寸除以3）
+ */
+interface drawBaseMiniHeaderParams {
+    // canvas: WechatMiniprogram.Canvas;
+    ctx: RenderingContext;
+    options: {
+        appName: string;
+        title: string;
+    };
+    canvasWidth: number; // 逻辑像素宽度（已除以3）
+    onHeaderDrawn?: (currentY: number) => void;
+}
+
+/**
+ * 绘制数学模块迷你页眉（尺寸除以3）
+ */
+export function drawBaseMiniHeader({
+    ctx,
+    options,
+    canvasWidth,
+    onHeaderDrawn,
+}: drawBaseMiniHeaderParams): void {
+    const { appName, title } = options;
+    const titleY = 46;
+    const centerX = canvasWidth / 2;
+
+    // 字体大小除以3
+    ctx.font = 'bold 24px "Microsoft Yahei"'; // 64/3
+    ctx.fillStyle = '#000';
+    ctx.textAlign = 'center';
+    ctx.fillText(appName + '    ' + title, centerX, titleY);
+
+    // 调用回调函数，传递除以3后的currentY
+    if (onHeaderDrawn) {
+        onHeaderDrawn(60); // 约66.67
+    }
+}