From e8eb344d76001cdfc179ea127487748936247f7f Mon Sep 17 00:00:00 2001 From: xudan Date: Fri, 12 Dec 2025 10:37:40 +0800 Subject: [PATCH] =?UTF-8?q?feat(elevator):=20=E4=B8=BA=E5=90=91=E4=B8=8A?= =?UTF-8?q?=E5=92=8C=E5=90=91=E4=B8=8B=E7=AE=AD=E5=A4=B4=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=B9=B3=E6=BB=91=E7=9A=84=E4=B8=8A=E4=B8=8B=E7=A7=BB=E5=8A=A8?= =?UTF-8?q?=E5=8A=A8=E7=94=BB=E4=BB=A5=E5=A2=9E=E5=BC=BA=E8=A7=86=E8=A7=89?= =?UTF-8?q?=E5=8F=8D=E9=A6=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/services/editor/editor-drawers.ts | 22 ++++++++++++++++++---- 1 file changed, 18 insertions(+), 4 deletions(-) diff --git a/src/services/editor/editor-drawers.ts b/src/services/editor/editor-drawers.ts index bb6b696..8166f7c 100644 --- a/src/services/editor/editor-drawers.ts +++ b/src/services/editor/editor-drawers.ts @@ -216,9 +216,16 @@ function drawElevatorIcon( if (direction === 2) { // 向上状态 - 绿色箭头,显示在上方 const arrowSize = Math.min(width, height) * 0.35; // 箭头大小为图标较小边的35% - const arrowY = y - indicatorDistance - arrowSize - height * 0.05; // 箭头位置,留出5%缓冲 + const baseArrowY = y - indicatorDistance - arrowSize - height * 0.05; // 箭头基础位置 - // 绘制发光背景 + // 添加上下移动动画 + const movementPeriod = 1500; // 动画周期 1.5 秒 + const movementAmplitude = arrowSize * 0.15; // 移动幅度为箭头大小的15% + const movementPhase = (time % movementPeriod) / movementPeriod; + const movementOffset = movementAmplitude * Math.sin(movementPhase * Math.PI * 2); + const arrowY = baseArrowY + movementOffset; // 应用移动偏移 + + // 绘制发光背景(跟随箭头移动) const glowGradient = ctx.createRadialGradient(cx, arrowY + arrowSize/2, 0, cx, arrowY + arrowSize/2, arrowSize); glowGradient.addColorStop(0, 'rgba(16, 185, 129, 0.4)'); glowGradient.addColorStop(1, 'rgba(16, 185, 129, 0)'); @@ -244,9 +251,16 @@ function drawElevatorIcon( } else if (direction === 3) { // 向下状态 - 橙色箭头,显示在下方 const arrowSize = Math.min(width, height) * 0.35; // 箭头大小为图标较小边的35% - const arrowY = y + height + indicatorDistance + height * 0.05; // 箭头位置,留出5%缓冲 + const baseArrowY = y + height + indicatorDistance + height * 0.05; // 箭头基础位置 - // 绘制发光背景 + // 添加上下移动动画 + const movementPeriod = 1500; // 动画周期 1.5 秒 + const movementAmplitude = arrowSize * 0.15; // 移动幅度为箭头大小的15% + const movementPhase = (time % movementPeriod) / movementPeriod; + const movementOffset = movementAmplitude * Math.sin(movementPhase * Math.PI * 2); + const arrowY = baseArrowY + movementOffset; // 应用移动偏移 + + // 绘制发光背景(跟随箭头移动) const glowGradient = ctx.createRadialGradient(cx, arrowY + arrowSize/2, 0, cx, arrowY + arrowSize/2, arrowSize); glowGradient.addColorStop(0, 'rgba(251, 146, 60, 0.4)'); glowGradient.addColorStop(1, 'rgba(251, 146, 60, 0)');