https://github.com/alantoa/react-native-lightbox

🖼️ A 60+ fps lightbox component, build upon Reanimated & GestureHandler.
https://github.com/alantoa/react-native-lightbox

Last synced: 3 days ago
JSON representation

🖼️ A 60+ fps lightbox component, build upon Reanimated & GestureHandler.

• Host: GitHub
• URL: https://github.com/alantoa/react-native-lightbox
• Owner: alantoa
• Created: 2022-05-24T08:38:44.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-02-26T11:08:29.000Z (11 months ago)
• Last Synced: 2025-01-13T12:18:23.902Z (11 days ago)
• Language: TypeScript
• Homepage:
• Size: 19.3 MB
• Stars: 152
• Watchers: 3
• Forks: 12
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

        


  
React Native Lightbox





  

 


### Todo 

- [x] tap to close

- [ ] pinch to zoom (use [Reanimated v2](https://docs.swmansion.com/react-native-reanimated/) & [react-native-gesture-handler v2](https://docs.swmansion.com/react-native-gesture-handler/))

- [ ] web support (use [photoswipe](https://github.com/dimsemenov/photoswipe) )

- [ ] photo gallery (use [react-native-pager-view](https://github.com/callstack/react-native-pager-view))

### Installation

First you have to follow installation instructions of [Reanimated v2](https://docs.swmansion.com/react-native-reanimated/) and [react-native-gesture-handler v2](https://docs.swmansion.com/react-native-gesture-handler/)

```sh

npm install @alantoa/lightbox

```

### Usage

```js

import { LightBoxProvider, LightBox } from '@alantoa/lightbox';

import { StyleSheet, Image, Dimensions } from 'react-native';

import * as React from 'react';

const { width } = Dimensions.get('window');

export default function App() {

  return (

    

      

        

      

    

  );

}

```

### Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

### License

MIT