More Premium Hugo Themes Premium React Themes

React Native Image Zoom

react native image pan and zoom

React Native Image Zoom

react native image pan and zoom

Author Avatar Theme by ascoders
Github Stars Github Stars: 640
Last Commit Last Commit: May 19, 2020 -
First Commit Created: Feb 24, 2024 -
React Native Image Zoom screenshot

Overview

The document provides detailed information about installing and using the react-native-thumbnail image zoom library. It lists the required props, types, and descriptions for basic usage. Additionally, it includes methods available for resetting the image position and scale.

Features

  • Crop Width & Height: Set the operating area dimensions.
  • Click Events: Handle onClick and onDoubleClick events.
  • Gesture Controls: Enable panToMove, pinchToZoom, and swipeDown functionality.
  • Image Configuration: Define image dimensions and scaling options.
  • Event Listeners: Trigger functions on longPress or movement events.
  • Animation Settings: Customize animation behavior and thresholds.
  • Hardware Compatibility: Control hardware rendering and native driver usage.

Installation

To install the react-native-thumbnail image zoom library, follow these steps:

  1. Install create-react-native-app.
  2. Initialize a react-native project.
  3. Edit AwesomeProject/App.js and configure the props as required.

Summary

The react-native-thumbnail image zoom library offers a range of features for handling image zoom and pan functionalities within a react-native project. By specifying props like crop width & height, click events, gesture controls, and animation settings, users can customize the behavior of zooming and panning on images. Additionally, the library provides useful methods like resetting image position and scale. Overall, this library enhances the interactive image viewing experience in react-native applications.