From 7fb6e7014fb072ba04e64a0cb530ee5c37ec4559 Mon Sep 17 00:00:00 2001 From: lareinayanyu Date: Mon, 13 Jan 2025 19:15:21 +0800 Subject: [PATCH 1/3] =?UTF-8?q?fix:=20x,y=E4=BD=8D=E7=BD=AE=E4=BF=AE?= =?UTF-8?q?=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../runtime/components/react/mpx-movable-view.tsx | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx index 905385b43..fd6a2c55b 100644 --- a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx +++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx @@ -18,7 +18,7 @@ * ✔ vtouchmove */ import { useEffect, forwardRef, ReactNode, useContext, useCallback, useRef, useMemo, createElement } from 'react' -import { StyleSheet, NativeSyntheticEvent, View, LayoutChangeEvent } from 'react-native' +import { StyleSheet, View, LayoutChangeEvent } from 'react-native' import useInnerProps, { getCustomEvent } from './getInnerListeners' import useNodesRef, { HandlerRef } from './useNodesRef' import { MovableAreaContext } from './context' @@ -34,6 +34,7 @@ import Animated, { withSpring } from 'react-native-reanimated' import { collectDataset, noop } from '@mpxjs/utils' +import { useNavigation } from '@react-navigation/native' interface MovableViewProps { children: ReactNode; @@ -126,6 +127,8 @@ const _MovableView = forwardRef, MovableViewP setHeight } = useTransformStyle(Object.assign({}, style, styles.container), { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight }) + const navigation = useNavigation() + const prevSimultaneousHandlersRef = useRef>(originSimultaneousHandlers || []) const prevWaitForHandlersRef = useRef>(waitFor || []) const gestureSwitch = useRef(false) @@ -333,25 +336,27 @@ const _MovableView = forwardRef, MovableViewP setHeight(height || 0) } nodeRef.current?.measure((x: number, y: number, width: number, height: number) => { - layoutRef.current = { x, y, width, height, offsetLeft: 0, offsetTop: 0 } + const { y: navigationY = 0 } = navigation?.layout || {} + layoutRef.current = { x, y: y - navigationY, width, height, offsetLeft: 0, offsetTop: 0 } resetBoundaryAndCheck({ width, height }) }) props.onLayout && props.onLayout(e) } const extendEvent = useCallback((e: any, obj?: Record) => { + const { y: navigationY = 0 } = navigation?.layout || {} const touchArr = [e.changedTouches, e.allTouches] touchArr.forEach(touches => { touches && touches.forEach((item: { absoluteX: number; absoluteY: number; pageX: number; pageY: number }) => { item.pageX = item.absoluteX - item.pageY = item.absoluteY + item.pageY = item.absoluteY - navigationY }) }) Object.assign(e, { touches: e.allTouches, detail: { x: e.changedTouches[0].absoluteX, - y: e.changedTouches[0].absoluteY + y: e.changedTouches[0].absoluteY - navigationY }, currentTarget: { id: props.id || '', From d80a54608580761ef903dd29aad64c75af595899 Mon Sep 17 00:00:00 2001 From: lareinayanyu Date: Mon, 13 Jan 2025 20:12:45 +0800 Subject: [PATCH 2/3] =?UTF-8?q?fix:=20x,y=E4=BD=8D=E7=BD=AE=E4=BF=AE?= =?UTF-8?q?=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/react/mpx-movable-view.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx index fd6a2c55b..c9e0c1011 100644 --- a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx +++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx @@ -343,17 +343,19 @@ const _MovableView = forwardRef, MovableViewP props.onLayout && props.onLayout(e) } - const extendEvent = useCallback((e: any, obj?: Record) => { + const extendEvent = useCallback((e: any, type: 'start'|'move'|'end') => { const { y: navigationY = 0 } = navigation?.layout || {} const touchArr = [e.changedTouches, e.allTouches] touchArr.forEach(touches => { - touches && touches.forEach((item: { absoluteX: number; absoluteY: number; pageX: number; pageY: number }) => { + touches && touches.forEach((item: { absoluteX: number; absoluteY: number; pageX: number; pageY: number ; clientX: number; clientY: number}) => { item.pageX = item.absoluteX item.pageY = item.absoluteY - navigationY + item.clientX = item.absoluteX + item.clientY = item.absoluteY - navigationY }) }) Object.assign(e, { - touches: e.allTouches, + touches: type === 'end' ? [] : e.allTouches, detail: { x: e.changedTouches[0].absoluteX, y: e.changedTouches[0].absoluteY - navigationY @@ -364,17 +366,17 @@ const _MovableView = forwardRef, MovableViewP offsetLeft: 0, offsetTop: 0 } - }, obj) + }) }, []) const triggerStartOnJS = ({ e }: { e: GestureTouchEvent }) => { - extendEvent(e) + extendEvent(e, 'start') bindtouchstart && bindtouchstart(e) catchtouchstart && catchtouchstart(e) } const triggerMoveOnJS = ({ e, hasTouchmove, hasCatchTouchmove, touchEvent }: { e: GestureTouchEvent; hasTouchmove: boolean; hasCatchTouchmove: boolean; touchEvent: string }) => { - extendEvent(e) + extendEvent(e, 'move') if (hasTouchmove) { if (touchEvent === 'htouchmove') { bindhtouchmove && bindhtouchmove(e) @@ -395,7 +397,7 @@ const _MovableView = forwardRef, MovableViewP } const triggerEndOnJS = ({ e }: { e: GestureTouchEvent }) => { - extendEvent(e) + extendEvent(e, 'end') bindtouchend && bindtouchend(e) catchtouchend && catchtouchend(e) } From fd34c8f32bed29a2d15f686da82e74cf85f5e57c Mon Sep 17 00:00:00 2001 From: lareinayanyu Date: Mon, 13 Jan 2025 20:23:44 +0800 Subject: [PATCH 3/3] =?UTF-8?q?fix:=20x,y=E4=BD=8D=E7=BD=AE=E4=BF=AE?= =?UTF-8?q?=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../lib/runtime/components/react/mpx-movable-view.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx index c9e0c1011..291567ea6 100644 --- a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx +++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx @@ -356,16 +356,13 @@ const _MovableView = forwardRef, MovableViewP }) Object.assign(e, { touches: type === 'end' ? [] : e.allTouches, - detail: { - x: e.changedTouches[0].absoluteX, - y: e.changedTouches[0].absoluteY - navigationY - }, currentTarget: { id: props.id || '', dataset: collectDataset(props), offsetLeft: 0, offsetTop: 0 - } + }, + detail: {} }) }, [])