1. React Native
  2. Props

React Native

Props

WARNING

v3.0.0 Breaking Change: The VisionSdkView component has been removed. Use VisionCamera instead. See the Release Notes for migration details.

VisionCamera Component Props

The VisionCamera component is the primary camera component for barcode scanning and OCR. It provides a streamlined API without requiring API keys or cloud configuration for basic scanning functionality.

Prop Type Default Description
ref React.Ref<VisionCameraRefProps> Imperative ref to call methods (capture, start/stop, etc.) on the camera.
scanMode 'photo' | 'barcode' | 'qrcode' | 'barcodeOrQrCode' | 'ocr' 'photo' Detection mode for the camera
autoCapture boolean false Automatically capture when detection is successful
enableFlash boolean false Enable/disable camera flash
zoomLevel number 1.0 Camera zoom level (device dependent, typically 1.0-5.0)
cameraFacing 'back' | 'front' 'back' Camera facing direction - 'back' for rear camera or 'front' for front-facing camera. iOS: Fully supported | Android: Placeholder (not yet functional)
scanArea { x: number, y: number, width: number, height: number } undefined Restrict scanning to a specific region (coordinates in dp)
detectionConfig object See below Configure object detection settings
frameSkip number undefined Process every Nth frame for performance optimization
template TemplateData | null null NEW in v3.0.0: Template for barcode pattern matching. Pass a TemplateData object to apply, or null to remove. See Template Management
onBarcodeDetected (event: { codes: Array<BarcodeResult> }) => void () => {} Fired when barcode(s) are detected
onCapture (event: { image: string, nativeImage: string, sharpnessScore?: number, barcodes?: Array<BarcodeResult> }) => void () => {} Fired when image is captured
onRecognitionUpdate (event: { text: boolean, barcode: boolean, qrcode: boolean, document: boolean }) => void () => {} Continuous updates of detected objects
onSharpnessScoreUpdate (event: { sharpnessScore: number }) => void () => {} Image sharpness score updates (0-1)
onBoundingBoxesUpdate (event: { barcodeBoundingBoxes: Array<DetectedCodeBoundingBox>, qrCodeBoundingBoxes: Array<DetectedCodeBoundingBox>, documentBoundingBox: BoundingBox }) => void () => {} Bounding boxes for detected objects
onError (event: { message: string, code?: number }) => void () => {} Error events

Detection Config Object

        detectionConfig={{
  text: true,              // Enable text detection (iOS only)
  barcode: true,           // Enable barcode detection
  document: true,          // Enable document detection (iOS only)
  sharpness: false,        // Enable live image sharpness scoring (default false, opt-in since it costs extra CPU/Neural Engine work)
  barcodeConfidence: 0.5,  // Barcode detection confidence (0-1, iOS only)
  documentConfidence: 0.5, // Document confidence (0-1, iOS only)
  documentCaptureDelay: 2.0 // Delay before auto-capture (seconds, iOS only)
}}

      
NOTE

Since v3.9.0: these flags now fully stop the underlying native detection work when disabled, instead of just hiding the results. Leaving text, document, or sharpness off when you don't need them reduces unnecessary camera-frame processing and device heat.

VisionCameraRefProps — Imperative Methods Reference

Method Parameters Return Description Example
capture() - void Capture image manually (when autoCapture is false) cameraRef.current?.capture()
start() - void Start camera (only needed if you previously stopped it) cameraRef.current?.start()
stop() - void Stop camera (e.g., when screen goes to background) cameraRef.current?.stop()
pauseDetection() - void Stop all detection work while keeping the camera preview and session running. Since v3.9.0 cameraRef.current?.pauseDetection()
resumeDetection() - void Resume detection previously stopped by pauseDetection(). Since v3.9.0 cameraRef.current?.resumeDetection()
NOTE

Camera Auto-Start: The camera starts automatically when mounted - you don't need to call start() manually in most cases.

Property Control: Flash, zoom, and camera facing are controlled via props (enableFlash, zoomLevel, cameraFacing), not ref methods. Update the prop values to change these settings dynamically.

Pausing and Resuming Detection

pauseDetection() and resumeDetection() let you temporarily stop all detection work (barcode, text, document, and sharpness) without tearing the camera down:

        // Stop detection, e.g. right after a successful capture while showing a loading state
cameraRef.current?.pauseDetection();

// Resume detection later, e.g. once the loading state is dismissed
cameraRef.current?.resumeDetection();

      

This is different from calling stop(). pauseDetection() keeps the live preview visible and the camera session active, so resuming is instant, with no camera restart flicker and no permission or session setup work needed again. Use it for short-lived UI states (a loading spinner, a result screen) where you don't want the camera analyzing frames in the background, but don't want to stop the camera entirely either.

While paused:

  • None of the detection event callbacks fire (onRecognitionUpdate, onBarcodeDetected, onBoundingBoxesUpdate, onSharpnessScoreUpdate).
  • Any bounding boxes or detection indicators currently on screen are cleared immediately.
  • Any in-progress price tag detection is cancelled rather than left to finish in the background.

Switching scanMode automatically resumes detection even if it was previously paused, since changing modes rebuilds the underlying native scanner. If your UI has its own pause toggle, resync it to "on" when the user changes scan mode, the same way the example app does.


VisionCore Methods

For camera-independent OCR prediction and logging operations, use the VisionCore module instead of the component ref methods:

  • Model Management: Use VisionCore.downloadModel(), VisionCore.loadOCRModel(), etc. — See Documentation
  • Headless OCR Prediction: Use VisionCore.predictWithModule(), VisionCore.predictShippingLabelCloud(), etc. — See Documentation
  • Data Logging: Use VisionCore.logItemLabelDataToPx(), VisionCore.logShippingLabelDataToPx()See Documentation
        import { VisionCore } from 'react-native-vision-sdk';

// Model management (on-device OCR)
const module = { type: 'shipping_label', size: 'large' };
await VisionCore.downloadModel(module, apiKey, token, progressCallback);
await VisionCore.loadOCRModel(module, apiKey, token);

// Camera-independent prediction
const result = await VisionCore.predictWithModule(module, imageUri, barcodes);

// Or cloud prediction (no model required)
const cloudResult = await VisionCore.predictShippingLabelCloud(imageUri, [], options);

// Data logging
await VisionCore.logItemLabelDataToPx(imageUri, barcodes, responseData, token, apiKey, true, metadata);