From 326e7568d2ffc24866a9afead6964920ec6f2229 Mon Sep 17 00:00:00 2001 From: zhe-he Date: Mon, 2 Sep 2024 12:55:04 +0800 Subject: [PATCH] fix: aligning --- .../aligning_guidelines/util/collect-point.ts | 42 ++++--------------- 1 file changed, 7 insertions(+), 35 deletions(-) diff --git a/extensions/aligning_guidelines/util/collect-point.ts b/extensions/aligning_guidelines/util/collect-point.ts index dddf3841440..20b170fee46 100644 --- a/extensions/aligning_guidelines/util/collect-point.ts +++ b/extensions/aligning_guidelines/util/collect-point.ts @@ -1,4 +1,4 @@ -import type { FabricObject, Point, TOriginX, TOriginY } from 'fabric'; +import type { FabricObject, Point } from 'fabric'; import { aligningLineConfig } from '../constant'; import { getDistance } from './basic'; @@ -15,8 +15,6 @@ type CollectPointProps = { /** Which specific point to operate on, 0-3 correspond to top-left, top-right, bottom-right, bottom-left */ index: number; }; -const originXArr: TOriginX[] = ['left', 'center', 'right']; -const originYArr: TOriginY[] = ['top', 'center', 'bottom']; export function collectVerticalPoint(props: CollectPointProps) { const aligningLineMargin = aligningLineConfig.margin; @@ -27,13 +25,12 @@ export function collectVerticalPoint(props: CollectPointProps) { let v = arr[arr.length - 1].x - point.x; // To the left or to the right? const dirX = index == 0 || index == 3 ? -1 : 1; - // To the top or to the bottom? - const dirY = index < 2 ? -1 : 1; v *= dirX; - const { width, height, scaleX, scaleY, left, top } = activeObject; + const { width, height, scaleX, scaleY } = activeObject; const dim = activeObject._getTransformedDimensions(); const sx = (v + dim.x) / dim.x; + const tl = activeObject.aCoords.tl; if (isScale) { activeObject.set('scaleX', scaleX * sx); if (isUniform) activeObject.set('scaleY', scaleY * sx); @@ -41,14 +38,7 @@ export function collectVerticalPoint(props: CollectPointProps) { activeObject.set('width', width * sx); if (isUniform) activeObject.set('height', height * sx); } - const dx = getDisByOriginX(activeObject, v * dirX); - if (isUniform) { - const h = activeObject._getTransformedDimensions().y - dim.y; - const dy = getDisByOriginY(activeObject, h * dirY); - activeObject.set('top', top + dy); - } - activeObject.set('left', left + dx); - + activeObject.setRelativeXY(tl, 'left', 'top'); activeObject.setCoords(); return arr.map((item) => ({ x: item.x, @@ -64,15 +54,14 @@ export function collectHorizontalPoint(props: CollectPointProps) { const margin = aligningLineMargin / (activeObject.canvas?.getZoom() ?? 1); if (dis > margin) return []; let v = arr[arr.length - 1].y - point.y; - // To the left or to the right? - const dirX = index == 0 || index == 3 ? -1 : 1; // To the top or to the bottom? const dirY = index < 2 ? -1 : 1; v *= dirY; - const { width, height, scaleX, scaleY, left, top } = activeObject; + const { width, height, scaleX, scaleY } = activeObject; const dim = activeObject._getTransformedDimensions(); const sy = (v + dim.y) / dim.y; + const tl = activeObject.aCoords.tl; if (isScale) { activeObject.set('scaleY', scaleY * sy); if (isUniform) activeObject.set('scaleX', scaleX * sy); @@ -80,13 +69,7 @@ export function collectHorizontalPoint(props: CollectPointProps) { activeObject.set('height', height * sy); if (isUniform) activeObject.set('width', width * sy); } - const dy = getDisByOriginY(activeObject, v * dirY); - if (isUniform) { - const w = activeObject._getTransformedDimensions().x - dim.x; - const dx = getDisByOriginX(activeObject, w * dirX); - activeObject.set('left', left + dx); - } - activeObject.set('top', top + dy); + activeObject.setRelativeXY(tl, 'left', 'top'); activeObject.setCoords(); return arr.map((item) => ({ y: item.y, @@ -110,14 +93,3 @@ function getDistanceList(point: Point, list: Point[], type: 'x' | 'y') { } return { dis, arr }; } - -function getDisByOriginX(target: FabricObject, v: number) { - const dArr = [0, v / 2, v]; - if (v < 0) dArr.reverse(); - return dArr[originXArr.indexOf(target.originX)]; -} -function getDisByOriginY(target: FabricObject, v: number) { - const dArr = [0, v / 2, v]; - if (v < 0) dArr.reverse(); - return dArr[originYArr.indexOf(target.originY)]; -}