@mpxjs/webpack-plugin 2.10.7-beta.9 → 2.10.7

package/lib/runtime/components/react/dist/mpx-movable-area.jsx

@@ -1,87 +1,33 @@
 /**
- * ✔ scale-area
+ * ✘ scale-area
  */
 import { View } from 'react-native';
-import { forwardRef, useRef, useMemo, useCallback, createElement } from 'react';
-import { GestureDetector, Gesture } from 'react-native-gesture-handler';
-import { useSharedValue } from 'react-native-reanimated';
+import { forwardRef, useRef, useMemo, createElement } from 'react';
 import useNodesRef from './useNodesRef';
 import useInnerProps from './getInnerListeners';
 import { MovableAreaContext } from './context';
 import { useTransformStyle, wrapChildren, useLayout, extendObject } from './utils';
 import Portal from './mpx-portal';
 const _MovableArea = forwardRef((props, ref) => {
-    const { style = {}, 'scale-area': scaleArea = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight } = props;
+    const { style = {}, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight } = props;
     const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, hasPositionFixed, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
-    const movableAreaRef = useRef(null);
-    const movableViewsValue = useSharedValue({});
-    useNodesRef(props, ref, movableAreaRef, {
+    const movableViewRef = useRef(null);
+    useNodesRef(props, ref, movableViewRef, {
         style: normalStyle
     });
-    // 注册/注销 MovableView 的回调
-    const registerMovableView = useCallback((id, callbacks) => {
-        movableViewsValue.value = extendObject(movableViewsValue.value, { [id]: callbacks });
-    }, []);
-    const unregisterMovableView = useCallback((id) => {
-        delete movableViewsValue.value[id];
-    }, []);
-    // 处理区域缩放手势
-    const handleAreaScale = useCallback((scaleInfo) => {
-        'worklet';
-        if (scaleArea) {
-            // 将缩放信息广播给所有注册的 MovableView
-            Object.values(movableViewsValue.value).forEach((callbacks) => {
-                callbacks.onScale && callbacks.onScale(scaleInfo);
-            });
-        }
-    }, [scaleArea]);
-    // 处理区域缩放结束
-    const handleAreaScaleEnd = useCallback(() => {
-        'worklet';
-        if (scaleArea) {
-            // 通知所有注册的 MovableView 缩放结束
-            Object.values(movableViewsValue.value).forEach((callbacks) => {
-                callbacks.onScaleEnd && callbacks.onScaleEnd();
-            });
-        }
-    }, [scaleArea]);
     const contextValue = useMemo(() => ({
         height: normalStyle.height || 10,
-        width: normalStyle.width || 10,
-        scaleArea,
-        registerMovableView,
-        unregisterMovableView
-    }), [normalStyle.width, normalStyle.height, scaleArea]);
-    const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: movableAreaRef });
-    // 创建缩放手势
-    const scaleGesture = useMemo(() => {
-        if (!scaleArea)
-            return null;
-        return Gesture.Pinch()
-            .onUpdate((e) => {
-            'worklet';
-            handleAreaScale(e);
-        })
-            .onEnd(() => {
-            'worklet';
-            handleAreaScaleEnd();
-        });
-    }, [scaleArea]);
+        width: normalStyle.width || 10
+    }), [normalStyle.width, normalStyle.height]);
+    const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: movableViewRef });
     const innerProps = useInnerProps(extendObject({}, props, layoutProps, {
         style: extendObject({ height: contextValue.height, width: contextValue.width }, normalStyle, layoutStyle),
-        ref: movableAreaRef
+        ref: movableViewRef
     }), [], { layoutRef });
     let movableComponent = createElement(MovableAreaContext.Provider, { value: contextValue }, createElement(View, innerProps, wrapChildren(props, {
         hasVarDec,
         varContext: varContextRef.current
     })));
-    // 如果启用了 scale-area，包装一个 GestureDetector
-    if (scaleArea && scaleGesture) {
-        movableComponent = createElement(MovableAreaContext.Provider, { value: contextValue }, createElement(GestureDetector, { gesture: scaleGesture }, createElement(View, innerProps, wrapChildren(props, {
-            hasVarDec,
-            varContext: varContextRef.current
-        }))));
-    }
     if (hasPositionFixed) {
         movableComponent = createElement(Portal, null, movableComponent);
     }

