Codescanner View

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

The <CodeScanner /> is a view component that allows quickly scanning Barcodes/QR-Codes using MLKit.

[!DEPENDENCY] The <CodeScanner /> requires react-native-vision-camera-barcode-scanner to be installed.

Using the <CodeScanner />

To display the Code Scanner view, simply configure your desired BarcodeFormats, and handle scanned Barcode results:

function App() {
  return (
    <CodeScanner
      style={StyleSheet.absoluteFill}
      isActive={true}
      barcodeFormats={['all-formats']}
      onBarcodeScanned={(barcodes) => {
        console.log(`Scanned ${barcodes.length} barcodes!`)
      }}
    />
  )
}

[!TIP] See "The Barcode Scanner" for more information.