22 * @Author : 秦少卫
33 * @Date : 2023-06-22 16:19:46
44 * @LastEditors : 秦少卫
5- * @LastEditTime : 2024-04-10 17:33:17
5+ * @LastEditTime : 2024-07-22 10:21:05
66 * @Description : 组对齐插件
77 */
88
@@ -18,18 +18,6 @@ class GroupAlignPlugin implements IPluginTempl {
1818
1919 left ( ) {
2020 const { canvas } = this ;
21- // const activeObject = canvas.getActiveObject();
22- // if (activeObject && activeObject.type === 'activeSelection') {
23- // const activeSelection = activeObject;
24- // const activeObjectLeft = -(activeObject.width / 2);
25- // activeSelection.forEachObject((item) => {
26- // item.set({
27- // left: activeObjectLeft,
28- // });
29- // item.setCoords();
30- // canvas.renderAll();
31- // });
32- // }
3321
3422 const activeObject = canvas . getActiveObject ( ) ;
3523 const selectObjects = canvas . getActiveObjects ( ) ;
@@ -53,18 +41,6 @@ class GroupAlignPlugin implements IPluginTempl {
5341
5442 right ( ) {
5543 const { canvas } = this ;
56- // const activeObject = canvas.getActiveObject();
57- // if (activeObject && activeObject.type === 'activeSelection') {
58- // const activeSelection = activeObject;
59- // const activeObjectLeft = activeObject.width / 2;
60- // activeSelection.forEachObject((item) => {
61- // item.set({
62- // left: activeObjectLeft - item.width * item.scaleX,
63- // });
64- // item.setCoords();
65- // canvas.renderAll();
66- // });
67- // }
6844
6945 const activeObject = canvas . getActiveObject ( ) ;
7046 const selectObjects = canvas . getActiveObjects ( ) ;
@@ -87,17 +63,6 @@ class GroupAlignPlugin implements IPluginTempl {
8763
8864 xcenter ( ) {
8965 const { canvas } = this ;
90- // const activeObject = canvas.getActiveObject();
91- // if (activeObject && activeObject.type === 'activeSelection') {
92- // const activeSelection = activeObject;
93- // activeSelection.forEachObject((item) => {
94- // item.set({
95- // left: 0 - (item.width * item.scaleX) / 2,
96- // });
97- // item.setCoords();
98- // canvas.renderAll();
99- // });
100- // }
10166
10267 const activeObject = canvas . getActiveObject ( ) ;
10368 const selectObjects = canvas . getActiveObjects ( ) ;
@@ -120,17 +85,6 @@ class GroupAlignPlugin implements IPluginTempl {
12085
12186 ycenter ( ) {
12287 const { canvas } = this ;
123- // const activeObject = canvas.getActiveObject();
124- // if (activeObject && activeObject.type === 'activeSelection') {
125- // const activeSelection = activeObject;
126- // activeSelection.forEachObject((item) => {
127- // item.set({
128- // top: 0 - (item.height * item.scaleY) / 2,
129- // });
130- // item.setCoords();
131- // canvas.renderAll();
132- // });
133- // }
13488
13589 const activeObject = canvas . getActiveObject ( ) ;
13690 const selectObjects = canvas . getActiveObjects ( ) ;
@@ -153,18 +107,6 @@ class GroupAlignPlugin implements IPluginTempl {
153107
154108 top ( ) {
155109 const { canvas } = this ;
156- // const activeObject = canvas.getActiveObject();
157- // if (activeObject && activeObject.type === 'activeSelection') {
158- // const activeSelection = activeObject;
159- // const activeObjectTop = -(activeObject.height / 2);
160- // activeSelection.forEachObject((item) => {
161- // item.set({
162- // top: activeObjectTop,
163- // });
164- // item.setCoords();
165- // canvas.renderAll();
166- // });
167- // }
168110
169111 const activeObject = canvas . getActiveObject ( ) ;
170112 const selectObjects = canvas . getActiveObjects ( ) ;
@@ -187,18 +129,6 @@ class GroupAlignPlugin implements IPluginTempl {
187129
188130 bottom ( ) {
189131 const { canvas } = this ;
190- // const activeObject = canvas.getActiveObject();
191- // if (activeObject && activeObject.type === 'activeSelection') {
192- // const activeSelection = activeObject;
193- // const activeObjectTop = activeObject.height / 2;
194- // activeSelection.forEachObject((item) => {
195- // item.set({
196- // top: activeObjectTop - item.height * item.scaleY,
197- // });
198- // item.setCoords();
199- // canvas.renderAll();
200- // });
201- // }
202132
203133 const activeObject = canvas . getActiveObject ( ) ;
204134 const selectObjects = canvas . getActiveObjects ( ) ;
@@ -221,9 +151,9 @@ class GroupAlignPlugin implements IPluginTempl {
221151
222152 xequation ( ) {
223153 const { canvas } = this ;
224- const activeObject = canvas . getActiveObject ( ) ;
154+ const activeObject = canvas . getActiveObject ( ) as fabric . ActiveSelection ;
225155 // width属性不准确,需要坐标换算
226- function getItemWidth ( item ) {
156+ function getItemWidth ( item : fabric . Object ) {
227157 let x1 = Infinity ,
228158 x2 = - Infinity ;
229159 for ( const key in item . aCoords ) {
@@ -241,7 +171,7 @@ class GroupAlignPlugin implements IPluginTempl {
241171 function getAllItemHeight ( ) {
242172 let count = 0 ;
243173 if ( activeObject ) {
244- activeObject . forEachObject ( ( item ) => {
174+ activeObject . forEachObject ( ( item : fabric . Object ) => {
245175 count += getItemWidth ( item ) ;
246176 } ) ;
247177 }
@@ -258,7 +188,7 @@ class GroupAlignPlugin implements IPluginTempl {
258188 }
259189
260190 // 获取当前元素之前所有元素的高度
261- function getItemLeft ( i ) {
191+ function getItemLeft ( i : number ) {
262192 if ( i === 0 ) return 0 ;
263193 let width = 0 ;
264194 if ( activeObject ) {
@@ -275,11 +205,11 @@ class GroupAlignPlugin implements IPluginTempl {
275205 activeSelection . _objects . sort ( ( a , b ) => a . left - b . left ) ;
276206
277207 // 平均间距计算
278- const itemSpac = spacWidth ( ) ;
208+ const itemSpac = spacWidth ( ) as number ;
279209 // 组原点高度
280210 const yHeight = Number ( activeObject . width ) / 2 ;
281211
282- activeObject . forEachObject ( ( item , i ) => {
212+ activeObject . forEachObject ( ( item : fabric . Object , i : number ) => {
283213 // 获取当前元素之前所有元素的高度
284214 const preHeight = getItemLeft ( i ) ;
285215 // 顶部距离 间距 * 索引 + 之前元素高度 - 原点高度
@@ -290,7 +220,7 @@ class GroupAlignPlugin implements IPluginTempl {
290220
291221 const objecs = canvas . getActiveObjects ( ) ;
292222 canvas . discardActiveObject ( ) ;
293- objecs . forEach ( ( item ) => {
223+ objecs . forEach ( ( item : fabric . Object ) => {
294224 let x = Infinity ;
295225 for ( const key in item . aCoords ) {
296226 if ( item . aCoords [ key ] . x < x ) {
@@ -309,9 +239,12 @@ class GroupAlignPlugin implements IPluginTempl {
309239
310240 yequation ( ) {
311241 const { canvas } = this ;
312- const activeObject = canvas . getActiveObject ( ) || { top : 0 , height : 0 } ;
242+ const activeObject = ( canvas . getActiveObject ( ) as fabric . ActiveSelection ) || {
243+ top : 0 ,
244+ height : 0 ,
245+ } ;
313246 // width属性不准确,需要坐标换算
314- function getItemHeight ( item ) {
247+ function getItemHeight ( item : fabric . Object ) {
315248 let y1 = Infinity ,
316249 y2 = - Infinity ;
317250 for ( const key in item . aCoords ) {
@@ -327,7 +260,7 @@ class GroupAlignPlugin implements IPluginTempl {
327260 // 获取所有元素高度
328261 function getAllItemHeight ( ) {
329262 let count = 0 ;
330- activeObject . forEachObject ( ( item ) => {
263+ activeObject . forEachObject ( ( item : fabric . Object ) => {
331264 count += getItemHeight ( item ) ;
332265 } ) ;
333266 return count ;
@@ -340,7 +273,7 @@ class GroupAlignPlugin implements IPluginTempl {
340273 }
341274
342275 // 获取当前元素之前所有元素的高度
343- function getItemTop ( i ) {
276+ function getItemTop ( i : number ) {
344277 if ( i === 0 ) return 0 ;
345278 let height = 0 ;
346279 for ( let index = 0 ; index < i ; index ++ ) {
0 commit comments