Back to React Native Vision Camera

A ScannedObject

docs/content/docs/a-scannedobject.mdx

5.2.03.3 KB
Original Source

import { Tab, Tabs } from 'fumadocs-ui/components/tabs'

A ScannedObject is any kind of object (like a machine readable code or a human face) scanned by a CameraObjectOutput.

ScannedObject subclasses

ScannedObject is the base-class of all objects scanned by the CameraObjectOutput.

There are multiple subclasses of ScannedObject, such as ScannedCode (e.g. for QR codes or barcodes) or ScannedFace:

ts
const scannedObject = ...
// [!code ++]
if (isScannedCode(scannedObject)) {
  console.log(`Code: ${scannedObject.value}`)
// [!code ++]
} else if (isScannedFace(scannedObject)) {
  console.log(`Face: ${scannedObject.faceID}`)
} else {
  console.log(`Any Object: ${scannedObject.type}`)
}

Coordinate System Conversions

A ScannedObject's boundingBox describes its location in the Camera's coordinate system - which ranges from 0.0 to 1.0. Additionally, a ScannedCode exposes cornerPoints, and a ScannedFace exposes rollAngle and yawAngle, which are also relative to the Camera's coordinate system.

You can convert all ScannedObject's coordinates to a Preview View coordinate system using convertScannedObjectCoordinatesToViewCoordinates(...):

<Tabs items={["<Camera />", "<NativePreviewView />"]}> <Tab value="<Camera />">

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

  const objectOutput = useObjectOutput({
    types: ['qr'],
    onObjectsScanned(objects) {
      for (const object of objects) {
        // [!code ++:2]
        const converted = camera.current
          .convertScannedObjectCoordinatesToViewCoordinates(object)
      }
    }
  })

  return (
    <Camera
      ref={camera}
      {...props}
    />
  )
}
</Tab> <Tab value="<NativePreviewView />"> ```tsx function App() { const preview = useRef<PreviewView>(null)

const objectOutput = useObjectOutput({ types: ['qr'], onObjectsScanned(objects) { for (const object of objects) { // [!code ++:2] const converted = preview.current .convertScannedObjectCoordinatesToViewCoordinates(object) } } })

return ( <NativePreviewView hybridRef={callback((r) => { preview.current = r })} {...props} /> ) }

</Tab>
</Tabs>