diff --git a/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/previewDragThreshold.ts b/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/previewDragThreshold.ts new file mode 100644 index 000000000..a38a6f469 --- /dev/null +++ b/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/previewDragThreshold.ts @@ -0,0 +1,21 @@ +/** 屏幕像素坐标点。 */ +export type ScreenPoint = { + x: number; + y: number; +}; + +/** + * 指针拖动阈值(屏幕像素)。左键拖动/缩放与右键拖拽平移共用同一判据, + * 保证同一张画布上"多小的移动算点击"只有一个答案。 + */ +export const DRAG_THRESHOLD_SCREEN_PX = 2; + +export function passedDragThresholdScreen( + start: ScreenPoint, + current: ScreenPoint, +): boolean { + return ( + Math.hypot(current.x - start.x, current.y - start.y) >= + DRAG_THRESHOLD_SCREEN_PX + ); +} diff --git a/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/useNodeTransformInteraction.ts b/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/useNodeTransformInteraction.ts index 37ad66c0e..b619f6c01 100644 --- a/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/useNodeTransformInteraction.ts +++ b/apps/ai-game-creator-shell/src/view/ui-editor/components/preview/useNodeTransformInteraction.ts @@ -21,6 +21,7 @@ import { import type { Node as UiNode } from '../../../../features/ui-editor/types/Node'; import type { UITree } from '../../../../features/ui-editor/types/UITree'; import type { UiEditorCanvasProjection } from '../../useUiEditorPage'; +import { passedDragThresholdScreen } from './previewDragThreshold'; type ViewportScale = { scale: number }; type GestureBase = { @@ -47,17 +48,13 @@ type ActiveGesture = ratioAxis: ResizeAxis | null; }); -const DRAG_THRESHOLD_SCREEN_PX = 2; - function passedDragThreshold( gesture: GestureBase, event: ReactPointerEvent, ) { - return ( - Math.hypot( - event.clientX - gesture.startClientX, - event.clientY - gesture.startClientY, - ) >= DRAG_THRESHOLD_SCREEN_PX + return passedDragThresholdScreen( + { x: gesture.startClientX, y: gesture.startClientY }, + { x: event.clientX, y: event.clientY }, ); }