diff --git a/en/openspacelabs-react-native-zoomable-view.md b/en/openspacelabs-react-native-zoomable-view.md index 737c2e4cfc794163f41775f736b081f479ba4220..6c70bf520b17899d95b6eb3b0fba61ff3f381e9b 100644 --- a/en/openspacelabs-react-native-zoomable-view.md +++ b/en/openspacelabs-react-native-zoomable-view.md @@ -15,6 +15,12 @@ > [!TIP] [GitHub address](https://github.com/openspacelabs/react-native-zoomable-view) +| Version | Support RN version | +| ------------------------- | -------------------------- | +| 2.4.2 | 0.72/0.77 | + +For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. + ## Installation and Usage Go to the project directory and execute the following instruction: @@ -24,13 +30,13 @@ Go to the project directory and execute the following instruction: #### **npm** ```bash -npm install @openspacelabs/react-native-zoomable-view@2.1.6 +npm install @openspacelabs/react-native-zoomable-view@2.4.2 ``` #### **yarn** ```bash -yarn add @openspacelabs/react-native-zoomable-view@2.1.6 +yarn add @openspacelabs/react-native-zoomable-view@2.4.2 ``` @@ -171,13 +177,15 @@ This document is verified based on the following versions: | onPanResponderGrant | function | The gesture has started | no | All | yes | | onPanResponderEnd | function | Will be called when gesture ends (more accurately, on pan responder "release") | no | All | yes | | onPanResponderTerminate | function | Will be called when the gesture is force-interrupted by another handler | no | All | yes | -| onPanResponderTerminationRequest | function | Callback asking whether the gesture should be interrupted by another handler | no | IOS | yes | +| onPanResponderTerminationRequest | function | Callback asking whether the gesture should be interrupted by another handler | no | IOS | no | | onPanResponderMove | function | Will be called when user moves while touching | no | All | yes | | onShouldBlockNativeResponder | function | Returns whether this component should block native components from becoming the JS responder | no | All | yes | | zoomTo | function | Changes the zoom level to a specific number | no | All | yes | | zoomBy | function | Changes the zoom level relative to the current level (use positive numbers to zoom in, negative numbers to zoom out) | no | All | yes | | moveTo | function | Shifts the zoomed part to a specific point (in px relative to x: 0, y: 0) | no | All | yes | | moveBy | function | Shifts the zoomed part by a specific pixel number | no | All | yes | +| disableMomentum | boolean | Enable inertia scrolling after dragging ends | no | All | yes | + ## Known Issues diff --git a/zh-cn/openspacelabs-react-native-zoomable-view.md b/zh-cn/openspacelabs-react-native-zoomable-view.md index c1c2f26b2d3d6d05ebfaa77841611208efa4e716..5854773f719ee8b0dc12ba2f79b4c2c94e1bf69a 100644 --- a/zh-cn/openspacelabs-react-native-zoomable-view.md +++ b/zh-cn/openspacelabs-react-native-zoomable-view.md @@ -15,6 +15,12 @@ > [!TIP] [Github 地址](https://github.com/openspacelabs/react-native-zoomable-view) +| Version | Support RN version | +| ------------------------- | -------------------------- | +| 2.4.2 | 0.72/0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 + ## 安装与使用 进入到工程目录并输入以下命令： @@ -24,13 +30,13 @@ #### **npm** ```bash -npm install @openspacelabs/react-native-zoomable-view@2.1.6 +npm install @openspacelabs/react-native-zoomable-view@2.4.2 ``` #### **yarn** ```bash -yarn add @openspacelabs/react-native-zoomable-view@2.1.6 +yarn add @openspacelabs/react-native-zoomable-view@2.4.2 ``` @@ -137,47 +143,48 @@ const styles = StyleSheet.create({ | Name | Type | Description | Required | Platform | HarmonyOS Support | | -------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------- | -------- | ----------------- | -| zoomEnabled | boolean | Can be used to enable or disable the zooming dynamically | no | All | yes | -| panEnabled | boolean | Can be used to enable or disable the panning dynamically | no | All | yes | -| initialZoom | number | Initial zoom level on startup | no | All | yes | -| maxZoom | number | Maximum possible zoom level (zoom in). Can be set to`null` to allow unlimited zooming | no | All | yes | -| minZoom | number | Minimum possible zoom level (zoom out) | no | All | yes | -| disablePanOnInitialZoom | boolean | If true, panning is disabled when zoom level is equal to the initial zoom level | no | All | yes | -| doubleTapDelay | number | How much delay will still be recognized as double press (ms) | no | All | yes | -| doubleTapZoomToCenter | boolean | If true, double tapping will always zoom to center of View instead of the direction it was double tapped in | no | All | yes | -| bindToBorders | boolean | If true, it makes sure the object stays within box borders | no | All | yes | -| zoomStep | number | How much zoom should be applied on double tap | no | All | yes | -| pinchToZoomInSensitivity | number | the level of resistance (sensitivity) to zoom in (0 - 10) - higher is less sensitive | no | All | yes | -| pinchToZoomOutSensitivity | number | the level of resistance (sensitivity) to zoom out (0 - 10) - higher is less sensitive | no | All | yes | -| movementSensibility | number | how resistant should shifting the view around be? (0.5 - 5) - higher is less sensitive | no | All | yes | -| initialOffsetX | number | The horizontal offset the image should start at | no | All | yes | -| initialOffsetY | number | The vertical offset the image should start at | no | All | yes | -| contentHeight | number | Specify if you want to treat the height of the**centered** content inside the zoom subject as the zoom subject's height | no | All | yes | -| contentWidth | number | Specify if you want to treat the width of the**centered** content inside the zoom subject as the zoom subject's width | no | All | yes | -| panBoundaryPadding | number | At certain scales, the edge of the content is bounded too close to the edge of the container, making it difficult to pan to and interact with the edge of the content. To fix this, we'd wanna allow the content to pan just a little further away from the container's edge. Hence, the "pan boundary padding", measured in pixels. | no | All | yes | -| longPressDuration | number | Duration in ms until a press is considered a long press | no | All | yes | -| visualTouchFeedbackEnabled | boolean | Whether to show a touch feedback circle on touch | no | All | yes | -| onTransform | function | Will be called when the transformation configuration (zoom level and offset) changes | no | All | yes | -| onDoubleTapBefore | function | Will be called, at the start of a double tap | no | All | yes | -| onDoubleTapAfter | function | Will be called at the end of a double tap | no | All | yes | -| onShiftingBefore | function | Will be called, when user taps and moves the view, but before our view movement work kicks in (so this is the place to interrupt movement, if you need to) | no | All | yes | -| onShiftingAfter | function | Will be called, when user taps and moves the view, but after the values have changed already | no | All | yes | -| onShiftingEnd | function | Will be called, when user stops a tap and move gesture | no | All | yes | -| onZoomBefore | function | Will be called, while the user pinches the screen, but before our zoom work kicks in (so this is the place to interrupt zooming, if you need to) | no | All | yes | -| onZoomAfter | function | Will be called, while the user pinches the screen, but after the values have changed already | no | All | yes | -| onZoomEnd | function | Will be called after pinchzooming has ended | no | All | yes | -| onLongPress | function | Will be called after the user pressed on the image for a while | no | All | yes | -| onStartShouldSetPanResponder | function | Determines whether the view group responds to touch events when a finger is pressed. | no | All | yes | -| onPanResponderGrant | function | The gesture has started | no | All | yes | -| onPanResponderEnd | function | Will be called when gesture ends (more accurately, on pan responder "release") | no | All | yes | -| onPanResponderTerminate | function | Will be called when the gesture is force-interrupted by another handler | no | All | yes | -| onPanResponderTerminationRequest | function | Callback asking whether the gesture should be interrupted by another handler | no | IOS | yes | -| onPanResponderMove | function | Will be called when user moves while touching | no | All | yes | -| onShouldBlockNativeResponder | function | Returns whether this component should block native components from becoming the JS responder | no | All | yes | -| zoomTo | function | Changes the zoom level to a specific number | no | All | yes | -| zoomBy | function | Changes the zoom level relative to the current level (use positive numbers to zoom in, negative numbers to zoom out) | no | All | yes | -| moveTo | function | Shifts the zoomed part to a specific point (in px relative to x: 0, y: 0) | no | All | yes | -| moveBy | function | Shifts the zoomed part by a specific pixel number | no | All | yes | +| zoomEnabled | boolean | 可用于动态启用或禁用缩放功能 | no | All | yes | +| panEnabled | boolean | 可用于动态启用或禁用平移功能 | no | All | yes | +| initialZoom | number | 启动时的初始缩放级别 | no | All | yes | +| maxZoom | number | 最大可能的缩放级别（放大）。可以设置为null以允许无限缩放 | no | All | yes | +| minZoom | number | 最小可能的缩放级别（缩小） | no | All | yes | +| disablePanOnInitialZoom | boolean | 如果为true，则当缩放级别等于初始缩放级别时禁用平移 | no | All | yes | +| doubleTapDelay | number | 多少延迟仍会被识别为双击（毫秒 | no | All | yes | +| doubleTapZoomToCenter | boolean | 如果为true，双击将始终缩放到视图中心，而不是双击的方向 | no | All | yes | +| bindToBorders | boolean | 如果为true，则确保对象保持在框边界内 | no | All | yes | +| zoomStep | number | 双击时应应用多少缩放 | no | All | yes | +| pinchToZoomInSensitivity | number | 缩放的阻力（灵敏度）级别（0 - 10）- 数值越高越不敏感 | no | All | yes | +| pinchToZoomOutSensitivity | number | 缩小的阻力（灵敏度）级别（0 - 10）- 数值越高越不敏感 | no | All | yes | +| movementSensibility | number | 移动视图周围的阻力应该是多少？（0.5 - 5）- 数值越高越不敏感 | no | All | yes | +| initialOffsetX | number | 图像应该开始的水平偏移量 | no | All | yes | +| initialOffsetY | number | 像应该开始的垂直偏移量 | no | All | yes | +| contentHeight | number | 如果要将缩放主题内**居中**内容的高度视为缩放主题的高度，请指定 | no | All | yes | +| contentWidth | number | 如果要将缩放主题内**居中**内容的宽度视为缩放主题的宽度，请指定 | no | All | yes | +| panBoundaryPadding | number | 在某些缩放比例下，内容边缘距离容器边缘太近，导致难以平移到内容边缘并与之交互。为了解决这个问题，我们希望允许内容在距离容器边缘稍远一点的地方进行平移。因此有了"平移边界填充"，以像素为单位测量 | no | All | yes | +| longPressDuration | number | 按下多长时间（毫秒）被视为长按 | no | All | yes | +| visualTouchFeedbackEnabled | boolean | 触摸时是否显示触觉反馈圆圈 | no | All | yes | +| onTransform | function | 当变换配置（缩放级别和偏移量）发生变化时将被调用 | no | All | yes | +| onDoubleTapBefore | function | 在双击开始时将被调用 | no | All | yes | +| onDoubleTapAfter | function | 在双击结束时将被调用 | no | All | yes | +| onShiftingBefore | function | 当用户点击并移动视图时调用，但在我们的视图移动工作开始之前（所以如果您需要中断移动，这里是实现的地方） | no | All | yes | +| onShiftingAfter | function | 当用户点击并移动视图时调用，但在值已经改变之后 | no | All | yes | +| onShiftingEnd | function | 当用户停止点击和移动手势时调用 | no | All | yes | +| onZoomBefore | function | 将在用户捏合屏幕时调用，但在我们的缩放功能启动之前（如果您需要中断缩放，这里是可以实现的地方） | no | All | yes | +| onZoomAfter | function | 将在用户捏合屏幕时调用，但在值已经改变之后 | no | All | yes | +| onZoomEnd | function | 将在捏合缩放结束后调用 | no | All | yes | +| onLongPress | function | 将在用户按住图像一段时间后调用 | no | All | yes | +| onStartShouldSetPanResponder | function | 确定当手指按下时，视图组是否响应触摸事件 | no | All | yes | +| onPanResponderGrant | function | 手势已开始 | no | All | yes | +| onPanResponderEnd | function | 将在手势结束时调用（更准确地说，是在pan responder"释放"时） | no | All | yes | +| onPanResponderTerminate | function | 将在手势被另一个处理器强制中断时调用 | no | All | yes | +| onPanResponderTerminationRequest | function | 回调函数，询问手势是否应被其他处理器中断 | no | IOS | no | +| onPanResponderMove | function | 用户触摸移动时将被调用 | no | All | yes | +| onShouldBlockNativeResponder | function | 返回此组件是否应阻止原生组件成为JS响应者 | no | All | yes | +| zoomTo | function | 将缩放级别更改为特定数值 | no | All | yes | +| zoomBy | function | 相对于当前级别更改缩放级别（使用正数放大，负数缩小） | no | All | yes | +| moveTo | function | 将缩放部分移动到特定点（相对于x: 0, y: 0的像素） | no | All | yes | +| moveBy | function | 按特定像素数量移动缩放部分 | no | All | yes | +| disableMomentum | boolean | 拖动结束后是否启用惯性滑动 | no | All | yes | ## 遗留问题