Note
Are you looking to contribute? The examples have been recorded on an Android device as I do not have an IOS device, therefore some examples may look a bit off in IOS devices, I'm not talking about the library but the appbars seen in the examples below, the way both platforms handle the status bar height is "different", so if you have an iphone and want to ensure (and probably fix) they look the same in both platforms I'd be very grateful, thank you.
| SnapbackZoom Example | ResumableZoom Example | CropZoom Managed Example |
|---|---|---|
zoom1.mp4 |
zoom2.mp4 |
zoom3.mp4 |
| ResumableZoom Gallery Example | CropZoom Skia Example | All Examples |
|---|---|---|
zoom2.mp4 |
zoom5.mp4 |
zoom6.mp4 |
This is an Expo managed application which contains five different examples that demonstrate some of the possible use cases for this library, among those examples you will find the following.
SnapbackZoom Example: A complex example using SnapbackZoom to enable zoomable in chat message previews, this example is used along with a Flatlist to demonstrate a more realistic approach.
ResumableZoom Example: A basic full screen image detail screen.
ResumableZoom Gallery Example: A complex example of ResumableZoom used to power an image gallery using its onSwipeRight, onSwipeLeft and onHorizontalBoundsExceeded properties.
CropZoom Managed Example: A basic example of CropZoom used to power an image cropping / profile picture selection screen used along with Expo image manipulator library.
CropZoom Skia Example: A complex example of CropZoom used along with React Native Skia to crop images while applying some filters (Color matrices) to them.
First you will need to clone the whole repository.
git clone https://github.com/Glazzes/react-native-zoom-toolkit.gitInstall the dependencies and then start the app.
yarn install
yarn example start --clearMIT License.