Class: Camera
A powerful <Camera>
component.​
Read the VisionCamera documentation for more information.
The <Camera>
component's most important properties are:
device
: Specifies theCameraDevice
to use. Get aCameraDevice
by using theuseCameraDevice(..)
hook, or manually by using the CameraDevices.getAvailableCameraDevices CameraDevices.getAvailableCameraDevices() function.isActive
: A boolean value that specifies whether the Camera should actively stream video frames or not. This can be compared to a Video component, whereisActive
specifies whether the video is paused or not. If you fully unmount the<Camera>
component instead of usingisActive={false}
, the Camera will take a bit longer to start again.
Example
function App() {
const device = useCameraDevice('back')
if (device == null) return <NoCameraErrorView />
return (
<Camera
style={StyleSheet.absoluteFill}
device={device}
isActive={true}
/>
)
}
Component
Hierarchy​
-
PureComponent
<CameraProps
,CameraState
>↳
Camera
Methods​
cancelRecording​
â–¸ cancelRecording(): Promise
<void
>
Cancel the current video recording. The temporary video file will be deleted,
and the startRecording
's onRecordingError
callback will be invoked with a capture/recording-canceled
error.
Returns​
Promise
<void
>
Throws
CameraCaptureError
When any kind of error occured while canceling the video recording.
Use the code
property to get the actual error
Example
await camera.current.startRecording({
onRecordingFinished: (video) => console.log(video),
onRecordingError: (error) => {
if (error.code === 'capture/recording-canceled') {
// recording was canceled.
} else {
console.error(error)
}
},
})
setTimeout(async () => {
await camera.current.cancelRecording()
}, 5000)
Defined in​
Camera.tsx:341
focus​
â–¸ focus(point
): Promise
<void
>
Focus the camera to a specific point in the coordinate system.
Parameters​
Name | Type | Description |
---|---|---|
point | Point | The point to focus to. This should be relative to the Camera view's coordinate system and is expressed in points. * (0, 0) means top left. * (CameraView.width, CameraView.height) means bottom right. Make sure the value doesn't exceed the CameraView's dimensions. |
Returns​
Promise
<void
>
Throws
CameraRuntimeError
When any kind of error occured while focussing.
Use the code
property to get the actual error
Example
await camera.current.focus({
x: tapEvent.x,
y: tapEvent.y
})
Defined in​
Camera.tsx:368
pauseRecording​
â–¸ pauseRecording(): Promise
<void
>
Pauses the current video recording.
Returns​
Promise
<void
>
Throws
CameraCaptureError
When any kind of error occured while pausing the video recording.
Use the code
property to get the actual error
Example
// Start
await camera.current.startRecording({
onRecordingFinished: (video) => console.log(video),
onRecordingError: (error) => console.error(error),
})
await timeout(1000)
// Pause
await camera.current.pauseRecording()
await timeout(500)
// Resume
await camera.current.resumeRecording()
await timeout(2000)
// Stop
await camera.current.stopRecording()
Defined in​
Camera.tsx:252
resumeRecording​
â–¸ resumeRecording(): Promise
<void
>
Resumes a currently paused video recording.
Returns​
Promise
<void
>
Throws
CameraCaptureError
When any kind of error occured while resuming the video recording.
Use the code
property to get the actual error
Example
// Start
await camera.current.startRecording({
onRecordingFinished: (video) => console.log(video),
onRecordingError: (error) => console.error(error),
})
await timeout(1000)
// Pause
await camera.current.pauseRecording()
await timeout(500)
// Resume
await camera.current.resumeRecording()
await timeout(2000)
// Stop
await camera.current.stopRecording()
Defined in​
Camera.tsx:284
startRecording​
â–¸ startRecording(options
): void
Start a new video recording.
Parameters​
Name | Type |
---|---|
options | RecordVideoOptions |
Returns​
void
Throws
CameraCaptureError
When any kind of error occured while starting the video recording.
Use the code
property to get the actual error
Example
camera.current.startRecording({
onRecordingFinished: (video) => console.log(video),
onRecordingError: (error) => console.error(error),
})
setTimeout(() => {
camera.current.stopRecording()
}, 5000)
Defined in​
Camera.tsx:188
stopRecording​
â–¸ stopRecording(): Promise
<void
>
Stop the current video recording.
Returns​
Promise
<void
>
Throws
CameraCaptureError
When any kind of error occured while stopping the video recording.
Use the code
property to get the actual error
Example
await camera.current.startRecording({
onRecordingFinished: (video) => console.log(video),
onRecordingError: (error) => console.error(error),
})
setTimeout(async () => {
await camera.current.stopRecording()
}, 5000)
Defined in​
Camera.tsx:309
takePhoto​
â–¸ takePhoto(options?
): Promise
<PhotoFile
>
Take a single photo and write it's content to a temporary file.
Parameters​
Name | Type |
---|---|
options? | TakePhotoOptions |
Returns​
Promise
<PhotoFile
>
Throws
CameraCaptureError
When any kind of error occured while capturing the photo.
Use the code
property to get the actual error
Example
const photo = await camera.current.takePhoto({
flash: 'on',
enableAutoRedEyeReduction: true
})
Defined in​
Camera.tsx:124
takeSnapshot​
â–¸ takeSnapshot(options?
): Promise
<PhotoFile
>
Captures a snapshot of the Camera view and write it's content to a temporary file.
- On iOS,
takeSnapshot
waits for a Frame from the video pipeline and therefore requiresvideo
to be enabled. - On Android,
takeSnapshot
performs a GPU view screenshot from the preview view.
Parameters​
Name | Type |
---|---|
options? | TakeSnapshotOptions |
Returns​
Promise
<PhotoFile
>
Throws
CameraCaptureError
When any kind of error occured while capturing the photo.
Use the code
property to get the actual error
Example
const snapshot = await camera.current.takeSnapshot({
quality: 100
})
Defined in​
Camera.tsx:147
addCameraDevicesChangedListener​
â–¸ addCameraDevicesChangedListener(listener
): EmitterSubscription
Adds a listener that gets called everytime the Camera Devices change, for example when an external Camera Device (USB or continuity Camera) gets plugged in or plugged out.
If you use Hooks, use the useCameraDevices()
hook instead.
Parameters​
Name | Type |
---|---|
listener | (newDevices : CameraDevice []) => void |
Returns​
EmitterSubscription
Defined in​
Camera.tsx:404
getAvailableCameraDevices​
â–¸ getAvailableCameraDevices(): CameraDevice
[]
Get a list of all available camera devices on the current phone.
If you use Hooks, use the useCameraDevices(..)
hook instead.
- For Camera Devices attached to the phone, it is safe to assume that this will never change.
- For external Camera Devices (USB cameras, Mac continuity cameras, etc.) the available Camera Devices could change over time when the external Camera device gets plugged in or plugged out, so use addCameraDevicesChangedListener(...) to listen for such changes.
Returns​
Example
const devices = Camera.getAvailableCameraDevices()
const backCameras = devices.filter((d) => d.position === "back")
const frontCameras = devices.filter((d) => d.position === "front")
Defined in​
Camera.tsx:395
getCameraPermissionStatus​
â–¸ getCameraPermissionStatus(): CameraPermissionStatus
Gets the current Camera Permission Status. Check this before mounting the Camera to ensure the user has permitted the app to use the camera.
To actually prompt the user for camera permission, use requestCameraPermission()
.
Returns​
Defined in​
Camera.tsx:413
getLocationPermissionStatus​
â–¸ getLocationPermissionStatus(): CameraPermissionStatus
Gets the current Location Permission Status.
Check this before enabling the location={...}
property to make sure the
the user has permitted the app to use the location.
To actually prompt the user for location permission, use requestLocationPermission()
.
Note: This method will throw a system/location-not-enabled
error if the Location APIs are not enabled at build-time.
See the "GPS Location Tags" documentation for more information.
Returns​
Defined in​
Camera.tsx:436
getMicrophonePermissionStatus​
â–¸ getMicrophonePermissionStatus(): CameraPermissionStatus
Gets the current Microphone-Recording Permission Status.
Check this before enabling the audio={...}
property to make sure the
user has permitted the app to use the microphone.
To actually prompt the user for microphone permission, use requestMicrophonePermission()
.
Returns​
Defined in​
Camera.tsx:423
requestCameraPermission​
â–¸ requestCameraPermission(): Promise
<CameraPermissionRequestResult
>
Shows a "request permission" alert to the user, and resolves with the new camera permission status.
If the user has previously blocked the app from using the camera, the alert will not be shown
and "denied"
will be returned.
Returns​
Promise
<CameraPermissionRequestResult
>
Throws
CameraRuntimeError
When any kind of error occured while requesting permission.
Use the code
property to get the actual error
Defined in​
Camera.tsx:448
requestLocationPermission​
â–¸ requestLocationPermission(): Promise
<CameraPermissionRequestResult
>
Shows a "request permission" alert to the user, and resolves with the new location permission status.
If the user has previously blocked the app from using the location, the alert will not be shown
and "denied"
will be returned.
Returns​
Promise
<CameraPermissionRequestResult
>
Throws
CameraRuntimeError
When any kind of error occured while requesting permission.
Use the code
property to get the actual error
Defined in​
Camera.tsx:480
requestMicrophonePermission​
â–¸ requestMicrophonePermission(): Promise
<CameraPermissionRequestResult
>
Shows a "request permission" alert to the user, and resolves with the new microphone permission status.
If the user has previously blocked the app from using the microphone, the alert will not be shown
and "denied"
will be returned.
Returns​
Promise
<CameraPermissionRequestResult
>
Throws
CameraRuntimeError
When any kind of error occured while requesting permission.
Use the code
property to get the actual error
Defined in​
Camera.tsx:464