Lifecycle

Understanding a Camera Session's lifecycle, `isActive` and shutdown

The CameraSession has three lifecycle stages:

  • Idle (no connections, and not running)
  • Ready (connections configured, but not yet started)
  • Active (connections configured and started)

Switching between lifecycle stages

It is recommended to move an active Camera Session to the "Ready" state when it goes out of view, to prevent the Camera from running in the background. This will stop the Camera (see CameraSession.stop()) while keeping it configured and prepared in-memory. For example, in react-navigation you would use useIsFocused():

import { useIsFocused } from '@react-navigation/native'

function App() {
  const device = useCameraDevice('back')
  const isFocused = useIsFocused()

  return (
    <Camera
      style={StyleSheet.absoluteFill}
      isActive={isFocused}
      device={device}
    />
  )
}
import { useIsFocused } from '@react-navigation/native'

function App() {
  const device = useCameraDevice('back')
  const isFocused = useIsFocused()
  const camera = useCamera({
    isActive: isFocused,
    device: device,
  })
}
const session = ...

const focusListener = navigation.addListener('focus', async () => {
  await session.start()
})
const blurListener = navigation.addListener('blur', async () => {
  await session.stop()
})

Unmounting vs isActive={false}

When isActive is set to false, the CameraSession remains fully configured in memory, causing subsequent calls to isActive = true to be much faster.

If the <Camera /> is instead fully unmounted, the entire CameraSession will be torn down and all connections will be removed.

On this page

Switching between lifecycle stagesUnmounting vs isActive={false}