Optional accessibilityProvides an array of custom actions available for accessibility.
Optional accessibilityA Boolean value indicating whether the accessibility elements contained within this accessibility element are hidden to the screen reader.
ios
Optional accessibilityAn accessibility hint helps users understand what will happen when they perform an action on the accessibility element when that result is not obvious from the accessibility label.
Optional accessibilityios
Optional accessibilityOverrides the text that's read by the screen reader when the user interacts with the element. By default, the label is constructed by traversing all the children and accumulating all the Text nodes separated by space.
Optional accessibilityIdentifies the element that labels the element it is applied to. When the assistive technology focuses on the component with this props, the text is read aloud. The value should should match the nativeID of the related element.
android
Optional accessibilityBy using the accessibilityLanguage property, the screen reader will understand which language to use while reading the element's label, value and hint. The provided string value must follow the BCP 47 specification (https://www.rfc-editor.org/info/bcp47). https://reactnative.dev/docs/accessibility#accessibilitylanguage-ios
ios
Optional accessibilityIndicates to accessibility services whether the user should be notified when this view changes. Works for Android API >= 19 only.
Optional accessibilityAccessibility Role tells a person using either VoiceOver on iOS or TalkBack on Android the type of element that is focused on.
Optional accessibilityAccessibility State tells a person using either VoiceOver on iOS or TalkBack on Android the state of the element currently focused on.
Optional accessibilityRepresents the current value of a component. It can be a textual description of a component's value, or for range-based components, such as sliders and progress bars, it contains range information (minimum, current, and maximum).
Optional accessibilityA Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver.
ios
Optional accessibleWhen true, indicates that the view is an accessibility element. By default, all the touchable elements are accessible.
Optional androidSpecifies the implementation mode for the Preview View on Android.
"surface-view": Uses a SurfaceView for rendering.
This is more efficient and supports HDR rendering, but doesn't support masks, transparency, rotations or clipping."texture-view": Uses a TextureView for rendering.
This is less efficient and doesn't support HDR rendering, but supports masks, transparency, rotations and clipping.'surface-view'
Optional aria-alias for accessibilityState
see https://reactnative.dev/docs/accessibility#accessibilitystate
Optional aria-Optional aria-Optional aria-Optional aria-A value indicating whether the accessibility elements contained within this accessibility element are hidden.
Optional aria-Alias for accessibilityLabel https://reactnative.dev/docs/view#accessibilitylabel https://github.com/facebook/react-native/issues/34424
Optional aria-Identifies the element that labels the element it is applied to. When the assistive technology focuses on the component with this props, the text is read aloud. The value should should match the nativeID of the related element.
android
Optional aria-Indicates to accessibility services whether the user should be notified when this view changes. Works for Android API >= 19 only.
Optional aria-Optional aria-Optional aria-Optional aria-Optional aria-Optional aria-Optional audioEnables audio capture for video recordings (see "Recording Videos")
Note: Requires audio permission.
Optional childrenOptional codeA CodeScanner that can detect QR-Codes or Barcodes using platform-native APIs.
See the Code Scanner documentation for more information
const codeScanner = useCodeScanner({
codeTypes: ['qr', 'ean-13'],
onCodeScanned: (codes) => {
console.log(`Scanned ${codes.length} codes!`)
}
})
return <Camera {...props} codeScanner={codeScanner} />
Optional collapsableViews that are only used to layout their children or otherwise don't draw anything may be automatically removed from the native hierarchy as an optimization. Set this property to false to disable this optimization and ensure that this View exists in the native view hierarchy.
Optional collapsableSetting to false prevents direct children of the view from being removed
from the native view hierarchy, similar to the effect of setting
collapsable={false} on each child.
The Camera Device to use.
See the Camera Devices section in the documentation for more information about Camera Devices.
const device = useCameraDevice('back')
if (device == null) return <NoCameraErrorView />
return (
<Camera
device={device}
isActive={true}
style={StyleSheet.absoluteFill}
/>
)
Optional enableEnables or disables lossy buffer compression for the video stream.
If you only use video or a frameProcessor, this
can increase the efficiency and lower memory usage of the Camera.
If buffer compression is enabled, the video pipeline will try to use a lossy-compressed pixel format instead of the normal one.
If you use a frameProcessor, you might need to change how pixels
are read inside your native frame processor function as this is different
from the usual yuv or rgb layout.
If buffer compression is not available but this property is enabled, the normal pixel formats will be used and no error will be thrown.
iOS
- true // if frameProcessor={undefined}
- false // otherwise
Optional enableEnables or disables depth data delivery for photo capture.
Make sure the given format supports depth data (see format.supportsDepthCapture).
false
Optional enableIf true, show a debug view to display the FPS of the Video Pipeline (Frame Processor).
This is useful for debugging your Frame Processor's speed.
false
Optional enableEnables location streaming to add GPS EXIF tags to captured photos and videos.
Note: Requires location permission.
Note: This property 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.
Optional enableA boolean specifying whether the photo render pipeline is prepared for portrait effects matte delivery.
When enabling this, you must also set enableDepthData to true.
iOS 12.0+
false
Optional enableEnables or disables the native pinch to zoom gesture.
If you want to implement a custom zoom gesture, see the Zooming with Reanimated documentation.
false
Optional exposureSpecifies the Exposure bias of the current camera. A lower value means darker images, a higher value means brighter images.
The Camera will still continue to auto-adjust exposure and focus, but will premultiply the exposure setting with the provided value here.
This values ranges from device.minExposure to device.maxExposure.
The value between min- and max supported exposure is considered the default, neutral value.
Optional focusableWhether this View should be focusable with a non-touch input device, eg. receive focus with a hardware keyboard.
Optional formatSelects a given format. By default, the best matching format is chosen. See CameraDeviceFormat
The format defines the possible values for properties like:
fps: format.minFps...format.maxFpsvideoHdr: format.supportsVideoHdrphotoHdr: format.supportsPhotoHdrenableDepthData: format.supportsDepthCapturevideoStabilizationMode: format.videoStabilizationModesIn other words; enableDepthData can only be set to true if format.supportsDepthCapture is true.
Optional fpsSpecify a the number of frames per second this camera should stream frames at.
fps is a single number, the Camera will be streaming at a fixed FPS value.fps is a tuple/array, the Camera will be free to choose a FPS value between minFps and maxFps,
depending on current lighting conditions. Allowing a lower minFps value can result in better photos
and videos, as the Camera can take more time to properly receive light for frames.Make sure the given format can stream at the target fps value (see format.minFps and format.maxFps).
Optional frameA worklet which will be called for every frame the Camera "sees".
See the Frame Processors documentation for more information
const frameProcessor = useFrameProcessor((frame) => {
'worklet'
const faces = scanFaces(frame)
console.log(`Faces: ${faces}`)
}, [])
return <Camera {...cameraProps} frameProcessor={frameProcessor} />
Optional hasTVPreferred(Apple TV only) May be set to true to force the Apple TV focus engine to move focus to this view.
ios
Optional hitThis defines how far a touch event can start away from the view. Typical interface guidelines recommend touch targets that are at least 30 - 40 points/density-independent pixels. If a Touchable view has a height of 20 the touchable height can be extended to 40 with hitSlop={{top: 10, bottom: 10, left: 0, right: 0}} NOTE The touch area never extends past the parent view bounds and the Z-index of sibling views always takes precedence if a touch hits two overlapping views.
Optional idUsed to reference react managed views from native code.
Optional important[Android] Controlling if a view fires accessibility events and if it is reported to accessibility services.
Whether the Camera should actively stream video frames, or not. See the documentation about the isActive prop for more information.
This can be compared to a Video component, where isActive specifies whether the video is paused or not.
If you fully unmount the <Camera> component instead of using isActive={false}, the Camera will take a bit longer to start again. In return, it will use less resources since the Camera will be completely destroyed when unmounted.
Optional isEnables or disables mirroring of outputs alongside the vertical axis.
Mirroring only affects the photo-, video-, or snapshot-output, but not preview. The Preview is always mirrored for front cameras, and not mirrored for back cameras.
false (back camera), true (front camera)
Optional isTVSelectable(Apple TV only) When set to true, this view will be focusable and navigable using the Apple TV remote.
ios
Optional lowEnables or disables low-light boost on this camera device.
Enabling low light boost allows the FPS rate to be throttled to up to half of what it is set to to allow for more exposure in low light conditions.
On Android, lowLightBoost might even use a vendor-specific "night-mode" extension to allow for even more visibility in low-light conditions.
Make sure the given device supports low-light-boost (see device.supportsLowLightBoost).
Optional nativeIDUsed to reference react managed views from native code.
Optional needsWhether this view needs to rendered offscreen and composited with an alpha in order to preserve 100% correct colors and blending behavior. The default (false) falls back to drawing the component and its children with an alpha applied to the paint used to draw each element instead of rendering the full component offscreen and compositing it back with an alpha value. This default may be noticeable and undesired in the case where the View you are setting an opacity on has multiple overlapping elements (e.g. multiple overlapping Views, or text and a background).
Rendering offscreen to preserve correct alpha behavior is extremely expensive and hard to debug for non-native developers, which is why it is not turned on by default. If you do need to enable this property for an animation, consider combining it with renderToHardwareTextureAndroid if the view contents are static (i.e. it doesn't need to be redrawn each frame). If that property is enabled, this View will be rendered off-screen once, saved in a hardware texture, and then composited onto the screen with an alpha each frame without having to switch rendering targets on the GPU.
Optional onWhen accessible is true, the system will try to invoke this function when the user performs an accessibility custom action.
Optional onWhen accessible is true, the system will invoke this function when the user performs the escape gesture (scrub with two fingers).
ios
Optional onWhen accessible is true, the system will try to invoke this function when the user performs accessibility tap gesture.
ios
Optional onCalled when any kind of runtime error occured.
Optional onCalled when the camera session was successfully initialized and is ready for capture.
At this point, the Camera ref can be used and methods like takePhoto(..) can be called.
This is called everytime the device or one of the outputs changes.
Optional onInvoked on mount and layout changes with
{nativeEvent: { layout: {x, y, width, height}}}.
Optional onWhen accessible is true, the system will invoke this function when the user performs the magic tap gesture.
ios
Optional onCalled for every touch move on the View when it is not the responder: does this view want to "claim" touch responsiveness?
Optional ononStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, where the deepest node is called first. That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. This is desirable in most cases, because it makes sure all controls and buttons are usable.
However, sometimes a parent will want to make sure that it becomes responder. This can be handled by using the capture phase. Before the responder system bubbles up from the deepest component, it will do a capture phase, firing on*ShouldSetResponderCapture. So if a parent View wants to prevent the child from becoming responder on a touch start, it should have a onStartShouldSetResponderCapture handler which returns true.
Optional onCalled whenever the output orientation changed. This might happen even if the screen/interface rotation is locked.
See "Orientation"
Optional onOptional onOptional onOptional onOptional onOptional onOptional onOptional onOptional onOptional onOptional onOptional onOptional onCalled whenever the preview orientation changed. This will happen whenever the screen/interface rotates.
See "Orientation"
Optional onCalled when the Preview View has received it's first frame and is now started.
This will only be called if preview is true, and no Skia Frame Processor is used
Optional onCalled when the Preview View has stoppped streaming frames and is now stopped.
This will only be called if preview is true, and no Skia Frame Processor is used
Optional onIf the View returns true and attempts to become the responder, one of the following will happen:
Optional onThe View is now responding for touch events. This is the time to highlight and show the user what is happening
Optional onThe user is moving their finger
Optional onSomething else is the responder right now and will not release it
Optional onFired at the end of the touch, ie "touchUp"
Optional onOptional onThe responder has been taken from the View. Might be taken by other views after a call to onResponderTerminationRequest, or might be taken by the OS without asking (happens with control center/ notification center on iOS)
Optional onSomething else wants to become responder. Should this view release the responder? Returning true allows release
Optional onCalled just before a photo or snapshot is captured.
Inside this callback you can play a custom shutter sound or show visual feedback to the user.
Optional onDoes this view want to become responder on the start of a touch?
Optional ononStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, where the deepest node is called first. That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. This is desirable in most cases, because it makes sure all controls and buttons are usable.
However, sometimes a parent will want to make sure that it becomes responder. This can be handled by using the capture phase. Before the responder system bubbles up from the deepest component, it will do a capture phase, firing on*ShouldSetResponderCapture. So if a parent View wants to prevent the child from becoming responder on a touch start, it should have a onStartShouldSetResponderCapture handler which returns true.
Optional onCalled when the camera started the session. (isActive={true})
At this point, outputs can start receiving frames from the Camera, but might not have received any yet.
Optional onCalled when the camera stopped the session. (isActive={false})
At this point, outputs will stop receiving frames from the Camera.
Optional onOptional onOptional onOptional onOptional onOptional onUIRotationCalled whenever the target UI rotation/orientation changes.
The degrees that UI elements need to be rotated by to appear up-right.
Optional outputSets the orientation of all Camera Outputs (Photo, Snapshot and Video).
'preview': Use the same orientation as the preview view. If the device rotation is locked, the user cannot take photos or videos in different orientations.'device': Use whatever orientation the device is held in, even if the preview view is not rotated to that orientation. If the device rotation is locked, the user can still rotate his phone to take photos or videos in different orientations than the preview view.Preview orientation will not be affected by this property, as it is always dependant on screen orientation
Frame Processors will not be affected by this property, as their buffer size (respective to Frame.orientation) is always the same
See the Orientation documentation for more information
'device'
Optional photoEnables photo capture with the takePhoto function (see "Taking Photos")
Optional photoEnables or disables HDR Photo Capture via a double capture routine that combines low- and high exposure photos.
On Android, photoHdr uses a vendor-specific "HDR" extension which is not compatible with videoHdr,
so only one of video- or photo-HDR can be enabled at a time.
Make sure the given format supports HDR (see format.supportsPhotoHdr).
Optional photoConfigures the photo pipeline for a specific quality balance prioritization.
'speed': Prioritizes fast capture speed over quality (faster edge-detection, distortion correction, AF/AE/AWB times, etc.)'balanced': A balanced set of prioritization configurations'quality': Prioritizes high quality capture over speed (higher accuracy edge-detection, distortion correction, AF/AE/AWB times, etc.)'balanced'
Optional pixelSpecifies the pixel format of Frames streamed from a Frame Processor.
While 'yuv' is the most efficient format, some ML models (such as TensorFlow Face Detection Models) require input Frames to be in RGB colorspace, otherwise they just output nonsense.
The following values are supported:
yuv: The YUV (Y'CbCr 4:2:0 or NV21, 8-bit) format, either video- or full-range, depending on hardware capabilities. This is the most efficient format.rgb: The RGB (RGBA or BGRA, 8-bit) format. This is less efficient format and sometimes requires explicit conversion.'yuv'
Optional pointerIn the absence of auto property, none is much like CSS's none value. box-none is as if you had applied the CSS class:
.box-none { pointer-events: none; } .box-none * { pointer-events: all; }
box-only is the equivalent of
.box-only { pointer-events: all; } .box-only * { pointer-events: none; }
But since pointerEvents does not affect layout/appearance, and we are already deviating from the spec by adding additional modes, we opt to not include pointerEvents on style. On some platforms, we would need to implement it as a className anyways. Using style or not is an implementation detail of the platform.
Optional previewEnables preview streaming.
Preview is enabled by default, and disabled when using a Skia Frame Processor as Skia will use the video stream as it's preview.
true
Optional removeThis is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. The subviews must also have overflow: hidden, as should the containing view (or one of its superviews).
Optional renderWhether this view should render itself (and all of its children) into a single hardware texture on the GPU.
On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation.
Optional resizeSpecifies the Preview's resize mode.
"cover": Keep aspect ratio and fill entire parent view (centered)."contain": Keep aspect ratio and make sure the entire content is visible inside the parent view, even if it introduces additional blank areas (centered)."cover"
Optional roleIndicates to accessibility services to treat UI component like a specific role.
Optional shouldWhether this view should be rendered as a bitmap before compositing.
On iOS, this is useful for animations and interactions that do not modify this component's dimensions nor its children; for example, when translating the position of a static view, rasterization allows the renderer to reuse a cached bitmap of a static view and quickly composite it during each frame.
Rasterization incurs an off-screen drawing pass and the bitmap consumes memory. Test and measure when using this property.
Optional styleOptional tabIndicates whether this View should be focusable with a non-touch input device, eg. receive focus with a hardware keyboard.
See https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
for more details.
Supports the following values:
Optional testIDUsed to locate this view in end-to-end tests.
Optional torchSet the current torch mode.
Make sure the given device has a torch (see device.hasTorch).
"off"
Optional tv(Apple TV only) May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 1.0.
ios
Optional tv(Apple TV only) May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 2.0.
ios
Optional tv(Apple TV only) May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 2.0.
ios
Optional tv(Apple TV only) May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 0.05.
ios
Optional videoEnables video capture with the startRecording function (see "Recording Videos")
Optional videoEnables or disables HDR Video Streaming for Preview, Video and Frame Processor via a 10-bit wide-color pixel format.
Make sure the given format supports HDR (see format.supportsVideoHdr).
Optional videoSpecifies the video stabilization mode to use.
Make sure the given format supports the given videoStabilizationMode.
Optional zoomSpecifies the zoom factor of the current camera, in "factor"/scale.
This value ranges from minZoom (e.g. 1) to maxZoom (e.g. 128). It is recommended to set this value
to the CameraDevice's neutralZoom per default and let the user zoom out to the fish-eye (ultra-wide) camera
on demand (if available)
Note: Linearly increasing this value always appears logarithmic to the user.
1.0
See
https://reactnative.dev/docs/view#props