package/lib/runtime/components/react/dist/mpx-movable-view.jsx

@@ -7,13 +7,13 @@
  * ✘ damping
  * ✘ friction
  * ✔ disabled
- * ✔ scale
- * ✔ scale-min
- * ✔ scale-max
- * ✔ scale-value
+ * ✘ scale
+ * ✘ scale-min
+ * ✘ scale-max
+ * ✘ scale-value
  * ✔ animation
  * ✔ bindchange
- * ✔ bindscale
+ * ✘ bindscale
  * ✔ htouchmove
  * ✔ vtouchmove
  */
@@ -24,7 +24,7 @@ import useNodesRef from './useNodesRef';
 import { MovableAreaContext } from './context';
 import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, flatGesture, extendObject, omit, useNavigation } from './utils';
 import { GestureDetector, Gesture } from 'react-native-gesture-handler';
-import Animated, { useSharedValue, useAnimatedStyle, withDecay, runOnJS, runOnUI, withSpring, withTiming } from 'react-native-reanimated';
+import Animated, { useSharedValue, useAnimatedStyle, withDecay, runOnJS, runOnUI, withSpring } from 'react-native-reanimated';
 import { collectDataset, noop } from '@mpxjs/utils';
 const styles = StyleSheet.create({
     container: {
@@ -41,8 +41,8 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
     const hasLayoutRef = useRef(false);
     const propsRef = useRef({});
     propsRef.current = (props || {});
-    const { x = 0, y = 0, inertia = false, disabled = false, animation = true, scale = false, 'scale-min': scaleMin = 0.1, 'scale-max': scaleMax = 10, 'scale-value': scaleValue = 1, 'out-of-bounds': outOfBounds = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, direction = 'none', 'disable-event-passthrough': disableEventPassthrough = false, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, changeThrottleTime = 60, bindtouchstart, catchtouchstart, bindhtouchmove, bindvtouchmove, bindtouchmove, catchhtouchmove, catchvtouchmove, catchtouchmove, bindtouchend, catchtouchend, bindscale, bindchange, onLayout: propsOnLayout } = props;
-    const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(Object.assign({}, styles.container, style), { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
+    const { x = 0, y = 0, inertia = false, disabled = false, animation = true, 'out-of-bounds': outOfBounds = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, direction = 'none', 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, changeThrottleTime = 60, bindtouchstart, catchtouchstart, bindhtouchmove, bindvtouchmove, bindtouchmove, catchhtouchmove, catchvtouchmove, catchtouchmove, bindtouchend, catchtouchend, bindchange } = props;
+    const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(Object.assign({}, style, styles.container), { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const navigation = useNavigation();
     const prevSimultaneousHandlersRef = useRef(originSimultaneousHandlers || []);
     const prevWaitForHandlersRef = useRef(waitFor || []);
@@ -50,8 +50,6 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
     const { textStyle, innerStyle } = splitStyle(normalStyle);
     const offsetX = useSharedValue(x);
     const offsetY = useSharedValue(y);
-    const currentScale = useSharedValue(1);
-    const layoutValue = useSharedValue({});
     const startPosition = useSharedValue({
         x: 0,
         y: 0
@@ -102,38 +100,6 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
             layoutRef
         }, propsRef.current));
     }, []);
-    const handleTriggerScale = useCallback(({ x, y, scale }) => {
-        const { bindscale } = propsRef.current;
-        if (!bindscale)
-            return;
-        bindscale(getCustomEvent('scale', {}, {
-            detail: {
-                x,
-                y,
-                scale
-            },
-            layoutRef
-        }, propsRef.current));
-    }, []);
-    const checkBoundaryPosition = useCallback(({ positionX, positionY }) => {
-        'worklet';
-        let x = positionX;
-        let y = positionY;
-        // 计算边界限制
-        if (x > draggableXRange.value[1]) {
-            x = draggableXRange.value[1];
-        }
-        else if (x < draggableXRange.value[0]) {
-            x = draggableXRange.value[0];
-        }
-        if (y > draggableYRange.value[1]) {
-            y = draggableYRange.value[1];
-        }
-        else if (y < draggableYRange.value[0]) {
-            y = draggableYRange.value[0];
-        }
-        return { x, y };
-    }, []);
     // 节流版本的 change 事件触发
     const handleTriggerChangeThrottled = useCallback(({ x, y, type }) => {
         'worklet';
@@ -173,193 +139,12 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
             }
         })();
     }, [x, y]);
-    // 提取通用的缩放边界计算函数
-    const calculateScaleBoundaryPosition = useCallback(({ currentOffsetX, currentOffsetY, newScale, width, height }) => {
-        'worklet';
-        const prevScale = currentScale.value;
-        // 计算元素当前中心点（在屏幕上的位置）
-        const currentCenterX = currentOffsetX + (width * prevScale) / 2;
-        const currentCenterY = currentOffsetY + (height * prevScale) / 2;
-        // 实现中心缩放：保持元素中心点不变
-        // 计算缩放后为了保持中心点不变需要的新offset位置
-        let newOffsetX = currentCenterX - (width * newScale) / 2;
-        let newOffsetY = currentCenterY - (height * newScale) / 2;
-        // 缩放过程中实时边界检测
-        // 计算新的边界范围
-        const top = (style.position === 'absolute' && style.top) || 0;
-        const left = (style.position === 'absolute' && style.left) || 0;
-        const scaledWidth = width * newScale;
-        const scaledHeight = height * newScale;
-        // 计算新缩放值下的边界限制
-        const maxOffsetY = MovableAreaLayout.height - scaledHeight - top;
-        const maxOffsetX = MovableAreaLayout.width - scaledWidth - left;
-        let xMin, xMax, yMin, yMax;
-        if (MovableAreaLayout.width < scaledWidth) {
-            xMin = maxOffsetX;
-            xMax = -left;
-        }
-        else {
-            xMin = -left;
-            xMax = maxOffsetX < 0 ? -left : maxOffsetX;
-        }
-        if (MovableAreaLayout.height < scaledHeight) {
-            yMin = maxOffsetY;
-            yMax = -top;
-        }
-        else {
-            yMin = -top;
-            yMax = maxOffsetY < 0 ? -top : maxOffsetY;
-        }
-        // 应用边界限制
-        if (newOffsetX > xMax) {
-            newOffsetX = xMax;
-        }
-        else if (newOffsetX < xMin) {
-            newOffsetX = xMin;
-        }
-        if (newOffsetY > yMax) {
-            newOffsetY = yMax;
-        }
-        else if (newOffsetY < yMin) {
-            newOffsetY = yMin;
-        }
-        return { x: newOffsetX, y: newOffsetY };
-    }, [MovableAreaLayout.height, MovableAreaLayout.width, style.position, style.top, style.left]);
-    // 提取通用的缩放处理函数
-    const handleScaleUpdate = useCallback((scaleInfo) => {
-        'worklet';
-        if (disabled)
-            return;
-        // 判断缩放方向并计算新的缩放值
-        const isZoomingIn = scaleInfo.scale > 1;
-        const isZoomingOut = scaleInfo.scale < 1;
-        let newScale;
-        if (isZoomingIn) {
-            // 放大：增加缩放值
-            newScale = currentScale.value + (scaleInfo.scale - 1) * 0.5;
-        }
-        else if (isZoomingOut) {
-            // 缩小：减少缩放值
-            newScale = currentScale.value - (1 - scaleInfo.scale) * 0.5;
-        }
-        else {
-            // 没有缩放变化
-            newScale = currentScale.value;
-        }
-        // 限制缩放值在 scaleMin 和 scaleMax 之间
-        newScale = Math.max(scaleMin, Math.min(scaleMax, newScale));
-        // 只有当缩放值真正改变时才调整位置
-        if (Math.abs(newScale - currentScale.value) > 0.01) {
-            // 获取元素尺寸
-            const { width = 0, height = 0 } = layoutValue.value;
-            if (width > 0 && height > 0) {
-                // 使用通用的边界计算函数
-                const { x: newOffsetX, y: newOffsetY } = calculateScaleBoundaryPosition({
-                    currentOffsetX: offsetX.value,
-                    currentOffsetY: offsetY.value,
-                    newScale,
-                    width,
-                    height
-                });
-                offsetX.value = newOffsetX;
-                offsetY.value = newOffsetY;
-                // 更新缩放值
-                currentScale.value = newScale;
-            }
-        }
-        else {
-            currentScale.value = newScale;
-        }
-        if (bindscale) {
-            runOnJS(handleTriggerScale)({
-                x: offsetX.value,
-                y: offsetY.value,
-                scale: newScale
-            });
-        }
-    }, [disabled, scaleMin, scaleMax, bindscale, handleTriggerScale, calculateScaleBoundaryPosition, style.position, style.top, style.left, MovableAreaLayout.height, MovableAreaLayout.width]);
     useEffect(() => {
-        runOnUI(() => {
-            if (currentScale.value !== scaleValue) {
-                // 限制缩放值在 scaleMin 和 scaleMax 之间
-                const clampedScale = Math.max(scaleMin, Math.min(scaleMax, scaleValue));
-                // 实现中心缩放的位置补偿
-                const { width = 0, height = 0 } = layoutValue.value;
-                if (width > 0 && height > 0) {
-                    // 使用通用的边界计算函数
-                    const { x: newOffsetX, y: newOffsetY } = calculateScaleBoundaryPosition({
-                        currentOffsetX: offsetX.value,
-                        currentOffsetY: offsetY.value,
-                        newScale: clampedScale,
-                        width,
-                        height
-                    });
-                    // 同时更新缩放值和位置
-                    if (animation) {
-                        currentScale.value = withTiming(clampedScale, {
-                            duration: 1000
-                        }, () => {
-                            handleRestBoundaryAndCheck();
-                        });
-                        offsetX.value = withTiming(newOffsetX, { duration: 1000 });
-                        offsetY.value = withTiming(newOffsetY, { duration: 1000 });
-                    }
-                    else {
-                        currentScale.value = clampedScale;
-                        offsetX.value = newOffsetX;
-                        offsetY.value = newOffsetY;
-                        handleRestBoundaryAndCheck();
-                    }
-                }
-                else {
-                    // 如果还没有尺寸信息，只更新缩放值
-                    if (animation) {
-                        currentScale.value = withTiming(clampedScale, {
-                            duration: 1000
-                        }, () => {
-                            handleRestBoundaryAndCheck();
-                        });
-                    }
-                    else {
-                        currentScale.value = clampedScale;
-                        handleRestBoundaryAndCheck();
-                    }
-                }
-                if (bindscale) {
-                    runOnJS(handleTriggerScale)({
-                        x: offsetX.value,
-                        y: offsetY.value,
-                        scale: clampedScale
-                    });
-                }
-            }
-        })();
-    }, [scaleValue, scaleMin, scaleMax, animation]);
-    useEffect(() => {
-        runOnUI(handleRestBoundaryAndCheck)();
-    }, [MovableAreaLayout.height, MovableAreaLayout.width]);
-    // 生成唯一 ID
-    const viewId = useMemo(() => `movable-view-${Date.now()}-${Math.random()}`, []);
-    // 注册到 MovableArea（如果启用了 scale-area）
-    useEffect(() => {
-        if (MovableAreaLayout.scaleArea && MovableAreaLayout.registerMovableView && MovableAreaLayout.unregisterMovableView) {
-            const handleAreaScale = (scaleInfo) => {
-                'worklet';
-                handleScaleUpdate({ scale: scaleInfo.scale });
-            };
-            const handleAreaScaleEnd = () => {
-                'worklet';
-                handleRestBoundaryAndCheck();
-            };
-            MovableAreaLayout.registerMovableView?.(viewId, {
-                onScale: scale ? handleAreaScale : noop,
-                onScaleEnd: scale ? handleAreaScaleEnd : noop
-            });
-            return () => {
-                MovableAreaLayout.unregisterMovableView?.(viewId);
-            };
+        const { width, height } = layoutRef.current;
+        if (width && height) {
+            resetBoundaryAndCheck({ width, height });
         }
-    }, [MovableAreaLayout.scaleArea, viewId, scale, handleScaleUpdate]);
+    }, [MovableAreaLayout.height, MovableAreaLayout.width]);
     const getTouchSource = useCallback((offsetX, offsetY) => {
         const hasOverBoundary = offsetX < draggableXRange.value[0] || offsetX > draggableXRange.value[1] ||
             offsetY < draggableYRange.value[0] || offsetY > draggableYRange.value[1];
@@ -384,45 +169,61 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         return source;
     }, []);
     const setBoundary = useCallback(({ width, height }) => {
-        'worklet';
         const top = (style.position === 'absolute' && style.top) || 0;
         const left = (style.position === 'absolute' && style.left) || 0;
-        // 使用左上角缩放，计算offset位置的边界范围
-        const currentScaleVal = currentScale.value;
-        const scaledWidth = (width || 0) * currentScaleVal;
-        const scaledHeight = (height || 0) * currentScaleVal;
-        // offset位置的边界：左上角可以移动的范围
-        const maxOffsetY = MovableAreaLayout.height - scaledHeight - top;
-        const maxOffsetX = MovableAreaLayout.width - scaledWidth - left;
+        const scaledWidth = width || 0;
+        const scaledHeight = height || 0;
+        const maxY = MovableAreaLayout.height - scaledHeight - top;
+        const maxX = MovableAreaLayout.width - scaledWidth - left;
         let xRange;
         let yRange;
         if (MovableAreaLayout.width < scaledWidth) {
-            xRange = [maxOffsetX, -left];
+            xRange = [maxX, 0];
         }
         else {
-            xRange = [-left, maxOffsetX < 0 ? -left : maxOffsetX];
+            xRange = [left === 0 ? 0 : -left, maxX < 0 ? 0 : maxX];
         }
         if (MovableAreaLayout.height < scaledHeight) {
-            yRange = [maxOffsetY, -top];
+            yRange = [maxY, 0];
         }
         else {
-            yRange = [-top, maxOffsetY < 0 ? -top : maxOffsetY];
+            yRange = [top === 0 ? 0 : -top, maxY < 0 ? 0 : maxY];
         }
         draggableXRange.value = xRange;
         draggableYRange.value = yRange;
     }, [MovableAreaLayout.height, MovableAreaLayout.width, style.position, style.top, style.left]);
