VisionCamera
Classes
Interfaces
- CameraDevice
- CameraDeviceFormat
- CameraProps
- Code
- CodeScanner
- CodeScannerFrame
- DeviceFilter
- ErrorWithCause
- FormatFilter
- Frame
- PhotoFile
- Point
- RecordVideoOptions
- TakePhotoOptions
- VideoFile
Type Aliases
AutoFocusSystem
Ƭ AutoFocusSystem: "contrast-detection" | "phase-detection" | "none"
Indicates a format's autofocus system.
"none": Indicates that autofocus is not available"contrast-detection": Indicates that autofocus is achieved by contrast detection. Contrast detection performs a focus scan to find the optimal position"phase-detection": Indicates that autofocus is achieved by phase detection. Phase detection has the ability to achieve focus in many cases without a focus scan. Phase detection autofocus is typically less visually intrusive than contrast detection autofocus
Defined in
CameraDevice.ts:35
CameraPermissionRequestResult
Ƭ CameraPermissionRequestResult: "granted" | "denied"
Defined in
Camera.tsx:18
CameraPermissionStatus
Ƭ CameraPermissionStatus: "granted" | "not-determined" | "denied" | "restricted"
Defined in
Camera.tsx:17
CameraPosition
Ƭ CameraPosition: "front" | "back" | "external"
Represents the camera device position.
"back": Indicates that the device is physically located on the back of the phone"front": Indicates that the device is physically located on the front of the phone"external": The camera device is an external camera, and has no fixed facing relative to the phone. (e.g. USB or Continuity Cameras)
Defined in
CameraDevice.ts:11
CaptureError
Ƭ CaptureError: "capture/recording-in-progress" | "capture/no-recording-in-progress" | "capture/file-io-error" | "capture/create-temp-file-error" | "capture/create-recorder-error" | "capture/recorder-error" | "capture/video-not-enabled" | "capture/photo-not-enabled" | "capture/aborted" | "capture/unknown"
Defined in
CameraError.ts:31
CodeScannerError
Ƭ CodeScannerError: "code-scanner/not-compatible-with-outputs" | "code-scanner/code-type-not-supported" | "code-scanner/cannot-load-model"
Defined in
CameraError.ts:27
CodeType
Ƭ CodeType: "code-128" | "code-39" | "code-93" | "codabar" | "ean-13" | "ean-8" | "itf" | "upc-e" | "qr" | "pdf-417" | "aztec" | "data-matrix"
The type of the code to scan.
Defined in
CodeScanner.ts:6
DeviceError
Ƭ DeviceError: "device/configuration-error" | "device/no-device" | "device/invalid-device" | "device/microphone-unavailable" | "device/pixel-format-not-supported" | "device/low-light-boost-not-supported" | "device/focus-not-supported" | "device/camera-not-available-on-simulator"
Defined in
CameraError.ts:7
FormatError
Ƭ FormatError: "format/invalid-fps" | "format/invalid-video-hdr" | "format/incompatible-pixel-format-with-hdr-setting" | "format/invalid-format"
Defined in
CameraError.ts:16
FrameProcessor
Ƭ FrameProcessor: Object
Type declaration
| Name | Type |
|---|---|
frameProcessor | (frame: Frame) => void |
type | "frame-processor" |
Defined in
CameraProps.ts:8
Orientation
Ƭ Orientation: "portrait" | "portrait-upside-down" | "landscape-left" | "landscape-right"
Represents Orientation. Depending on the context, this might be a sensor orientation (relative to the phone's orentation), or view orientation.
portrait: 0° (home-button at the bottom)landscape-left: 90° (home-button on the left)portrait-upside-down: 180° (home-button at the top)landscape-right: 270° (home-button on the right)
Defined in
Orientation.ts:10
ParameterError
Ƭ ParameterError: "parameter/invalid-parameter" | "parameter/unsupported-output" | "parameter/unsupported-input" | "parameter/invalid-combination"
Defined in
CameraError.ts:2
PermissionError
Ƭ PermissionError: "permission/microphone-permission-denied" | "permission/camera-permission-denied"
Defined in
CameraError.ts:1
PhysicalCameraDeviceType
Ƭ PhysicalCameraDeviceType: "ultra-wide-angle-camera" | "wide-angle-camera" | "telephoto-camera"
Indentifiers for a physical camera (one that actually exists on the back/front of the device)
"ultra-wide-angle-camera": A built-in camera with a shorter focal length than that of a wide-angle camera. (FOV of 94° or higher)"wide-angle-camera": A built-in wide-angle camera. (FOV between 60° and 94°)"telephoto-camera": A built-in camera device with a longer focal length than a wide-angle camera. (FOV of 60° or lower)
Some Camera devices consist of multiple physical devices. They can be interpreted as logical devices, for example:
"ultra-wide-angle-camera"+"wide-angle-camera"= dual wide-angle camera."wide-angle-camera"+"telephoto-camera"= dual camera."ultra-wide-angle-camera"+"wide-angle-camera"+"telephoto-camera"= triple camera.
Defined in
CameraDevice.ts:26
PixelFormat
Ƭ PixelFormat: "yuv" | "rgb" | "native" | "unknown"
Represents the pixel format of a Frame.
If you intend to read Pixels from this Frame or use an ML model for processing, make sure that you are
using the expected PixelFormat, otherwise the plugin might not be able to properly understand the Frame's content.
Most ML models operate in either yuv (recommended) or rgb.
yuv: Frame is in YUV pixel-format (Y'CbCr 4:2:0 or NV21, 8-bit)rgb: Frame is in RGB pixel-format (RGB or RGBA, 8-bit)native: Frame is in the Camera's native Hardware Buffer format (PRIVATE). This is the most efficient Format.unknown: Frame has unknown/unsupported pixel-format.
Defined in
PixelFormat.ts:14
SessionError
Ƭ SessionError: "session/camera-not-ready" | "session/camera-cannot-be-opened" | "session/camera-has-been-disconnected" | "session/audio-in-use-by-other-app" | "session/audio-session-failed-to-activate"
Defined in
CameraError.ts:21
SystemError
Ƭ SystemError: "system/camera-module-not-found" | "system/no-camera-manager" | "system/frame-processors-unavailable" | "system/view-not-found"
Defined in
CameraError.ts:42
UnknownError
Ƭ UnknownError: "unknown/unknown"
Defined in
CameraError.ts:47
VideoStabilizationMode
Ƭ VideoStabilizationMode: "off" | "standard" | "cinematic" | "cinematic-extended" | "auto"
Indicates a format's supported video stabilization mode. Enabling video stabilization may introduce additional latency into the video capture pipeline.
"off": No video stabilization. Indicates that video should not be stabilized"standard": Standard software-based video stabilization. Standard video stabilization reduces the field of view by about 10%."cinematic": Advanced software-based video stabilization. This applies more aggressive cropping or transformations than standard."cinematic-extended": Extended software- and hardware-based stabilization that aggressively crops and transforms the video to apply a smooth cinematic stabilization."auto": Indicates that the most appropriate video stabilization mode for the device and format should be chosen automatically
Defined in
CameraDevice.ts:46
Variables
Templates
• Const Templates: TTemplates
Predefined templates for use in useCameraFormat/getCameraFormat.
Example
const format = useCameraFormat(device, Templates.Snapchat)
Defined in
devices/Templates.ts:19
VisionCameraProxy
• Const VisionCameraProxy: TVisionCameraProxy
Defined in
FrameProcessorPlugins.ts:102
Functions
createFrameProcessor
▸ createFrameProcessor(frameProcessor, type): FrameProcessor
Create a new Frame Processor function which you can pass to the <Camera>.
(See "Frame Processors")
Make sure to add the 'worklet' directive to the top of the Frame Processor function, otherwise it will not get compiled into a worklet.
Also make sure to memoize the returned object, so that the Camera doesn't reset the Frame Processor Context each time.
Parameters
| Name | Type |
|---|---|
frameProcessor | (frame: Frame) => void |
type | "frame-processor" |
Returns
Defined in
hooks/useFrameProcessor.ts:13
getCameraDevice
▸ getCameraDevice(devices, position, filter?): CameraDevice | undefined
Get the best matching Camera device that best satisfies your requirements using a sorting filter, or undefined if devices does not contain any devices.
Parameters
| Name | Type | Description |
|---|---|---|
devices | CameraDevice[] | - |
position | CameraPosition | The position of the Camera device relative to the phone. |
filter | DeviceFilter | The filter you want to use. The Camera device that matches your filter the closest will be returned |
Returns
CameraDevice | undefined
The Camera device that matches your filter the closest, or undefined if no such Camera Device exists on the given position.
Example
const devices = Camera.getAvailableCameraDevices()
const device = getCameraDevice(devices, 'back', {
physicalDevices: ['wide-angle-camera']
})
Defined in
devices/getCameraDevice.ts:38
getCameraFormat
▸ getCameraFormat(device, filters): CameraDeviceFormat
Get the best matching Camera format for the given device that satisfies your requirements using a sorting filter. By default, formats are sorted by highest to lowest resolution.
The filters are ranked by priority, from highest to lowest. This means the first item you pass will have a higher priority than the second, and so on.
Parameters
| Name | Type | Description |
|---|---|---|
device | CameraDevice | The Camera Device you're currently using |
filters | FormatFilter[] | - |
Returns
The format that matches your filter the closest.
Example
const format = getCameraFormat(device, [
{ videoResolution: { width: 3048, height: 2160 } },
{ fps: 60 }
])
Defined in
devices/getCameraFormat.ts:113
isErrorWithCause
▸ isErrorWithCause(error): error is ErrorWithCause
Checks if the given error is of type ErrorWithCause
Parameters
| Name | Type | Description |
|---|---|---|
error | unknown | Any unknown object to validate |
Returns
error is ErrorWithCause
true if the given error is of type ErrorWithCause
Defined in
CameraError.ts:165
runAsync
▸ runAsync(frame, func): void
Runs the given function asynchronously, while keeping a strong reference to the Frame.
For example, if you want to run a heavy face detection algorithm
while still drawing to the screen at 60 FPS, you can use runAsync(...)
to offload the face detection algorithm to a separate thread.
Parameters
| Name | Type | Description |
|---|---|---|
frame | Frame | The current Frame of the Frame Processor. |
func | () => void | The function to execute. |
Returns
void
Example
const frameProcessor = useFrameProcessor((frame) => {
'worklet'
console.log('New Frame')
runAsync(frame, () => {
'worklet'
const faces = detectFaces(frame)
const face = [faces0]
console.log(`Detected a new face: ${face}`)
})
})
Defined in
FrameProcessorPlugins.ts:196
runAtTargetFps
▸ runAtTargetFps<T>(fps, func): T | undefined
Runs the given function at the given target FPS rate.
For example, if you want to run a heavy face detection algorithm
only once per second, you can use runAtTargetFps(1, ...) to
throttle it to 1 FPS.
Type parameters
| Name |
|---|
T |
Parameters
| Name | Type | Description |
|---|---|---|
fps | number | The target FPS rate at which the given function should be executed |
func | () => T | The function to execute. |
Returns
T | undefined
The result of the function if it was executed, or undefined otherwise.
Example
const frameProcessor = useFrameProcessor((frame) => {
'worklet'
console.log('New Frame')
runAtTargetFps(5, () => {
'worklet'
const faces = detectFaces(frame)
console.log(`Detected a new face: ${faces[0]}`)
})
})
Defined in
FrameProcessorPlugins.ts:155
tryParseNativeCameraError
▸ tryParseNativeCameraError<T>(nativeError): CameraCaptureError | CameraRuntimeError | T
Tries to parse an error coming from native to a typed JS camera error.
Type parameters
| Name |
|---|
T |
Parameters
| Name | Type | Description |
|---|---|---|
nativeError | T | The native error instance. This is a JSON in the legacy native module architecture. |
Returns
CameraCaptureError | CameraRuntimeError | T
A CameraRuntimeError or CameraCaptureError, or the nativeError itself if it's not parsable
Method
Defined in
CameraError.ts:191
useCameraDevice
▸ useCameraDevice(position, filter?): CameraDevice | undefined
Get the best matching Camera device that best satisfies your requirements using a sorting filter.
Parameters
| Name | Type | Description |
|---|---|---|
position | CameraPosition | The position of the Camera device relative to the phone. |
filter? | DeviceFilter | The filter you want to use. The Camera device that matches your filter the closest will be returned |
Returns
CameraDevice | undefined
The Camera device that matches your filter the closest, or undefined if no such Camera Device exists on the given position.
Example
const device = useCameraDevice('back', {
physicalDevices: ['wide-angle-camera']
})
Defined in
hooks/useCameraDevice.ts:18
useCameraDevices
▸ useCameraDevices(): CameraDevice[]
Get all available Camera Devices this phone has.
Camera Devices attached to this phone (back or front) are always available,
while external devices might be plugged in or out at any point,
so the result of this function might update over time.
Returns
Defined in
hooks/useCameraDevices.ts:12
useCameraFormat
▸ useCameraFormat(device, filters): CameraDeviceFormat | undefined
Get the best matching Camera format for the given device that satisfies your requirements using a sorting filter. By default, formats are sorted by highest to lowest resolution.
The filters are ranked by priority, from highest to lowest. This means the first item you pass will have a higher priority than the second, and so on.
Parameters
| Name | Type | Description |
|---|---|---|
device | undefined | CameraDevice | The Camera Device you're currently using |
filters | FormatFilter[] | - |
Returns
CameraDeviceFormat | undefined
The format that matches your filter the closest.
Example
const device = useCameraDevice(...)
const format = useCameraFormat(device, [
{ videoResolution: { width: 3048, height: 2160 } },
{ fps: 60 }
])
Defined in
hooks/useCameraFormat.ts:23
useCameraPermission
▸ useCameraPermission(): PermissionState
Returns whether the user has granted permission to use the Camera, or not.
If the user doesn't grant Camera Permission, you cannot use the <Camera>.
Returns
PermissionState
Example
const { hasPermission, requestPermission } = useCameraPermission()
if (!hasPermission) {
return <PermissionScreen onPress={requestPermission} />
} else {
return <Camera ... />
}
Defined in
hooks/useCameraPermission.ts:33
useCodeScanner
▸ useCodeScanner(codeScanner): CodeScanner
Parameters
| Name | Type |
|---|---|
codeScanner | CodeScanner |
Returns
Defined in
hooks/useCodeScanner.ts:4
useFrameProcessor
▸ useFrameProcessor(frameProcessor, dependencies): FrameProcessor
Returns a memoized Frame Processor function wich you can pass to the <Camera>.
(See "Frame Processors")
Make sure to add the 'worklet' directive to the top of the Frame Processor function, otherwise it will not get compiled into a worklet.
Parameters
| Name | Type | Description |
|---|---|---|
frameProcessor | (frame: Frame) => void | The Frame Processor |
dependencies | DependencyList | The React dependencies which will be copied into the VisionCamera JS-Runtime. |
Returns
The memoized Frame Processor.
Example
const frameProcessor = useFrameProcessor((frame) => {
'worklet'
const faces = scanFaces(frame)
console.log(`Faces: ${faces}`)
}, [])
Defined in
hooks/useFrameProcessor.ts:50
useMicrophonePermission
▸ useMicrophonePermission(): PermissionState
Returns whether the user has granted permission to use the Microphone, or not.
If the user doesn't grant Audio Permission, you can use the <Camera> but you cannot
record videos with audio (the audio={..} prop).
Returns
PermissionState
Example
const { hasPermission, requestPermission } = useMicrophonePermission()
const canRecordAudio = hasPermission
return <Camera video={true} audio={canRecordAudio} />
Defined in
hooks/useCameraPermission.ts:67