viktor kinko

React Native library for zooming

For the Zenith-3D project we needed to display reports of wheel alignment system by Sivik diagnostics equipment with the screen zoom possibility. So I made a libraries' study and got react-native-easy-gestures.
Viktor Kinko
Android Developer
It's a new Gestures component that manage native input view params by user gestures and supports zoom, rotate and content dragging.

The main issue is that the library had to be modified to perform the task.
It considers functionality as following:

  • content rotation disabling

  • content fixing on the screen center

  • double click zoom support (the content can be dragged by frames by Gestures)

  • content swiping support (ScrollView native behaviour when its content keeps scrolling by inertia after swipe motion)

  • screen orientation changing support

After library wrapping creation I decided to move it to another module for faster future usage. And this module was improved with following functionality:

  • styles support for container content

  • minimum and maximum zoom

  • the levels quantity setting for double click zoom

  • general improvements, especially for content that is less than screen

As a result there is a usable library for zoom in react-native https://www.npmjs.com/package/react-native-border-zoom-view, posted on NPM.
Thanks for reading!