fix: 当对象旋转后水平分布和垂直分布不均匀的问题 (#403)

ikuaitu · Jun 2, 2024 · 4548d21 · 4548d21
1 parent fa81e65
commit 4548d21
Showing 1 changed file with 58 additions and 4 deletions.
diff --git a/packages/core/plugin/GroupAlignPlugin.ts b/packages/core/plugin/GroupAlignPlugin.ts
@@ -229,7 +229,17 @@ class GroupAlignPlugin {
     const activeObject = canvas.getActiveObject();
     // width属性不准确，需要坐标换算
     function getItemWidth(item) {
-      return item.aCoords.tr.x - item.aCoords.tl.x;
+      let x1 = Infinity,
+        x2 = -Infinity;
+      for (const key in item.aCoords) {
+        if (item.aCoords[key].x < x1) {
+          x1 = item.aCoords[key].x;
+        }
+        if (item.aCoords[key].x > x2) {
+          x2 = item.aCoords[key].x;
+        }
+      }
+      return x2 - x1;
     }
 
     // 获取所有元素高度
@@ -281,16 +291,43 @@ class GroupAlignPlugin {
         const top = itemSpac * i + preHeight - yHeight;
         item.set('left', top);
       });
-      canvas.renderAll();
     }
+
+    const objecs = canvas.getActiveObjects();
+    canvas.discardActiveObject();
+    objecs.forEach((item) => {
+      let x = Infinity;
+      for (const key in item.aCoords) {
+        if (item.aCoords[key].x < x) {
+          x = item.aCoords[key].x;
+        }
+      }
+      item.set('left', 2 * item.left - x);
+    });
+
+    const sel = new fabric.ActiveSelection(objecs, {
+      canvas: canvas,
+    });
+    canvas.setActiveObject(sel);
+    canvas.requestRenderAll();
   }
 
   yequation() {
     const { canvas } = this;
     const activeObject = canvas.getActiveObject() || { top: 0, height: 0 };
     // width属性不准确，需要坐标换算
     function getItemHeight(item) {
-      return item.aCoords.bl.y - item.aCoords.tl.y;
+      let y1 = Infinity,
+        y2 = -Infinity;
+      for (const key in item.aCoords) {
+        if (item.aCoords[key].y < y1) {
+          y1 = item.aCoords[key].y;
+        }
+        if (item.aCoords[key].y > y2) {
+          y2 = item.aCoords[key].y;
+        }
+      }
+      return y2 - y1;
     }
     // 获取所有元素高度
     function getAllItemHeight() {
@@ -334,8 +371,25 @@ class GroupAlignPlugin {
         const top = itemSpac * i + preHeight - yHeight;
         item.set('top', top);
       });
-      canvas.renderAll();
     }
+
+    const objecs = canvas.getActiveObjects();
+    canvas.discardActiveObject();
+    objecs.forEach((item) => {
+      let y = Infinity;
+      for (const key in item.aCoords) {
+        if (item.aCoords[key].y < y) {
+          y = item.aCoords[key].y;
+        }
+      }
+      item.set('top', 2 * item.top - y);
+    });
+
+    const sel = new fabric.ActiveSelection(objecs, {
+      canvas: canvas,
+    });
+    canvas.setActiveObject(sel);
+    canvas.requestRenderAll();
   }
 
   destroy() {