react-native-lightbox-zoom v0.0.4

react-native-lightbox-zoom :bulb: :white_square_button: :telescope:

React Native lightbox with pinch to zoom, pan, caption support and swipe to dismiss

:warning: react-native-lightbox-zoom requires React Native >=0.60

Install

1. Install React and React Native (skip if you have them installed already or are using Expo).
2. Install react-native-gesture-handler using expo install react-native-gesture-handler if you're using Expo or yarn add react-native-gesture-handler.
3. Install react-native-lightbox-zoom.

Demo video

Props

Example

import { Image } from 'react-native';
import Lightbox from 'react-native-lightbox-zoom';

function LightBoxDemoApp() {
  function onLightboxShowChange(state) {
    // state is `true` or `false` relating to whether the lightbox
    // is showing or not
  }

  return (
    <Lightbox caption="Cat looking cute" onLightboxShowChange={onLightboxShowChange}>
      {/* Image is what the lightbox is designed for but you can use any component */}
      <Image
        style={[
          {
            width: 350,
            height: 245,
            alignSelf: 'center',
          },
        ]}
        source={{ uri: 'https://placekitten.com/500/350' }}
      />
    </Lightbox>
  )
}