Releases: likashefqet/react-native-image-zoom
Release 4.2.1
Release 4.2.0
4.2.0 (2024-09-29)
What's new
-
Enhanced Pan Gesture Handling: Improved the accuracy and responsiveness of pan gestures, ensuring smoother and more natural interactions when panning images.
-
Refined Single Tap Detection: The single tap gesture functionality has been enhanced to trigger more reliably, providing better consistency and control without interfering with other gestures.
-
Updated Example Integration:
- Added new examples demonstrating how to leverage the scale value for custom animation effects.
- Provided an example showcasing how to integrate the Image Zoom Component with react-native-reanimated-carousel, allowing for animated, zoomable image carousels.
-
TypeScript Support for Animated Props: Expanded TypeScript definitions to include support for animated props, ensuring better type safety and compatibility with Reanimated-based animations.
Release 4.1.0
4.1.0 (2024-08-25)
What's new
-
Support for Scale Animated Value: Added the ability to provide a Reanimated shared value for the scale property, allowing you to access and utilize the current zoom scale in your own code.
-
Return Last Values on Reset: Updated the
onResetAnimationEndcallback, which now returns the last zoom and position values when the component resets (zooms out), providing more control and feedback for custom logic. -
Updated Examples: Revised the existing examples to include usage of the scale animated value, ensuring that you can easily integrate this feature into your projects.
Release 4.0.0
4.0.0 (2024-08-04)
What's new
-
Zoomable Component: This component makes any child elements zoomable, ensuring they behave like the image zoom component. This is particularly useful when you need to replace the default image component with alternatives like Expo Image (see example) or Fast Image.
-
Updated Ref Handle: Customize the functionality further by utilizing the exposed
zoommethod. This method allows you to programmatically zoom in the image to a given point (x, y) at a given scale level.
Zoomable with Expo Image Example
<Zoomable
ref={ref}
minScale={0.5}
maxScale={5}
doubleTapScale={3}
minPanPointers={1}
isSingleTapEnabled
isDoubleTapEnabled
onInteractionStart={() => {
console.log('onInteractionStart');
onZoom();
}}
onInteractionEnd={() => console.log('onInteractionEnd')}
onPanStart={() => console.log('onPanStart')}
onPanEnd={() => console.log('onPanEnd')}
onPinchStart={() => console.log('onPinchStart')}
onPinchEnd={() => console.log('onPinchEnd')}
onSingleTap={() => console.log('onSingleTap')}
onDoubleTap={(zoomType) => {
console.log('onDoubleTap', zoomType);
onZoom(zoomType);
}}
onProgrammaticZoom={(zoomType) => {
console.log('onZoom', zoomType);
onZoom(zoomType);
}}
style={styles.image}
onResetAnimationEnd={(finished) => {
console.log('onResetAnimationEnd', finished);
onAnimationEnd(finished);
}}
>
<Image style={styles.image} source={{ uri }} contentFit="cover" />
</Zoomable>Release 3.0.0
3.0.0 (2024-03-24)
New Features
- Double Tap to Zoom: Enable a double tap gesture for users to seamlessly zoom in and out of images. When double tap functionality is enabled, the automatic Reset Zoom and Snap Back feature will be disabled, allowing users to maintain their desired zoom level without automatic resets. [#33] [#42]
- Single Tap Functionality: Detect and process single tap gestures to trigger specific actions or functionality as needed within the component. [#36] [#44]
- Ref Handle: Customize the functionality further by utilizing the exposed reset method. This method allows you to programmatically reset the image zoom as a side effect to another user action or event, in addition to the default double tap and pinch functionalities.
Enhancements
- Customizable Zoom Settings: Utilize doubleTapScale prop for precise control over double tap zoom level, tailoring the zoom behavior to application requirements.
- Customizable Functionality: Enable or disable features such as single tap handling (isSingleTapEnabled), and double tap zoom (isDoubleTapEnabled) based on specific application needs.
- Interactive Callbacks: The component provides interactive callbacks such as onSingleTap and onDoubleTap that allow you to handle image interactions.
For more details, refer to the commit comparison.
Note: This version includes breaking changes, so please ensure to review the updated documentation and adjust your code accordingly before upgrading.
Release 2.2.0
Release 2.1.1
Release 2.1.0
Release 2.0.0-alpha.0
2.0.0-alpha.0 (2023-04-25)
What's New
- Migrated to the new gestures API from react-native-gesture-handler.
- Added a Double Tap to zoom option that allows users to zoom in or out at a specific point with just a double tap gesture.
- Enhanced zoom behaviour by allowing developers to configure whether the component should automatically reset zoom and snap back to the initial position when the gesture ends, or keep the zoom until reset by the double tap gesture.
- Removed the loader to provide developers with more flexibility in implementing their own.
⚠️ This release is currently in alpha stage and may not be fully prepared for production use.
Your feedback is greatly appreciated as we continue to improve and refine this package.
Release 1.3.0
1.3.0 (2023-04-09)
• Fixed issues #14 and #18, which resolved the error "Cannot find module '@likashefqet/react-native-image-zoom' or its corresponding type declarations.ts".
• Refactored the code to improve its functionality.
• Improved the documentation to provide better clarity and understanding.