Camera Controller

Creating a Camera Controller and using it to adjust the Camera

A CameraController controls an active CameraSession's properties, like zoom, exposure or focus.

Get a CameraController

The CameraSession's configure(...) method returns one CameraController per configured CameraSessionConnection - which, in single-camera Sessions is always one or zero.

The <Camera /> view exposes its CameraController under its CameraRef:

function App() {
  const camera = useRef<CameraRef>(null)

  return (
    <Camera
      style={StyleSheet.absoluteFill}
      isActive={true}
      device="back"
      ref={camera}
      onConfigured={() => {
        const controller = camera.current.controller
      }}
    />
  )
}

The useCamera(...) hook returns a CameraController:

function App() {
  const camera = useCamera({
    isActive: true,
    device: 'back',
  })
}

The CameraSession returns all CameraControllers in configure(...):

const device = ...
const session = ...

const controllers = await session.configure([
  {
    input: device,
    outputs: [],
    config: {}
  }
], {})

Probe for feature availability

Since Camera hardware varies between vendors, always make sure to probe for available features - for example, to use exposure bias (see "Exposure Bias") make sure the CameraDevice supports it:

const controller = ...
if (controller.device.supportsExposureBias) {
  const targetExposure = 5
  const clampedExposure = Math.min(targetExposure, controller.device.maxExposureBias)
  await controller.setExposureBias(clampedExposure)
}

Note

See CameraController for a full list of available features.

On this page

Get a CameraControllerProbe for feature availability