Photo Output Callbacks

The Photo Capture Pipeline (see "The Photo Output") has multiple stages for Photo capture. Each stage invokes the respective callback - see CapturePhotoCallbacks.

Capture Events

A Photo capture has 3 stages:

To receive callbacks for each stage, pass CapturePhotoCallbacks to capturePhoto(...):

const photoOutput = ...
const photo = await photoOutput.capturePhoto(
  { /* options */ },
  {
    onWillBeginCapture: () => console.log('will begin capture'),
    onWillCapturePhoto: () => console.log('about to capture'),
    onDidCapturePhoto: () => console.log('did capture'),
  }
)

A CameraPhotoOutput can be configured to deliver a preview-sized Image before the final Photo is ready, to display optimistic UIs or thumbnails - assuming the CameraDevice supports it. Preview Images are useful in long capture pipelines (e.g. 'quality' prioritization, or RAW capture) to provide a useful thumbnail upfront.

First, specify your previewImageTargetSize:

const photoOutput = usePhotoOutput({
  previewImageTargetSize: { width: 100, height: 150 }
})

Then, in capturePhoto(...), pass an onPreviewImageAvailable(...) callback:

const photoOutput = ...
const photo = await photoOutput.capturePhoto(
  { /* options */ },
  {
    onPreviewImageAvailable: (image) => {
      console.log(`Received ${image.width}x${image.height} Image thumbnail!`)
    }
  }
)

Warning

If your CameraDevice's supportsPreviewImage is false, the onPreviewImageAvailable(...) callback will never be called.

Capture Events

Preview Image

On this page