Lifecycle
The isActive prop​
The Camera's isActive property can be used to pause the session (isActive={false}) while still keeping the session "warm". This is more desirable than completely unmounting the camera, since resuming the session (isActive={true}) will be much faster than re-mounting the camera view.
For example, you want to pause the camera when the user navigates to another page or minimizes the app since otherwise the camera continues to run in the background without the user seeing it, causing significant battery drain. Also, on iOS a green dot indicates the user that the camera is still active, possibly causing the user to raise privacy concerns. (🔗 See "About the orange and green indicators in your iPhone status bar")
This example demonstrates how you could pause the camera stream once the app goes into background using a custom useIsAppForeground hook:
function App() {
const devices = useCameraDevices()
const device = devices.back
const isAppForeground = useIsAppForeground()
if (device == null) return <LoadingView />
return (
<Camera
style={StyleSheet.absoluteFill}
device={device}
isActive={isAppForeground}
/>
)
}
Usage with react-navigation​
To automatically pause the Camera when the user navigates to a different page, use the useIsFocused function:
function App() {
// ...
const isFocused = useIsFocused()
return <Camera {...props} isActive={isFocused} />
}