API Reference
useViewRecorder
Hook for creating a view recorder session
Hook that creates a view recorder session. Returns a session ID to link to a RecordingView and a record function to start capturing.
Import
import { useViewRecorder } from "react-native-view-recorder";Signature
function useViewRecorder(): ViewRecorderReturns
| Property | Type | Description |
|---|---|---|
sessionId | string | Unique session ID. Pass this as the sessionId prop on <RecordingView>. |
record | (options: RecordOptions) => Promise<string> | Starts recording. Returns the output file path when complete. |
stop | () => void | Stops an in-progress recording gracefully. The record() promise resolves with the output path after the current frame finishes encoding. Works for both event-driven (no totalFrames) and fixed-length recordings. |
snapshot | (options: SnapshotOptions) => Promise<string> | Captures a single frame as an image. Returns a file path or base64 string depending on options.result. See SnapshotOptions. |
Usage
const recorder = useViewRecorder();
// Link to the view
<RecordingView sessionId={recorder.sessionId}>
<Content frame={frame} />
</RecordingView>
// Record
const outputPath = await recorder.record({
output: "/path/to/output.mp4",
fps: 30,
totalFrames: 150,
onFrame: async ({ frameIndex }) => setFrame(frameIndex),
});Snapshot
You can also capture a single frame as an image:
const uri = await recorder.snapshot({
output: "/path/to/photo.png",
format: "png", // or "jpg"
width: 640,
height: 480,
});Snapshots work independently of video recording and can even be taken while a recording is in progress.
See SnapshotOptions for all available options.
Only one recording can be in progress per session at a time. Calling record() while a recording is already active will throw an error.