feat: keep aspect ratio when drag image #414

Hufe921 · Jan 18, 2024 · e8684da · e8684da
1 parent 094af57
commit e8684da
Showing 1 changed file with 26 additions and 10 deletions.
diff --git a/src/editor/core/draw/particle/previewer/Previewer.ts b/src/editor/core/draw/particle/previewer/Previewer.ts
@@ -179,15 +179,31 @@ export class Previewer {
     let dy = 0
     switch (this.curHandleIndex) {
       case 0:
-        dx = this.mousedownX - evt.x
-        dy = this.mousedownY - evt.y
+        {
+          const offsetX = this.mousedownX - evt.x
+          const offsetY = this.mousedownY - evt.y
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3)
+          dy = (this.curElement.height! * dx) / this.curElement.width!
+        }
         break
       case 1:
         dy = this.mousedownY - evt.y
         break
       case 2:
-        dx = evt.x - this.mousedownX
-        dy = this.mousedownY - evt.y
+        {
+          const offsetX = evt.x - this.mousedownX
+          const offsetY = this.mousedownY - evt.y
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3)
+          dy = (this.curElement.height! * dx) / this.curElement.width!
+        }
+        break
+      case 4:
+        {
+          const offsetX = evt.x - this.mousedownX
+          const offsetY = evt.y - this.mousedownY
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3)
+          dy = (this.curElement.height! * dx) / this.curElement.width!
+        }
         break
       case 3:
         dx = evt.x - this.mousedownX
@@ -196,16 +212,16 @@ export class Previewer {
         dy = evt.y - this.mousedownY
         break
       case 6:
-        dx = this.mousedownX - evt.x
-        dy = evt.y - this.mousedownY
+        {
+          const offsetX = this.mousedownX - evt.x
+          const offsetY = evt.y - this.mousedownY
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3)
+          dy = (this.curElement.height! * dx) / this.curElement.width!
+        }
         break
       case 7:
         dx = this.mousedownX - evt.x
         break
-      default:
-        dx = evt.x - this.mousedownX
-        dy = evt.y - this.mousedownY
-        break
     }
     // 图片实际宽高（变化大小除掉缩放比例）
     const dw = this.curElement.width! + dx / scale