✨ 自定义三种左键功能

Littlefean · Littlefean · commit 005028eb5b3e · 2025-03-30T18:23:08.000+08:00
diff --git a/app/src/core/render/canvas2d/renderer.tsx b/app/src/core/render/canvas2d/renderer.tsx
@@ -494,9 +494,9 @@ export namespace Renderer {
     const currentStrokeColor = Stage.drawingMachine.getCurrentStrokeColor();
 
     if (Stage.drawingMachine.isUsing) {
-      if (Stage.drawingMachine.isAdjusting) {
+      if (Stage.drawingControlMachine.isAdjusting) {
         ShapeRenderer.renderCircle(
-          transformWorld2View(Stage.drawingMachine.startAdjustWidthLocation),
+          transformWorld2View(Stage.drawingControlMachine.startAdjustWidthLocation),
           (Stage.drawingMachine.currentStrokeWidth / 2) * Camera.currentScale,
           currentStrokeColor.a === 0 ? StageStyleManager.currentStyle.StageObjectBorder : currentStrokeColor,
           Color.Transparent,
diff --git a/app/src/core/service/controlService/controller/Controller.tsx b/app/src/core/service/controlService/controller/Controller.tsx
@@ -21,8 +21,8 @@ import { ControllerSectionEdit } from "./concrete/ControllerSectionEdit";
 // ...
 import { CursorNameEnum } from "../../../../types/cursors";
 import { controllerChildCamera } from "./concrete/ControllerChildCamera";
-import { controllerPenStroke } from "./concrete/ControllerPenStrokeControl";
 import { ControllerEntityResize } from "./concrete/ControllerEntityResize";
+import { controllerPenStrokeControl } from "./concrete/ControllerPenStrokeControl";
 
 /**
  * 控制器，控制鼠标、键盘事件
@@ -151,7 +151,7 @@ export namespace Controller {
     ControllerLayerMoving.init();
     ControllerImageScale.init();
     controllerChildCamera.init();
-    controllerPenStroke.init();
+    controllerPenStrokeControl.init();
     ControllerEntityResize.init();
     //
   }
@@ -330,7 +330,7 @@ export namespace Controller {
     ControllerLayerMoving.destroy();
     ControllerImageScale.destroy();
     controllerChildCamera.destroy();
-    controllerPenStroke.destroy();
+    controllerPenStrokeControl.destroy();
     ControllerEntityResize.destroy();
   }
 }
diff --git a/app/src/core/service/controlService/controller/concrete/ControllerCutting.tsx b/app/src/core/service/controlService/controller/concrete/ControllerCutting.tsx
@@ -5,7 +5,7 @@ import { Line } from "../../../../dataStruct/shape/Line";
 import { Vector } from "../../../../dataStruct/Vector";
 import { EdgeRenderer } from "../../../../render/canvas2d/entityRenderer/edge/EdgeRenderer";
 import { Renderer } from "../../../../render/canvas2d/renderer";
-import { Stage } from "../../../../stage/Stage";
+import { LeftMouseModeEnum, Stage } from "../../../../stage/Stage";
 import { GraphMethods } from "../../../../stage/stageManager/basicMethods/GraphMethods";
 import { StageManager } from "../../../../stage/stageManager/StageManager";
 import { Association } from "../../../../stage/stageObject/abstract/Association";
@@ -45,12 +45,22 @@ class CuttingControllerClass extends ControllerClass {
   private cuttingStartLocation = Vector.getZero();
 
   public mousedown: (event: MouseEvent) => void = (event: MouseEvent) => {
-    if (!(event.button == 2 || event.button == 3)) {
+    if (!(event.button == 2 || event.button == 0)) {
       return;
     }
-    if (Stage.mouseRightDragBackground !== "cut") {
+    // 左键按下的
+    if (event.button === 0 && Stage.leftMouseMode === LeftMouseModeEnum.connectAndCut) {
+      this.mouseDownEvent(event);
       return;
     }
+    // 右键按下的
+    if (event.button === 2 && Stage.mouseRightDragBackground === "cut") {
+      this.mouseDownEvent(event);
+      return;
+    }
+  };
+
+  private mouseDownEvent(event: MouseEvent) {
     const pressWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
     this.lastMoveLocation = pressWorldLocation.clone();
 
@@ -69,7 +79,7 @@ class CuttingControllerClass extends ControllerClass {
     } else {
       this.isUsing = false;
     }
-  };
+  }
 
   public mousemove: (event: MouseEvent) => void = (event: MouseEvent) => {
     if (!this.isUsing) {
@@ -162,7 +172,7 @@ class CuttingControllerClass extends ControllerClass {
   }
 
   public mouseup: (event: MouseEvent) => void = (event: MouseEvent) => {
-    if (!(event.button == 2 || event.button == 3)) {
+    if (!(event.button == 2 || event.button == 0)) {
       return;
     }
     if (!this.isUsing) {
diff --git a/app/src/core/service/controlService/controller/concrete/ControllerEntityClickSelectAndMove.tsx b/app/src/core/service/controlService/controller/concrete/ControllerEntityClickSelectAndMove.tsx
@@ -1,7 +1,7 @@
 import { Rectangle } from "../../../../dataStruct/shape/Rectangle";
 import { Vector } from "../../../../dataStruct/Vector";
 import { Renderer } from "../../../../render/canvas2d/renderer";
-import { Stage } from "../../../../stage/Stage";
+import { LeftMouseModeEnum, Stage } from "../../../../stage/Stage";
 import { StageAutoAlignManager } from "../../../../stage/stageManager/concreteMethods/StageAutoAlignManager";
 import { StageEntityMoveManager } from "../../../../stage/stageManager/concreteMethods/StageEntityMoveManager";
 import { StageHistoryManager } from "../../../../stage/stageManager/StageHistoryManager";
@@ -24,8 +24,7 @@ class ControllerEntityClickSelectAndMoveClass extends ControllerClass {
     if (event.button !== 0) {
       return;
     }
-    if (Stage.drawingMachine.isUsing) {
-      // 涂鸦的时候用不了拖动
+    if (Stage.leftMouseMode !== LeftMouseModeEnum.selectAndMove) {
       return;
     }
     this.mouseDownViewLocation = new Vector(event.clientX, event.clientY);
@@ -86,6 +85,9 @@ class ControllerEntityClickSelectAndMoveClass extends ControllerClass {
     if (Stage.selectMachine.isUsing || Stage.cuttingMachine.isUsing || Controller.pressingKeySet.has("alt")) {
       return;
     }
+    if (Stage.leftMouseMode !== LeftMouseModeEnum.selectAndMove) {
+      return;
+    }
     if (!this.isMovingEntity) {
       return;
     }
@@ -116,6 +118,9 @@ class ControllerEntityClickSelectAndMoveClass extends ControllerClass {
     if (event.button !== 0) {
       return;
     }
+    if (Stage.leftMouseMode !== LeftMouseModeEnum.selectAndMove) {
+      return;
+    }
 
     const mouseUpViewLocation = new Vector(event.clientX, event.clientY);
     const diffLocation = mouseUpViewLocation.subtract(this.mouseDownViewLocation);
diff --git a/app/src/core/service/controlService/controller/concrete/ControllerNodeConnection.tsx b/app/src/core/service/controlService/controller/concrete/ControllerNodeConnection.tsx
@@ -4,7 +4,7 @@ import { ProgressNumber } from "../../../../dataStruct/ProgressNumber";
 import { Vector } from "../../../../dataStruct/Vector";
 import { EdgeRenderer } from "../../../../render/canvas2d/entityRenderer/edge/EdgeRenderer";
 import { Renderer } from "../../../../render/canvas2d/renderer";
-import { Stage } from "../../../../stage/Stage";
+import { LeftMouseModeEnum, Stage } from "../../../../stage/Stage";
 import { StageManager } from "../../../../stage/stageManager/StageManager";
 import { ConnectableEntity } from "../../../../stage/stageObject/abstract/ConnectableEntity";
 import { ConnectPoint } from "../../../../stage/stageObject/entity/ConnectPoint";
@@ -73,13 +73,24 @@ class ControllerNodeConnectionClass extends ControllerClass {
   }
 
   public mousedown: (event: MouseEvent) => void = (event) => {
+    if (!(event.button == 2 || event.button == 0)) {
+      return;
+    }
+    if (event.button === 0 && Stage.leftMouseMode === LeftMouseModeEnum.connectAndCut) {
+      this.onMouseDown(event);
+    }
+    if (event.button === 2) {
+      this.onMouseDown(event);
+    }
+  };
+
+  private onMouseDown(event: MouseEvent) {
     const pressWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-    if (event.button === 0) {
+
+    if (event.button === 0 && Stage.leftMouseMode !== LeftMouseModeEnum.connectAndCut) {
+      // 在非左键模式下点击左键
       this.onLeftMouseDown(pressWorldLocation);
     }
-    if (!(event.button == 2 || event.button == 3)) {
-      return;
-    }
 
     this._lastRightMousePressLocation = pressWorldLocation.clone();
 
@@ -141,7 +152,7 @@ class ControllerNodeConnectionClass extends ControllerClass {
     SoundService.play.connectLineStart();
     this._isUsing = true;
     Controller.setCursorNameHook(CursorNameEnum.Crosshair);
-  };
+  }
 
   /**
    * 在mousemove的过程中，是否鼠标悬浮在了目标节点上
@@ -152,9 +163,18 @@ class ControllerNodeConnectionClass extends ControllerClass {
     if (Stage.selectMachine.isUsing || Stage.cuttingMachine.isUsing) {
       return;
     }
-    if (!(Controller.isMouseDown[2] || Controller.isMouseDown[3])) {
+    if (!this._isUsing) {
       return;
     }
+    if (Controller.isMouseDown[0] && Stage.leftMouseMode === LeftMouseModeEnum.connectAndCut) {
+      this.mouseMove(event);
+    }
+    if (Controller.isMouseDown[2]) {
+      this.mouseMove(event);
+    }
+  };
+
+  private mouseMove(event: MouseEvent) {
     const worldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
     // 连接线
     let isFindConnectToNode = false;
@@ -176,15 +196,23 @@ class ControllerNodeConnectionClass extends ControllerClass {
     }
     // 由于连接线要被渲染器绘制，所以需要更新总控制里的lastMoveLocation
     Controller.lastMoveLocation = worldLocation.clone();
-  };
+  }
 
   public mouseup: (event: MouseEvent) => void = (event) => {
-    if (!(event.button == 2 || event.button == 3)) {
+    if (!(event.button == 2 || event.button == 0)) {
       return;
     }
     if (!this.isConnecting()) {
       return;
     }
+    if (event.button === 0 && Stage.leftMouseMode === LeftMouseModeEnum.connectAndCut) {
+      this.mouseUp(event);
+    } else if (event.button === 2) {
+      this.mouseUp(event);
+    }
+  };
+
+  private mouseUp(event: MouseEvent) {
     const releaseWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
     const releaseTargetEntity = StageManager.findConnectableEntityByLocation(releaseWorldLocation);
     // 结束连线
@@ -219,7 +247,7 @@ class ControllerNodeConnectionClass extends ControllerClass {
     }
     this.clear();
     Controller.setCursorNameHook(CursorNameEnum.Default);
-  };
+  }
 
   /**
    * 一种更快捷的连接方法: 节点在选中状态下右键其它节点直接连接，不必拖动
diff --git a/app/src/core/service/controlService/controller/concrete/ControllerPenStrokeControl.tsx b/app/src/core/service/controlService/controller/concrete/ControllerPenStrokeControl.tsx
@@ -1,26 +1,60 @@
 import { Vector } from "../../../../dataStruct/Vector";
 import { Renderer } from "../../../../render/canvas2d/renderer";
-import { Stage } from "../../../../stage/Stage";
+import { LeftMouseModeEnum, Stage } from "../../../../stage/Stage";
 import { StageManager } from "../../../../stage/stageManager/StageManager";
+import { Controller } from "../Controller";
 import { ControllerClass } from "../ControllerClass";
 
 /**
  * 所有和笔迹控制特定的逻辑都在这里
  */
 export class ControllerPenStrokeControl extends ControllerClass {
-  // 检查鼠标是否悬浮在笔迹上
-  public mousemove: (event: MouseEvent) => void = (event) => {
-    if (Stage.drawingMachine.isUsing) {
+  public isAdjusting = false;
+  /**
+   * Alt键右键按下时的位置
+   */
+  public startAdjustWidthLocation: Vector = Vector.getZero();
+
+  public mousedown: (event: MouseEvent) => void = (event) => {
+    if (!(event.button === 2 && Stage.leftMouseMode === LeftMouseModeEnum.draw)) {
       return;
     }
-    const location = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-    for (const node of StageManager.getPenStrokes()) {
-      node.isMouseHover = false;
-      if (node.collisionBox.isContainsPoint(location)) {
-        node.isMouseHover = true;
+    const pressWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
+    if (event.button === 2 && Controller.pressingKeySet.has("alt")) {
+      // 右键按下时，开始调整笔刷粗细
+      this.startAdjustWidthLocation = pressWorldLocation.clone();
+      this.isAdjusting = true;
+    }
+  };
+
+  public mousemove: (event: MouseEvent) => void = (event) => {
+    if (Stage.leftMouseMode === LeftMouseModeEnum.selectAndMove) {
+      // 检查鼠标是否悬浮在笔迹上
+      const location = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
+      for (const node of StageManager.getPenStrokes()) {
+        node.isMouseHover = false;
+        if (node.collisionBox.isContainsPoint(location)) {
+          node.isMouseHover = true;
+        }
       }
     }
+    if (Stage.leftMouseMode === LeftMouseModeEnum.draw) {
+      if (Controller.pressingKeySet.has("alt") && Controller.isMouseDown[2]) {
+        this.onMouseMoveWhenAdjusting(event);
+        return;
+      }
+    }
+  };
+
+  private onMouseMoveWhenAdjusting = (event: MouseEvent) => {
+    // 更改宽度，检测鼠标上下移动的距离（模仿PS的笔刷粗细调整）
+    const worldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
+    const delta = this.startAdjustWidthLocation.distance(worldLocation);
+    // Stage.effectMachine.addEffect(LineEffect.default(this.startAdjustWidthLocation, worldLocation.clone()));
+    if (delta > 1) {
+      Stage.drawingMachine.currentStrokeWidth = Math.min(Math.round(delta * 2), 1000);
+    }
   };
 }
 
-export const controllerPenStroke = new ControllerPenStrokeControl();
+export const controllerPenStrokeControl = new ControllerPenStrokeControl();
diff --git a/app/src/core/service/controlService/controller/concrete/ControllerPenStrokeDrawing.tsx b/app/src/core/service/controlService/controller/concrete/ControllerPenStrokeDrawing.tsx
@@ -8,6 +8,7 @@ import { PenStroke, PenStrokeSegment } from "../../../../stage/stageObject/entit
 import { Settings } from "../../../Settings";
 import { Controller } from "../Controller";
 import { ControllerClass } from "../ControllerClass";
+import { LeftMouseModeEnum, Stage } from "../../../../stage/Stage";
 /**
  * 涂鸦功能
  */
@@ -17,8 +18,6 @@ class ControllerDrawingClass extends ControllerClass {
 
   public currentStroke: PenStrokeSegment[] = [];
 
-  public isAdjusting = false;
-
   public get isUsing() {
     return this._isUsing;
   }
@@ -41,10 +40,6 @@ class ControllerDrawingClass extends ControllerClass {
    * 当前画笔的粗度
    */
   public currentStrokeWidth = 5;
-  /**
-   * Alt键右键按下时的位置
-   */
-  public startAdjustWidthLocation: Vector = Vector.getZero();
 
   /**
    * 初始化函数
@@ -66,34 +61,26 @@ class ControllerDrawingClass extends ControllerClass {
 
   public mousedown: (event: MouseEvent) => void = (event: MouseEvent) => {
     if (!this._isUsing) return;
-    if (!(event.button === 0 || event.button === 2)) {
+    if (!(event.button === 0)) {
       return;
     }
     const pressWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-    if (event.button === 0) {
+    if (event.button === 0 && Stage.leftMouseMode === LeftMouseModeEnum.draw) {
       this.recordLocation.push(pressWorldLocation.clone());
 
       this.lastMoveLocation = pressWorldLocation.clone();
 
       Controller.setCursorNameHook(CursorNameEnum.Crosshair);
-    } else if (event.button === 2 && Controller.pressingKeySet.has("alt")) {
-      // 右键按下时，开始调整笔刷粗细
-      this.startAdjustWidthLocation = pressWorldLocation.clone();
-      this.isAdjusting = true;
     }
   };
 
   public mousemove = (event: MouseEvent) => {
     if (!this._isUsing) return;
-    if (!(Controller.isMouseDown[0] || Controller.isMouseDown[2])) {
+    if (!Controller.isMouseDown[0]) {
       return;
     }
     const worldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-    if (Controller.pressingKeySet.has("alt") && Controller.isMouseDown[2]) {
-      this.onMouseMoveWhenAdjusting(event);
-      return;
-    }
-    if (Controller.isMouseDown[0]) {
+    if (Controller.isMouseDown[0] && Stage.leftMouseMode === LeftMouseModeEnum.draw) {
       // 检测：如果移动距离不超过10，则不记录
       if (worldLocation.distance(this.lastMoveLocation) < 5) {
         return;
@@ -106,25 +93,12 @@ class ControllerDrawingClass extends ControllerClass {
     }
   };
 
-  private onMouseMoveWhenAdjusting = (event: MouseEvent) => {
-    // 更改宽度，检测鼠标上下移动的距离（模仿PS的笔刷粗细调整）
-    const worldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-    const delta = this.startAdjustWidthLocation.distance(worldLocation);
-    // Stage.effectMachine.addEffect(LineEffect.default(this.startAdjustWidthLocation, worldLocation.clone()));
-    if (delta > 1) {
-      this.currentStrokeWidth = Math.min(Math.round(delta * 2), 1000);
-    }
-  };
-
   public mouseup = (event: MouseEvent) => {
     if (!this._isUsing) return;
-    if (!(event.button === 0 || event.button === 2)) {
+    if (!(event.button === 0)) {
       return;
     }
-    if (event.button === 2) {
-      this.isAdjusting = false;
-    }
-    if (event.button === 0) {
+    if (event.button === 0 && Stage.leftMouseMode === LeftMouseModeEnum.draw) {
       const releaseWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
       this.recordLocation.push(releaseWorldLocation.clone());
 
diff --git a/app/src/core/service/controlService/controller/concrete/ControllerRectangleSelect.tsx b/app/src/core/service/controlService/controller/concrete/ControllerRectangleSelect.tsx
diff --git a/app/src/core/stage/Stage.tsx b/app/src/core/stage/Stage.tsx
diff --git a/app/src/pages/_toolbar.tsx b/app/src/pages/_toolbar.tsx
