react-native-vision-camera/README.md at c0b80b342bdca86914411c8fc9b240da9c4be48a

feat: Use C++ OpenGL GPU VideoPipeline again (#1836 )

1. Reverts 4e96eb77e0 (PR #1789) to bring the C++ OpenGL GPU Pipeline back.
2. Fixes the "initHybrid JNI not found" error by loading the native JNI/C++ library in `VideoPipeline.kt`.

This PR has two downsides:

1. `pixelFormat="yuv"` does not work on Android. OpenGL only works in RGB
2. OpenGL rendering is fast, but it has an overhead. I think for Camera -> Video Recording we shouldn't be using an entire OpenGL rendering pipeline.

The original plan was to use something similar to how it works on iOS by just passing GPU buffers around, but the android.media APIs just aren't as advanced yet. `ImageReader`/`ImageWriter` is way too buggy and doesn't really work with `MediaRecorder`/`MediaCodec`.

This sucks, I hope in the future we can use something like `AHardwareBuffer`s.

2023-09-22 17:22:31 +02:00

3.2 KiB

Raw Blame History

Features

VisionCamera is a powerful and fast Camera component for React Native. It features:

📸 Photo and Video capture
📱 Customizable devices and multi-cameras ("fish-eye" zoom)
🎞️ Customizable resolutions and aspect-ratios (4k/8k images)
⏱️ Customizable FPS (30..240 FPS)
🧩 Frame Processors (JS worklets to run QR-Code scanning, facial recognition, AI object detection, realtime video chats, ...)
🔍 Smooth zooming (Reanimated)
⏯️ Fast pause and resume
🌓 HDR & Night modes
⚡ Custom C++/GPU accelerated video pipeline (OpenGL)

Install VisionCamera from npm:

yarn add react-native-vision-camera
cd ios && pod install

..and get started by setting up permissions!

Documentation

V3

You're looking at the V3 version of VisionCamera, which features a full rewrite on the Android codebase and a huge refactor on the iOS codebase. If you encounter issues on V3, you can also downgrade to V2, which is still partially supported.

Example

function App() {
  const devices = useCameraDevices('wide-angle-camera')
  const device = devices.back

  if (device == null) return <LoadingView />
  return (
    <Camera
      style={StyleSheet.absoluteFill}
      device={device}
      isActive={true}
    />
  )
}

See the example app

Adopting at scale

This library helped you? Consider sponsoring!

VisionCamera is provided as is, I work on it in my free time.

If you're integrating VisionCamera in a production app, consider funding this project and contact me to receive premium enterprise support, help with issues, prioritize bugfixes, request features, help at integrating VisionCamera and/or Frame Processors, and more.

Socials

🐦 Follow me on Twitter for updates
📝 Check out my blog for examples and experiments
💬 Join the Margelo Community Discord for chatting about VisionCamera
💖 Sponsor me on GitHub to support my work
🍪 Buy me a Ko-Fi to support my work

3.2 KiB Raw Blame History