2021-03-03 12:37:43 +01:00
< h1 align = "center" > Vision Camera< / h1 >
2021-02-19 16:08:26 +01:00
< div align = "center" >
2021-03-03 12:37:43 +01:00
< img src = "docs/static/img/11.png" width = "50%" >
2021-02-19 16:08:26 +01:00
< br / >
< br / >
2021-04-08 12:27:38 +02:00
< blockquote > < b > 📸 The Camera library that sees the vision.< / b > < / blockquote >
2021-04-08 13:40:28 +02:00
< pre align = "center" > npm i < a href = "https://www.npmjs.com/package/react-native-vision-camera" > react-native-vision-camera< / a > < br / > npx pod-install < / pre >
2021-06-21 22:45:13 +02:00
< a align = "center" href = 'https://ko-fi.com/F1F8CLXG' target = '_blank' >
< img height = '36' style = 'border:0px;height:36px;' src = 'https://az743702.vo.msecnd.net/cdn/kofi2.png?v=0' border = '0' alt = 'Buy Me a Coffee at ko-fi.com' / >
< / a >
< br / >
< a align = "center" href = "https://github.com/mrousavy?tab=followers" >
< img src = "https://img.shields.io/github/followers/mrousavy?label=Follow%20%40mrousavy&style=social" / >
< / a >
2021-02-25 13:41:07 +01:00
< br / >
2021-06-21 22:45:13 +02:00
< a align = "center" href = "https://twitter.com/mrousavy" >
< img src = "https://img.shields.io/twitter/follow/mrousavy?label=Follow%20%40mrousavy&style=social" / >
< / a >
2021-02-19 16:08:26 +01:00
< / div >
< br / >
< br / >
2021-02-20 16:45:10 +01:00
< div >
2021-03-03 12:37:43 +01:00
< img align = "right" width = "35%" src = "docs/static/img/example.png" >
2021-02-20 16:45:10 +01:00
< / div >
2021-02-19 16:08:26 +01:00
2021-03-03 12:37:43 +01:00
### Documentation
2021-06-21 22:42:46 +02:00
* [Guides ](https://mrousavy.github.io/react-native-vision-camera/docs/guides )
* [API ](https://mrousavy.github.io/react-native-vision-camera/docs/api )
2021-03-03 20:48:57 +01:00
* [Example ](./example/ )
2021-03-03 12:37:43 +01:00
2021-02-20 16:48:32 +01:00
### Features
2021-03-23 17:08:06 +01:00
* Photo, Video and Snapshot capture
2021-03-23 17:10:17 +01:00
* Customizable devices and multi-cameras (smoothly zoom out to "fish-eye" camera)
2021-02-20 16:51:13 +01:00
* Customizable FPS
2021-07-06 10:26:41 +02:00
* [Frame Processors ](https://mrousavy.github.io/react-native-vision-camera/docs/guides/frame-processors ) (JS worklets to run QR-Code scanning, facial recognition, AI object detection, realtime video chats, ...)
2021-03-23 17:08:06 +01:00
* Smooth zooming (Reanimated)
* Fast pause and resume
2021-02-20 16:48:32 +01:00
* HDR & Night modes
2021-02-20 16:49:13 +01:00
> See the [example](./example/) app
2021-02-20 16:45:10 +01:00
### Example
```tsx
function App() {
2021-02-22 09:43:47 +01:00
const devices = useCameraDevices('wide-angle-camera')
const device = devices.back
2021-02-20 16:45:10 +01:00
2021-03-01 12:41:59 +01:00
if (device == null) return < LoadingView / >
2021-02-20 16:45:10 +01:00
return (
< Camera
style={StyleSheet.absoluteFill}
device={device}
2021-02-23 10:56:05 +01:00
isActive={true}
2021-02-20 16:45:10 +01:00
/>
)
}
```
2021-02-24 21:56:50 +01:00
2021-09-08 16:02:42 +02:00
### Adopting at scale
2021-09-15 13:28:20 +02:00
< a href = "https://github.com/sponsors/mrousavy" >
2021-09-15 13:28:54 +02:00
< img align = "right" width = "160" alt = "This library helped you? Consider sponsoring!" src = ".github/funding-octocat.svg" >
2021-09-15 13:28:20 +02:00
< / a >
2021-09-08 16:02:42 +02:00
VisionCamera is provided _as is_ , I work on it in my free time.
2021-09-08 16:37:20 +02:00
If you're integrating VisionCamera in a production app, consider [funding this project ](https://github.com/sponsors/mrousavy ) and < a href = "mailto:me @mrousavy .com?subject=Adopting VisionCamera at scale" > contact me</ a > to receive premium enterprise support, help with issues, prioritize bugfixes, request features, help at integrating VisionCamera and/or Frame Processors, and more.
2021-09-08 16:02:42 +02:00
2021-02-24 21:56:50 +01:00
< br / >
2021-06-21 22:42:46 +02:00
#### 🚀 Get started by [setting up permissions](https://mrousavy.github.io/react-native-vision-camera/docs/guides/)!