SkiaCameraRef

interface SkiaCameraRef extends Pick

A reference to a SkiaCamera.

You can obtain a SkiaCameraRef via useRef(...):

Example

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

  const onPress = async () => {
    const snapshot = await camera.current.takeSnapshot()
    console.log('Captured Skia snapshot!', snapshot.getImageInfo())
  }

  return (
    <SkiaCamera
      ref={camera}
      device="back"
      isActive={true}
      onFrame={(frame, render) => {
        'worklet'
        render(({ canvas, frameTexture }) => {
          canvas.drawImage(frameTexture, 0, 0)
        })
        frame.dispose()
      }}
    />
  )
}

Properties

canvas

canvas: CanvasRef | undefined

Get a ref to the Skia Canvas, or undefined if it has not yet been set. This value is set after the first mount, and usually won't change.

controller

controller: 
  | CameraController
  | undefined

Get the current CameraController. This property will be set after onStarted has been called, and may change over time.

Methods

convertViewPointToNormalizedPoint(...)

convertViewPointToNormalizedPoint(viewPoint: Point): Point

Converts the given viewPoint to a normalized Point with values ranging from 0...1.

focusTo(...)

focusTo(viewPoint: Point, options?: FocusOptions): Promise<void>

Focuses the Camera pipeline to the specified viewPoint relative to the Camera Skia view's coordiante system, using the specified MeteringModes.

Parameters

viewPoint

The point in the view coordinate system to focus to.

Example

// Focus center
await camera.current.focusTo({ x: width / 2, y: height / 2 })

resetFocus()

resetFocus(): Promise<void>

Cancels any current focus operations from focusTo(...), resets back all 3A focus modes to continuously auto-focus if they have been previously locked (e.g. via setFocusLocked(...) or lockCurrentFocus(), and similar), and resets the focus point of interest to be in the center.

Example

await controller.resetFocus()

Inherited from

Pick.resetFocus

takeSnapshot()

takeSnapshot(): 
  | SkImage
  | undefined

Takes a snapshot of the currently rendered content, or undefined if none are available.

Example

const snapshot = await camera.current.takeSnapshot()
console.log('Captured Skia snapshot!', snapshot.getImageInfo())

On this page