Skip to main content

Interface: DrawableFrame

Represents a Camera Frame that can be directly drawn to using Skia.

See

Hierarchy​

  • Frame

  • SkCanvas

    ↳ DrawableFrame

Properties​

bytesPerRow​

• Readonly bytesPerRow: number

Returns the amount of bytes per row.

Inherited from​

Frame.bytesPerRow

Defined in​

types/Frame.ts:33

height​

• Readonly height: number

Returns the height of the frame, in pixels.

Inherited from​

Frame.height

Defined in​

types/Frame.ts:29

isMirrored​

• Readonly isMirrored: boolean

Returns whether the Frame is mirrored (selfie camera) or not.

Inherited from​

Frame.isMirrored

Defined in​

types/Frame.ts:41

isValid​

• Readonly isValid: boolean

Whether the underlying buffer is still valid or not. A Frame is valid as long as your Frame Processor (or a runAsync(..) operation) is still running

Inherited from​

Frame.isValid

Defined in​

types/Frame.ts:21

orientation​

• Readonly orientation: Orientation

Represents the orientation of the Frame.

Some ML Models are trained for specific orientations, so they need to be taken into consideration when running a frame processor. See also: isMirrored

Inherited from​

Frame.orientation

Defined in​

types/Frame.ts:52

pixelFormat​

• Readonly pixelFormat: PixelFormat

Represents the pixel-format of the Frame.

Inherited from​

Frame.pixelFormat

Defined in​

types/Frame.ts:56

planesCount​

• Readonly planesCount: number

Returns the number of planes this frame contains.

Inherited from​

Frame.planesCount

Defined in​

types/Frame.ts:37

timestamp​

• Readonly timestamp: number

Returns the timestamp of the Frame relative to the host sytem's clock.

Inherited from​

Frame.timestamp

Defined in​

types/Frame.ts:45

width​

• Readonly width: number

Returns the width of the frame, in pixels.

Inherited from​

Frame.width

Defined in​

types/Frame.ts:25

Methods​

render​

â–¸ render(paint?): void

Renders the Camera Frame to the Canvas.

Parameters​

NameTypeDescription
paint?SkPaintAn optional Paint object, for example for applying filters/shaders to the Camera Frame.

Returns​

void

Defined in​

skia/useSkiaFrameProcessor.ts:24

toArrayBuffer​

â–¸ toArrayBuffer(): ArrayBuffer

Get the underlying data of the Frame as a uint8 array buffer.

The format of the buffer depends on the Frame's pixelFormat. This function might fail if the pixelFormat is private.

Note that Frames are allocated on the GPU, so calling toArrayBuffer() will copy from the GPU to the CPU.

Returns​

ArrayBuffer

Example

const frameProcessor = useFrameProcessor((frame) => {
  'worklet'

  if (frame.pixelFormat === 'rgb') {
    const buffer = frame.toArrayBuffer()
    const data = new Uint8Array(buffer)
    console.log(`Pixel at 0,0: RGB(${data[0]}, ${data[1]}, ${data[2]})`)
  }
}, [])

Inherited from​

Frame.toArrayBuffer

Defined in​

types/Frame.ts:79

toString​

â–¸ toString(): string

Returns a string representation of the frame.

Returns​

string

Example

console.log(frame.toString()) // -> "3840 x 2160 Frame"

Inherited from​

Frame.toString

Defined in​

types/Frame.ts:87