feat: path control handle optimize

F-star · Mar 2, 2024 · d8ce1cd · d8ce1cd
1 parent a68cdef
commit d8ce1cd
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 18 deletions.
diff --git a/packages/core/src/tools/tool_draw_path.ts b/packages/core/src/tools/tool_draw_path.ts
@@ -24,14 +24,14 @@ export class DrawPathTool implements ITool {
   private path: Path | null = null;
   private prevPathData: ISegment[][] = [];
   private pathIdx = 0;
-  private currCursorScenePoint: IPoint | null = null;
 
   constructor(private editor: Editor) {}
   onActive() {
     if (this.editor.pathEditor.getActive()) {
       this.path = this.editor.pathEditor.getPath()!;
       this.pathIdx = this.path.attrs.pathData.length;
     }
+    this.updateControlHandlesWithPreviewHandles(this.getCursorPoint());
   }
   onInactive() {
     this.editor.commandManager.batchCommandEnd();
@@ -50,14 +50,23 @@ export class DrawPathTool implements ITool {
       point.y = getClosestTimesVal(point.y, 0.5);
     }
 
-    this.currCursorScenePoint = point;
     if (this.editor.hostEventManager.isSpacePressing) {
       this.editor.pathEditor.updateControlHandles();
     } else {
-      this.updateControlHandlesWithPreviewHandles(this.currCursorScenePoint);
+      this.updateControlHandlesWithPreviewHandles(this.getCursorPoint());
     }
   }
 
+  /** get corrected cursor point */
+  private getCursorPoint() {
+    const point = this.editor.toolManager.getCurrPoint();
+    if (this.editor.setting.get('snapToPixelGrid')) {
+      point.x = getClosestTimesVal(point.x, 0.5);
+      point.y = getClosestTimesVal(point.y, 0.5);
+    }
+    return point;
+  }
+
   onStart(e: PointerEvent) {
     const point = this.editor.getSceneCursorXY(e);
     const pathEditor = this.editor.pathEditor;
@@ -148,14 +157,13 @@ export class DrawPathTool implements ITool {
     this.editor.render();
   }
 
-  onDrag(e: PointerEvent) {
+  onDrag() {
     if (!this.startPoint) {
       console.warn('startPoint is null, check start()');
       return;
     }
 
-    const point = this.editor.getSceneCursorXY(e);
-    this.currCursorScenePoint = point;
+    const point = this.getCursorPoint();
     if (this.editor.setting.get('snapToPixelGrid')) {
       point.x = getClosestTimesVal(point.x, 0.5);
       point.y = getClosestTimesVal(point.y, 0.5);
@@ -192,28 +200,24 @@ export class DrawPathTool implements ITool {
   }
 
   onCommandChange() {
-    if (this.currCursorScenePoint) {
-      this.updateControlHandlesWithPreviewHandles(this.currCursorScenePoint);
-    }
+    this.updateControlHandlesWithPreviewHandles(this.getCursorPoint());
   }
 
   onSpaceToggle(isSpacePressing: boolean) {
     if (isSpacePressing) {
       this.editor.pathEditor.updateControlHandles();
       this.editor.render();
     } else {
-      if (this.currCursorScenePoint) {
-        this.updateControlHandlesWithPreviewHandles(this.currCursorScenePoint);
-        this.editor.render();
-      }
+      this.updateControlHandlesWithPreviewHandles(this.getCursorPoint());
+      this.editor.render();
     }
   }
 
   onViewportXOrYChange() {
     if (this.editor.hostEventManager.isSpacePressing) {
       this.editor.pathEditor.updateControlHandles();
     } else {
-      this.updateControlHandlesWithPreviewHandles(this.currCursorScenePoint!);
+      this.updateControlHandlesWithPreviewHandles(this.getCursorPoint());
     }
     this.editor.render();
   }

diff --git a/packages/core/src/tools/tool_manager.ts b/packages/core/src/tools/tool_manager.ts
@@ -32,13 +32,10 @@ export class ToolManager {
   private keyBindingToken: number[] = [];
   private _isDragging = false;
   private enableToolTypes: string[] = [];
+  private currViewportPoint: IPoint = { x: Infinity, y: Infinity };
 
   _unbindEvent: () => void;
 
-  isDragging() {
-    return this._isDragging;
-  }
-
   constructor(private editor: Editor) {
     this.registerToolCtor(SelectTool);
     this.registerToolCtor(DrawRectTool);
@@ -139,6 +136,7 @@ export class ToolManager {
       });
     };
     const handleMove = (e: PointerEvent) => {
+      this.currViewportPoint = this.editor.getCursorXY(e);
       if (!this.currentTool) {
         throw new Error('未设置当前使用工具');
       }
@@ -250,4 +248,15 @@ export class ToolManager {
       this.editor.cursorManager.setCursor(this.currentTool.cursor);
     }
   }
+
+  isDragging() {
+    return this._isDragging;
+  }
+
+  getCurrPoint() {
+    return this.editor.viewportCoordsToScene(
+      this.currViewportPoint.x,
+      this.currViewportPoint.y,
+    );
+  }
 }