refactor: 优化了获取鼠标所在显示器的逻辑 (#569) (#571)

Author: ayangweb

src/composables/useDevice.ts

@@ -1,3 +1,5 @@
+import type { CursorPoint } from '@/utils/monitor'
+
 import { invoke } from '@tauri-apps/api/core'
 import { isEqual, mapValues } from 'es-toolkit'
 import { ref } from 'vue'
@@ -15,14 +17,9 @@ interface MouseButtonEvent {
   value: string
 }
 
-interface MouseMoveValue {
-  x: number
-  y: number
-}
-
 interface MouseMoveEvent {
   kind: 'MouseMove'
-  value: MouseMoveValue
+  value: CursorPoint
 }
 
 interface KeyboardEvent {
@@ -34,7 +31,7 @@ type DeviceEvent = MouseButtonEvent | MouseMoveEvent | KeyboardEvent
 
 export function useDevice() {
   const modelStore = useModelStore()
-  const lastMousePoint = ref<MouseMoveValue>({ x: 0, y: 0 })
+  const lastCursorPoint = ref<CursorPoint>({ x: 0, y: 0 })
   const releaseTimers = new Map<string, NodeJS.Timeout>()
   const { handlePress, handleRelease, handleMouseChange, handleMouseMove } = useModel()
 
@@ -75,14 +72,14 @@ export function useDevice() {
     releaseTimers.set(key, timer)
   }
 
-  const processMouseMove = (value: MouseMoveValue) => {
-    const roundedValue = mapValues(value, Math.round)
+  const processMouseMove = (point: CursorPoint) => {
+    const roundedValue = mapValues(point, Math.round)
 
-    if (isEqual(lastMousePoint.value, roundedValue)) return
+    if (isEqual(lastCursorPoint.value, roundedValue)) return
 
-    lastMousePoint.value = roundedValue
+    lastCursorPoint.value = roundedValue
 
-    return handleMouseMove()
+    return handleMouseMove(point)
   }
 
   useTauriListen<DeviceEvent>(LISTEN_KEY.DEVICE_CHANGED, ({ payload }) => {

src/composables/useModel.ts

@@ -1,3 +1,5 @@
+import type { CursorPoint } from '@/utils/monitor'
+
 import { LogicalSize } from '@tauri-apps/api/dpi'
 import { resolveResource, sep } from '@tauri-apps/api/path'
 import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow'
@@ -105,8 +107,8 @@ export function useModel() {
     live2d.setParameterValue(id, pressed)
   }
 
-  async function handleMouseMove() {
-    const monitor = await getCursorMonitor()
+  async function handleMouseMove(point: CursorPoint) {
+    const monitor = await getCursorMonitor(point)
 
     if (!monitor) return
 

src/utils/monitor.ts

@@ -1,14 +1,26 @@
 import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow'
-import { cursorPosition, monitorFromPoint } from '@tauri-apps/api/window'
+import { monitorFromPoint } from '@tauri-apps/api/window'
+import { mapValues } from 'es-toolkit'
 
-export async function getCursorMonitor() {
-  const appWindow = getCurrentWebviewWindow()
+import { isMac } from './platform'
 
-  const scaleFactor = await appWindow.scaleFactor()
+export interface CursorPoint {
+  x: number
+  y: number
+}
+
+export async function getCursorMonitor(point: CursorPoint) {
+  let cursorPoint = point
+
+  if (isMac) {
+    const appWindow = getCurrentWebviewWindow()
 
-  const cursorPoint = await cursorPosition()
+    const scaleFactor = await appWindow.scaleFactor()
+
+    cursorPoint = mapValues(cursorPoint, value => value * scaleFactor)
+  }
 
-  const { x, y } = cursorPoint.toLogical(scaleFactor)
+  const { x, y } = point
 
   const monitor = await monitorFromPoint(x, y)