feat: 每日打卡
This commit is contained in:
@@ -174,3 +174,43 @@ export function drawFourLineGrid(
|
||||
ctx.lineTo(x + w, yBot);
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
/**
|
||||
* 闭合四线三格
|
||||
* - 外框:闭合矩形
|
||||
* - 中间两条:虚线
|
||||
*/
|
||||
export function drawClosedFourLineGrid(
|
||||
ctx: RenderingContext,
|
||||
x: number,
|
||||
y: number,
|
||||
w: number,
|
||||
h: number,
|
||||
style?: FourLineGridStyle,
|
||||
) {
|
||||
const ink = style?.ink ?? '#9AA9A2';
|
||||
const middleInk = style?.middleInk ?? 'rgba(154, 169, 162, 0.65)';
|
||||
const lineWidth = style?.lineWidth ?? 1;
|
||||
const dash = style?.dash ?? [3, 3];
|
||||
|
||||
const y1 = y + h / 3;
|
||||
const y2 = y + (h * 2) / 3;
|
||||
|
||||
ctx.save();
|
||||
|
||||
ctx.strokeStyle = ink;
|
||||
ctx.lineWidth = lineWidth;
|
||||
ctx.setLineDash([]);
|
||||
ctx.strokeRect(x, y, w, h);
|
||||
|
||||
ctx.strokeStyle = middleInk;
|
||||
ctx.setLineDash(dash);
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x, y1);
|
||||
ctx.lineTo(x + w, y1);
|
||||
ctx.moveTo(x, y2);
|
||||
ctx.lineTo(x + w, y2);
|
||||
ctx.stroke();
|
||||
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user