Video Processor - React Native

VideoSDK enables you to add custom effects to your video stream before it’s transmitted during video calls. A video processor changes each camera frame before it is sent.

Understanding Video Processing

Video processing refers to manipulating raw video data (frames) captured by your camera. You can create a native processor on Android and iOS to enhance video streams during rooms.

How it Works:

1. Implement the Interface: On Android, create a class that implements the VideoFrameProcessor interface from live.videosdk.rtc.android.listeners, and implement its onFrameCaptured() method. On iOS, create a class that conforms to VideoSDKVideoProcessor from VideoSDKRTC, and implement onFrameReceived(pixelBuffer:).

2. Process the Frame: These methods give you each camera frame before it is encoded: an I420 VideoFrame on Android, a CVPixelBuffer on iOS. Apply your desired effects or manipulations to it and return the processed frame.

3. Register Your Processor: Create an instance of the processor you plan to use and register it under a unique name with VideoProcessorRegistry: register() from live.videosdk.rncore on Android, VideoProcessorRegistry.shared.register(name:processor:) from VideoSDKReactNative on iOS.

4. Apply the Processor: After you join the room, apply the processor by its name with setVideoProcessor() from the useRoom hook.

5. Remove the Processor: Stop applying the processor with removeVideoProcessor() from the useRoom hook.

For the full steps, see Video Processor Android Setup and Video Processor iOS Setup.