更新选择事件

more-strive · Jun 27, 2024 · e41152f · e41152f
1 parent d1a6fa8
commit e41152f
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 10 deletions.
diff --git a/src/hooks/useCanvasScale.ts b/src/hooks/useCanvasScale.ts
@@ -1,15 +1,13 @@
 import { computed } from 'vue'
 import { storeToRefs } from 'pinia'
+import { CanvasTypes } from '@/enums'
 import { useFabricStore, useLeaferStore, useTemplatesStore } from '@/store'
 import { useElementBounding } from '@vueuse/core'
-import { Group, Point } from 'fabric'
 import useCanvas from '@/logic/Canvas/useCanvas'
 import useCenter from '@/logic/Canvas/useCenter'
-import { CanvasTypes } from '@/enums'
-import { WorkSpaceThumbType } from '@/configs/canvas'
+
 
 export default () => {
-  const fabricStore = useFabricStore()
   const leaferStore = useLeaferStore()
   const { zoom, wrapperRef, scalePercentage } = storeToRefs(leaferStore)
   const canvasScalePercentage = computed(() => Math.round(zoom.value * 100) + '%')
@@ -42,9 +40,8 @@ export default () => {
    */
   const setCanvasScalePercentage = (value: number) => {
     const [ canvas ] = useCanvas()
-    const { centerPoint } = useCenter()
-    canvas.zoomToPoint(centerPoint, value / 100)
-    zoom.value = canvas.getZoom()
+    canvas.tree.zoom(value / 100)
+    zoom.value = canvas.tree.scale as number
   }
 
   const setWorkSpace = (width: number, height: number) => {

diff --git a/src/hooks/useHandleCreate.ts b/src/hooks/useHandleCreate.ts
@@ -64,8 +64,9 @@ export default () => {
       //   value: 1,
       // }
     })
-    textElement.x = centerPoint.x - textElement.width;
-    textElement.y = centerPoint.y - textElement.height;
+    console.log('textElement.width:', textElement.width, textElement.height)
+    textElement.x = centerPoint.x - textElement.width / 2;
+    textElement.y = centerPoint.y - textElement.height / 2;
     renderCanvas(textElement)
   };
 

diff --git a/src/logic/Canvas/useCanvas.ts b/src/logic/Canvas/useCanvas.ts
@@ -1,7 +1,7 @@
 
 import { watch } from 'vue'
 import { storeToRefs } from 'pinia'
-import { App, Text, ChildEvent, UI, DragEvent, RotateEvent } from 'leafer-ui';
+import { App, Text, ChildEvent, UI, DragEvent, RotateEvent, ZoomEvent, PointerEvent } from 'leafer-ui';
 import { useElementBounding } from '@vueuse/core'
 import { useTemplatesStore, useLeaferStore } from '@/store'
 import { Editor, EditorMoveEvent, EditorEvent } from '@leafer-in/editor'
@@ -64,6 +64,8 @@ const initTemplate = () => {
 
 const initEvent = () => {
   if (!app) return
+  const leaferStore = useLeaferStore()
+  const { zoom } = storeToRefs(leaferStore)
   const templatesStore = useTemplatesStore()
   const workspace = app.tree.findOne(`#${CanvasTypes.WorkSpaceDrawType}`)
   if (!workspace) return
@@ -79,6 +81,13 @@ const initEvent = () => {
     console.log('DragEvent.END', e)
     templatesStore.modifedElement()
   })
+  app.tree.on(ZoomEvent.ZOOM, (e: ZoomEvent) => {
+    if (!app) return
+    zoom.value = app.tree.scale as number
+  })
+  app.tree.on(PointerEvent.DOWN, (e: PointerEvent) => {
+    console.log(app?.editor.list)
+  })
 }
 
 export const initEditor = () => {