-    const resetBoundaryAndCheck = ({ width, height }) => {
+    const checkBoundaryPosition = useCallback(({ positionX, positionY }) => {
         'worklet';
-        setBoundary({ width, height });
-        const positionX = offsetX.value;
-        const positionY = offsetY.value;
-        const { x: newX, y: newY } = checkBoundaryPosition({ positionX, positionY });
-        if (positionX !== newX) {
-            offsetX.value = newX;
+        let x = positionX;
+        let y = positionY;
+        // 计算边界限制
+        if (x > draggableXRange.value[1]) {
+            x = draggableXRange.value[1];
         }
-        if (positionY !== newY) {
-            offsetY.value = newY;
+        else if (x < draggableXRange.value[0]) {
+            x = draggableXRange.value[0];
+        }
+        if (y > draggableYRange.value[1]) {
+            y = draggableYRange.value[1];
+        }
+        else if (y < draggableYRange.value[0]) {
+            y = draggableYRange.value[0];
         }
+        return { x, y };
+    }, []);
+    const resetBoundaryAndCheck = ({ width, height }) => {
+        setBoundary({ width, height });
+        runOnUI(() => {
+            const positionX = offsetX.value;
+            const positionY = offsetY.value;
+            const { x: newX, y: newY } = checkBoundaryPosition({ positionX, positionY });
+            if (positionX !== newX) {
+                offsetX.value = newX;
+            }
+            if (positionY !== newY) {
+                offsetY.value = newY;
+            }
+        })();
     };
     const onLayout = (e) => {
         hasLayoutRef.current = true;
@@ -432,20 +233,15 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
             setHeight(height || 0);
         }
         nodeRef.current?.measure((x, y, width, height) => {
-            const { y: navigationY = 0 } = navigation?.layout || {};
+            const { top: navigationY = 0 } = navigation?.layout || {};
             layoutRef.current = { x, y: y - navigationY, width, height, offsetLeft: 0, offsetTop: 0 };
-            // 同时更新 layoutValue，供缩放逻辑使用
-            runOnUI(() => {
-                layoutValue.value = { width, height };
-                resetBoundaryAndCheck({ width: width, height: height });
-            })();
+            resetBoundaryAndCheck({ width, height });
         });
-        propsOnLayout && propsOnLayout(e);
+        props.onLayout && props.onLayout(e);
     };
     const extendEvent = useCallback((e, type) => {
-        const { y: navigationY = 0 } = navigation?.layout || {};
+        const { top: navigationY = 0 } = navigation?.layout || {};
         const touchArr = [e.changedTouches, e.allTouches];
-        const currentProps = propsRef.current;
         touchArr.forEach(touches => {
             touches && touches.forEach((item) => {
                 item.pageX = item.absoluteX;
@@ -457,8 +253,8 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         Object.assign(e, {
             touches: type === 'end' ? [] : e.allTouches,
             currentTarget: {
-                id: currentProps.id || '',
-                dataset: collectDataset(currentProps),
+                id: props.id || '',
+                dataset: collectDataset(props),
                 offsetLeft: 0,
                 offsetTop: 0
             },
@@ -499,13 +295,6 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         bindtouchend && bindtouchend(e);
         catchtouchend && catchtouchend(e);
     };
-    const handleRestBoundaryAndCheck = () => {
-        'worklet';
-        const { width, height } = layoutValue.value;
-        if (width && height) {
-            resetBoundaryAndCheck({ width, height });
-        }
-    };
     const gesture = useMemo(() => {
         const handleTriggerMove = (e) => {
             'worklet';
@@ -521,8 +310,6 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
             }
         };
         const gesturePan = Gesture.Pan()
-            .minPointers(1)
-            .maxPointers(1)
             .onTouchesDown((e) => {
             'worklet';
             const changedTouches = e.changedTouches[0] || { x: 0, y: 0 };
@@ -662,13 +449,11 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
             }
         })
             .withRef(movableGestureRef);
-        if (!disableEventPassthrough) {
-            if (direction === 'horizontal') {
-                gesturePan.activeOffsetX([-5, 5]).failOffsetY([-5, 5]);
-            }
-            else if (direction === 'vertical') {
-                gesturePan.activeOffsetY([-5, 5]).failOffsetX([-5, 5]);
-            }
+        if (direction === 'horizontal') {
+            gesturePan.activeOffsetX([-5, 5]).failOffsetY([-5, 5]);
+        }
+        else if (direction === 'vertical') {
+            gesturePan.activeOffsetY([-5, 5]).failOffsetX([-5, 5]);
         }
         if (simultaneousHandlers && simultaneousHandlers.length) {
             gesturePan.simultaneousWithExternalGesture(...simultaneousHandlers);
@@ -676,43 +461,13 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         if (waitForHandlers && waitForHandlers.length) {
             gesturePan.requireExternalGestureToFail(...waitForHandlers);
         }
-        // 添加缩放手势支持
-        if (scale && !MovableAreaLayout.scaleArea) {
-            const gesturePinch = Gesture.Pinch()
-                .onUpdate((e) => {
-                'worklet';
-                handleScaleUpdate({ scale: e.scale });
-            })
-                .onEnd((e) => {
-                'worklet';
-                if (disabled)
-                    return;
-                // 确保最终缩放值在有效范围内
-                const finalScale = Math.max(scaleMin, Math.min(scaleMax, currentScale.value));
-                if (finalScale !== currentScale.value) {
-                    currentScale.value = finalScale;
-                    if (bindscale) {
-                        runOnJS(handleTriggerScale)({
-                            x: offsetX.value,
-                            y: offsetY.value,
-                            scale: finalScale
-                        });
-                    }
-                }
-                // 缩放结束后重新检查边界
-                handleRestBoundaryAndCheck();
-            });
-            // 根据手指数量自动区分手势：一指移动，两指缩放
-            return Gesture.Exclusive(gesturePan, gesturePinch);
-        }
         return gesturePan;
-    }, [disabled, direction, inertia, outOfBounds, scale, scaleMin, scaleMax, animation, gestureSwitch.current, handleScaleUpdate, MovableAreaLayout.scaleArea]);
+    }, [disabled, direction, inertia, outOfBounds, gestureSwitch.current]);
     const animatedStyles = useAnimatedStyle(() => {
         return {
             transform: [
                 { translateX: offsetX.value },
-                { translateY: offsetY.value },
-                { scale: currentScale.value }
+                { translateY: offsetY.value }
             ]
         };
     });
@@ -749,7 +504,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
     const innerProps = useInnerProps(extendObject({}, filterProps, {
         ref: nodeRef,
         onLayout: onLayout,
-        style: [{ transformOrigin: 'top left' }, innerStyle, animatedStyles, layoutStyle]
+        style: [innerStyle, animatedStyles, layoutStyle]
     }, rewriteCatchEvent()));
     return createElement(GestureDetector, { gesture: gesture }, createElement(Animated.View, innerProps, wrapChildren(props, {
         hasVarDec,