Capacitor ML Kit Barcode & Text Scanner

Capacitor plugin for ML Kit Barcode Scanning that can also read text in the same live camera session, using ML Kit Text Recognition.[^1][^2]

[!NOTE] This plugin is a fork of @capacitor-mlkit/barcode-scanning by Capawesome (Robin Genz), licensed under Apache 2.0. All barcode scanning features, the API and most of this documentation come from there, so thanks to Capawesome for the great work. Have a look at their other Capacitor plugins too.

The fork adds optional live text recognition, built for reading best-before dates while scanning a product barcode in Pantrist. If you only need barcodes, use the original plugin.

What this fork adds

• textRecognition option for startScan(...): runs ML Kit text recognition (Latin script) on the same camera frames as the barcode scanner, without a second camera session.
• textScanned event with the recognized text blocks and lines. Every block and line has corner points in the same screen coordinate space as Barcode.cornerPoints, so text can be outlined on top of the preview exactly like barcodes.
• textRecognitionInterval option: text recognition is much slower than barcode scanning, so it runs at most once per interval (default 250 ms) instead of on every frame.
• setTextRecognitionEnabled(...) turns text recognition on and off during a running scan, without restarting the camera. Turn it off as soon as you have what you need.
• isTextRecognitionAvailable() tells whether the platform supports it.

The plugin does not interpret the text. Finding a date, a price or anything else in it is up to the app.

Text recognition is available on Android and iOS. On the web the plugin scans barcodes only.

The fork keeps the native plugin name BarcodeScanner and the original class names, so the JavaScript API is a drop-in replacement: switching only means replacing the package and the import. For the same reason, the original plugin and this fork cannot be installed side by side.

Features

• 🧩 Optional ready-to-use interface without webview customizations
• 🏎️ Extremely fast
• 📷 Scan multiple barcodes at once
• ⏺️ Define detection area
• 🏞️ Reading barcodes from images
• 🔦 Torch and Autofocus support
• 🔤 Live text recognition in the same camera session (Android and iOS)
• 🔋 Supports Android, iOS and web

For a complete list of supported barcodes, see BarcodeFormat.

Use Cases

The Barcode Scanning plugin is typically used whenever an app needs to read a barcode or QR code with the camera, for example:

• QR code scanning: Read QR codes containing URLs, Wi-Fi credentials, contact details, or calendar events.
• Product lookup and inventory: Scan EAN and UPC product barcodes in retail, warehouse, or inventory apps.
• Ticket and access validation: Check in visitors by scanning tickets or badges encoded as Aztec, PDF417, or Data Matrix codes.
• Identity capture: Read driver licenses and ID cards that encode their data in a barcode.
• Importing barcodes from images: Read barcodes from existing photos, for example a screenshot of a QR code.

Compatibility

| Plugin Version | Capacitor Version | Status | | -------------- | ----------------- | -------------- | | 8.x.x | >=8.x.x | Active support |

Version 8.3.0 is the first release of this fork. It is based on @capacitor-mlkit/barcode-scanning 8.2.1.

Guides

The guides for the original plugin apply to the barcode part of this one as well:

• Announcing the Capacitor ML Kit Barcode Scanning Plugin
• How to build an Ionic Barcode Scanner with Capacitor

Installation

npm install @pantrist/capacitor-mlkit-barcode-text-scanner
npx cap sync

Attention: This plugin only supports CocoaPods for iOS dependency management. Swift Package Manager (SPM) is not supported for the ML Kit SDK, see this comment. If you need SPM support and no text recognition, take a look at Capawesome's Barcode Scanner plugin, which uses AVFoundation and Vision instead of ML Kit on iOS.

Android

Permissions

This API requires the following permissions be added to your AndroidManifest.xml before the application tag:

<uses-permission android:name="android.permission.CAMERA" />

You also need to add the following meta data in the application tag in your AndroidManifest.xml:

<meta-data android:name="com.google.mlkit.vision.DEPENDENCIES" android:value="barcode_ui,ocr"/>
<!-- To use multiple models: android:value="face,model2,model3" -->

barcode_ui is the model of the ready-to-use interface (scan(...)), ocr the one of text recognition. On Android, text recognition uses the model of Google Play Services. Listing ocr here makes Play Services download it when the app is installed. Without it, the model is downloaded on first use, and until it is there (or while the device is offline) text recognition reports nothing. Barcode scanning is not affected either way.

Variables

If needed, you can define the following project variable in your app’s variables.gradle file to change the default version of the dependency:

• $androidxCameraCamera2Version version of androidx.camera:camera-camera2 (default: 1.5.2)
• $androidxCameraCoreVersion version of androidx.camera:camera-core (default: 1.5.2)
• $androidxCameraLifecycleVersion version of androidx.camera:camera-lifecycle (default: 1.5.2)
• $androidxCameraViewVersion version of androidx.camera:camera-view (default: 1.5.2)
• $listenableFutureVersion version of com.google.guava:listenablefuture (default: 1.0)
• $mlkitBarcodeScanningVersion version of com.google.mlkit:barcode-scanning (default: 17.3.0)
• $playServicesCodeScannerVersion version of com.google.android.gms:play-services-code-scanner (default: 16.1.0)
• $mlkitTextRecognitionVersion version of com.google.android.gms:play-services-mlkit-text-recognition (default: 19.0.1)

This can be useful if you encounter dependency conflicts with other plugins in your project.

iOS

Minimum Deployment Target

Make sure to set the deployment target in your ios/App/Podfile to at least 15.5:

platform :ios, '15.5'

Text recognition

Text recognition adds the GoogleMLKit/TextRecognition pod, which makes the app bundle larger. It is bundled with the app, so it works offline from the first scan.

Usage Description

Add the NSCameraUsageDescription key to the ios/App/App/Info.plist file, which tells the user why the app needs to use the camera:

+ <key>NSCameraUsageDescription</key>
+ <string>The app enables the scanning of various barcodes.</string>

Web

Polyfill

This plugin uses the Barcode Detection API to scan barcodes in the browser. This API is not yet supported in all browsers. You can check the compatibility here. For this reason, we recommend installing the barcode-detector package for a better compatibility:

npm install barcode-detector

This package provides a polyfill that uses ZXing-C++ WebAssembly under the hood. After installing the package, you just need to import the polyfill in your code:

import "barcode-detector/polyfill";

Configuration

No configuration required for this plugin.

Usage

The following examples show how to scan barcodes with your own UI or the ready-to-use interface, control the torch and zoom, install the Google Barcode Scanner module, and manage camera permissions.

Scan barcodes with your own UI

The startScan(...) method renders the camera behind the WebView so that you can build your own scanning UI on top of it. Add a listener to be notified about scanned barcodes and call stopScan() when you are done:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const startScan = async () => {
  // The camera is visible behind the WebView, so that you can customize the UI in the WebView.
  // However, this means that you have to hide all elements that should not be visible.
  // You can find an example in the demo repository of the original plugin (robingenz/capacitor-mlkit-plugin-demo).
  // In this case we set a class `barcode-scanner-active`, which then contains certain CSS rules for our app.
  document.querySelector('body')?.classList.add('barcode-scanner-active');

  // Add the `barcodeScanned` listener
  const listener = await BarcodeScanner.addListener(
    'barcodeScanned',
    async result => {
      console.log(result.barcode);
    },
  );

  // Start the barcode scanner
  await BarcodeScanner.startScan();
};

const stopScan = async () => {
  // Make all elements in the WebView visible again
  document.querySelector('body')?.classList.remove('barcode-scanner-active');

  // Remove all listeners
  await BarcodeScanner.removeAllListeners();

  // Stop the barcode scanner
  await BarcodeScanner.stopScan();
};

Read text while scanning

Pass textRecognition: true to startScan(...) and listen for textScanned. Every event holds the text of one camera frame, split into blocks and lines with their corner points:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const startScan = async () => {
  document.querySelector('body')?.classList.add('barcode-scanner-active');

  await BarcodeScanner.addListener('barcodesScanned', ({ barcodes }) => {
    console.log('Barcodes', barcodes);
  });
  await BarcodeScanner.addListener('textScanned', ({ blocks }) => {
    for (const line of blocks.flatMap(block => block.lines)) {
      // `cornerPoints` share the coordinate space of `Barcode.cornerPoints`.
      console.log(line.text, line.cornerPoints);
    }
  });

  await BarcodeScanner.startScan({
    textRecognition: true,
    // Text recognition is expensive, run it at most every 250 ms.
    textRecognitionInterval: 250,
  });
};

// Stop reading text once you have what you need, the barcode scanner keeps running.
const stopReadingText = async () => {
  await BarcodeScanner.setTextRecognitionEnabled({ enabled: false });
};

OCR results are noisy: the same text can come out slightly different from one frame to the next. Accept a result only after it was read the same way in a few frames, the way the barcode scanner itself waits for several matching frames before it reports a barcode.

textScanned is only emitted for frames that contain text. Check isTextRecognitionAvailable() before you rely on it, it returns false on the web.

Scan a single barcode

If you only need one result, remove the listener and stop the scan as soon as the first barcode is scanned:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const scanSingleBarcode = async () => {
  return new Promise(async resolve => {
    document.querySelector('body')?.classList.add('barcode-scanner-active');

    const listener = await BarcodeScanner.addListener(
      'barcodeScanned',
      async result => {
        await listener.remove();
        document
          .querySelector('body')
          ?.classList.remove('barcode-scanner-active');
        await BarcodeScanner.stopScan();
        resolve(result.barcode);
      },
    );

    await BarcodeScanner.startScan();
  });
};

Scan with the ready-to-use interface

The scan(...) method opens a ready-to-use scanning interface without any WebView customization. Only available on Android and iOS. On Android, this requires the Google Barcode Scanner module (see below), but no camera permission:

import { BarcodeScanner, BarcodeFormat } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const scan = async () => {
  const { barcodes } = await BarcodeScanner.scan({
    formats: [BarcodeFormat.QrCode],
    autoZoom: true,
  });
  return barcodes;
};

On Android, the system may destroy the app while the scanner is open. In this case, the promise will never resolve. Instead, the result is delivered through the appRestoredResult event of the App plugin when the app is restored. If the app process was terminated, the scan result cannot be recovered and the event contains an error:

import { App } from '@capacitor/app';

App.addListener('appRestoredResult', event => {
  if (event.pluginId !== 'BarcodeScanner' || event.methodName !== 'scan') {
    return;
  }
  if (event.success) {
    const barcodes = event.data.barcodes;
  } else {
    console.error(event.error?.message);
  }
});

Check if the barcode scanner is supported

Check whether the device has a camera that can be used for barcode scanning:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const isSupported = async () => {
  const { supported } = await BarcodeScanner.isSupported();
  return supported;
};

Control the torch

Use the Capacitor Torch plugin to switch the flashlight on and off during a scan session:

import { Torch } from '@capawesome/capacitor-torch';

const enableTorch = async () => {
  await Torch.enable();
};

const disableTorch = async () => {
  await Torch.disable();
};

const toggleTorch = async () => {
  await Torch.toggle();
};

const isTorchEnabled = async () => {
  const { enabled } = await Torch.isEnabled();
  return enabled;
};

const isTorchAvailable = async () => {
  const { available } = await Torch.isAvailable();
  return available;
};

Control the zoom

Set and read the zoom ratio of the camera. These methods are only available on Android and iOS:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const setZoomRatio = async () => {
  await BarcodeScanner.setZoomRatio({ zoomRatio: 0.5 });
};

const getZoomRatio = async () => {
  const { zoomRatio } = await BarcodeScanner.getZoomRatio();
  return zoomRatio;
};

const getMinZoomRatio = async () => {
  const { zoomRatio } = await BarcodeScanner.getMinZoomRatio();
  return zoomRatio;
};

const getMaxZoomRatio = async () => {
  const { zoomRatio } = await BarcodeScanner.getMaxZoomRatio();
  return zoomRatio;
};

Install the Google Barcode Scanner module

On Android, the scan(...) method requires the Google Barcode Scanner module. Check if it is available and install it if needed. The installation only starts with this call; the googleBarcodeScannerModuleInstallProgress event notifies you about the progress. Only available on Android:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const isGoogleBarcodeScannerModuleAvailable = async () => {
  const { available } =
    await BarcodeScanner.isGoogleBarcodeScannerModuleAvailable();
  return available;
};

const installGoogleBarcodeScannerModule = async () => {
  await BarcodeScanner.installGoogleBarcodeScannerModule();
};

Check and request permissions

The startScan(...) method requires the camera permission. You can check and request it, and open the app settings so that the user can grant the permission manually:

import { BarcodeScanner } from '@pantrist/capacitor-mlkit-barcode-text-scanner';

const checkPermissions = async () => {
  const { camera } = await BarcodeScanner.checkPermissions();
  return camera;
};

const requestPermissions = async () => {
  const { camera } = await BarcodeScanner.requestPermissions();
  return camera;
};

const openSettings = async () => {
  await BarcodeScanner.openSettings();
};

Hide all WebView elements during a scan

Since the camera is rendered behind the WebView when using startScan(...), you have to hide all elements that should not be visible. An example of the CSS class barcode-scanner-active with Ionic Framework could be:

// Hide all elements
body.barcode-scanner-active {
  visibility: hidden;
  --background: transparent;
  --ion-background-color: transparent;
}

// Show only the barcode scanner modal
.barcode-scanner-modal {
  visibility: visible;
}

@media (prefers-color-scheme: dark) {
  .barcode-scanner-modal {
    --background: transparent;
    --ion-background-color: transparent;
  }
}

An example of the CSS class barcode-scanner-active without Ionic Framework could be:

// Hide all elements
body.barcode-scanner-active {
  visibility: hidden;
}

// Show only the barcode scanner modal
.barcode-scanner-modal {
  visibility: visible;
}

If you can't see the camera view, make sure all elements in the DOM are not visible or have a transparent background to debug the issue.

API

• startScan(...)
• stopScan()
• readBarcodesFromImage(...)
• scan(...)
• isSupported()
• enableTorch()
• disableTorch()
• toggleTorch()
• isTorchEnabled()
• isTorchAvailable()
• setZoomRatio(...)
• getZoomRatio()
• getMinZoomRatio()
• getMaxZoomRatio()
• isTextRecognitionAvailable()
• setTextRecognitionEnabled(...)
• openSettings()
• isGoogleBarcodeScannerModuleAvailable()
• installGoogleBarcodeScannerModule()
• checkPermissions()
• requestPermissions()
• addListener('barcodesScanned', ...)
• addListener('textScanned', ...)
• addListener('scanError', ...)
• addListener('googleBarcodeScannerModuleInstallProgress', ...)
• removeAllListeners()
• Interfaces
• Type Aliases
• Enums

startScan(...)

startScan(options?: StartScanOptions | undefined) => Promise<void>

Start scanning for barcodes.

| Param | Type | | ------------- | ------------------------------------------------------------- | | options | StartScanOptions |

Since: 0.0.1

stopScan()

stopScan() => Promise<void>

Stop scanning for barcodes.

Since: 0.0.1

readBarcodesFromImage(...)

readBarcodesFromImage(options: ReadBarcodesFromImageOptions) => Promise<ReadBarcodesFromImageResult>

Read barcodes from an image.

| Param | Type | | ------------- | ------------------------------------------------------------------------------------- | | options | ReadBarcodesFromImageOptions |

Returns: Promise<ReadBarcodesFromImageResult>

Since: 0.0.1

scan(...)

scan(options?: ScanOptions | undefined) => Promise<ScanResult>

Scan a barcode with a ready-to-use interface without WebView customization.

On Android, this method is only available on devices with Google Play Services installed. Therefore, no camera permission is required.

Attention: Before using this method on Android, first check if the Google Barcode Scanner module is available by using isGoogleBarcodeScannerModuleAvailable().

Attention: On Android, the system may destroy the app while the scanner is open. In this case, the promise will never resolve. Instead, the result is delivered through the appRestoredResult event of the App plugin when the app is restored. If the app process was terminated, the scan result cannot be recovered and the event contains an error.

Only available on Android and iOS.

| Param | Type | | ------------- | --------------------------------------------------- | | options | ScanOptions |

Returns: Promise<ScanResult>

Since: 0.0.1

isSupported()

isSupported() => Promise<IsSupportedResult>

Returns whether or not the barcode scanner is supported.

Returns: Promise<IsSupportedResult>

Since: 0.0.1

enableTorch()

enableTorch() => Promise<void>

Enable camera's torch (flash) during a scan session.

Only available on Android and iOS.

Since: 7.2.0

disableTorch()

disableTorch() => Promise<void>

Disable camera's torch (flash) during a scan session.

Only available on Android and iOS.

Since: 7.2.0

toggleTorch()

toggleTorch() => Promise<void>

Toggle camera's torch (flash) during a scan session.

Only available on Android and iOS.

Since: 7.2.0

isTorchEnabled()

isTorchEnabled() => Promise<IsTorchEnabledResult>

Returns whether or not the camera's torch (flash) is enabled.

Only available on Android and iOS.

Returns: Promise<IsTorchEnabledResult>

Since: 7.2.0

isTorchAvailable()

isTorchAvailable() => Promise<IsTorchAvailableResult>

Returns whether or not the camera's torch (flash) is available.

Only available on Android and iOS.

Returns: Promise<IsTorchAvailableResult>

Since: 7.2.0

setZoomRatio(...)

setZoomRatio(options: SetZoomRatioOptions) => Promise<void>

Set the zoom ratio of the camera.

Only available on Android and iOS.

| Param | Type | | ------------- | ------------------------------------------------------------------- | | options | SetZoomRatioOptions |

Since: 5.4.0

getZoomRatio()

getZoomRatio() => Promise<GetZoomRatioResult>

Get the zoom ratio of the camera.

Only available on Android and iOS.

Returns: Promise<GetZoomRatioResult>

Since: 5.4.0

getMinZoomRatio()

getMinZoomRatio() => Promise<GetMinZoomRatioResult>

Get the minimum zoom ratio of the camera.

Only available on Android and iOS.

Returns: Promise<GetMinZoomRatioResult>

Since: 5.4.0

getMaxZoomRatio()

getMaxZoomRatio() => Promise<GetMaxZoomRatioResult>

Get the maximum zoom ratio of the camera.

Only available on Android and iOS.

Returns: Promise<GetMaxZoomRatioResult>

Since: 5.4.0

isTextRecognitionAvailable()

isTextRecognitionAvailable() => Promise<IsTextRecognitionAvailableResult>

Returns whether live text recognition (see StartScanOptions.textRecognition) is available on this platform.

Returns: Promise<IsTextRecognitionAvailableResult>

Since: 8.3.0

setTextRecognitionEnabled(...)

setTextRecognitionEnabled(options: SetTextRecognitionEnabledOptions) => Promise<void>

Turn live text recognition on or off during an active scan session, without restarting the camera.

Barcode scanning keeps running either way. Turn text recognition off as soon as you have what you need: it is considerably more expensive than barcode scanning.

Only available on Android and iOS.

| Param | Type | | ------------- | --------------------------------------------------------------------------------------------- | | options | SetTextRecognitionEnabledOptions |

Since: 8.3.0

openSettings()

openSettings() => Promise<void>

Open the settings of the app so that the user can grant the camera permission.

Only available on Android and iOS.

Since: 0.0.1

isGoogleBarcodeScannerModuleAvailable()

isGoogleBarcodeScannerModuleAvailable() => Promise<IsGoogleBarcodeScannerModuleAvailableResult>

Check if the Google Barcode Scanner module is available.

If the Google Barcode Scanner module is not available, you can install it by using installGoogleBarcodeScannerModule().

Only available on Android.

Returns: Promise<IsGoogleBarcodeScannerModuleAvailableResult>

Since: 5.1.0

installGoogleBarcodeScannerModule()

installGoogleBarcodeScannerModule() => Promise<void>

Install the Google Barcode Scanner module.

Attention: This only starts the installation. The googleBarcodeScannerModuleInstallProgress event listener will notify you when the installation is complete.

Only available on Android.

Since: 5.1.0

checkPermissions()

checkPermissions() => Promise<PermissionStatus>

Check camera permission.

Returns: Promise<PermissionStatus>

Since: 0.0.1

requestPermissions()

requestPermissions() => Promise<PermissionStatus>

Request camera permission.

Returns: Promise<PermissionStatus>

Since: 0.0.1

addListener('barcodesScanned', ...)

addListener(eventName: 'barcodesScanned', listenerFunc: (event: BarcodesScannedEvent) => void) => Promise<PluginListenerHandle>

Called when barcodes are scanned.

| Param | Type | | ------------------ | ----------------------------------------------------------------------------------------- | | eventName | 'barcodesScanned' | | listenerFunc | (event: BarcodesScannedEvent) => void |

Returns: Promise<PluginListenerHandle>

Since: 6.2.0

addListener('textScanned', ...)

addListener(eventName: 'textScanned', listenerFunc: (event: TextScannedEvent) => void) => Promise<PluginListenerHandle>

Called when text is recognized in the camera preview.

Only emitted while text recognition is enabled (see StartScanOptions.textRecognition and setTextRecognitionEnabled()), and only for frames that contain text.

Only available on Android and iOS.

| Param | Type | | ------------------ | --------------------------------------------------------------------------------- | | eventName | 'textScanned' | | listenerFunc | (event: TextScannedEvent) => void |

Returns: Promise<PluginListenerHandle>

Since: 8.3.0

addListener('scanError', ...)

addListener(eventName: 'scanError', listenerFunc: (event: ScanErrorEvent) => void) => Promise<PluginListenerHandle>

Called when an error occurs during the scan.

Available on Android and iOS.

| Param | Type | | ------------------ | ----------------------------------------------------------------------------- | | eventName | 'scanError' | | listenerFunc | (event: ScanErrorEvent) => void |

Returns: Promise<PluginListenerHandle>

Since: 0.0.1

addListener('googleBarcodeScannerModuleInstallProgress', ...)

addListener(eventName: 'googleBarcodeScannerModuleInstallProgress', listenerFunc: (event: GoogleBarcodeScannerModuleInstallProgressEvent) => void) => Promise<PluginListenerHandle>

Called when the Google Barcode Scanner module is installed.

Available on Android.

| Param | Type | | ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------- | | eventName | 'googleBarcodeScannerModuleInstallProgress' | | listenerFunc | (event: GoogleBarcodeScannerModuleInstallProgressEvent) => void |

Returns: Promise<PluginListenerHandle>

Since: 5.1.0

removeAllListeners()

removeAllListeners() => Promise<void>

Remove all listeners for this plugin.

Since: 0.0.1

Interfaces

StartScanOptions

| Prop | Type | Description | Default | Since | | ------------------------------------ | ------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------- | ----- | | formats | BarcodeFormat[] | Improve the speed of the barcode scanner by configuring the barcode formats to scan for. Only available on Android and iOS. | | 0.0.1 | | lensFacing | LensFacing | Configure the camera (front or back) to use. | | 0.0.1 | | resolution | Resolution | Configure the resolution of the captured image that is used for barcode scanning. If the resolution is not supported by the device, the closest supported resolution will be used. On the web it is a wish to the browser (ideal width and height), which otherwise often picks 640x480: too coarse for dense codes such as an Aztec or QR code shown on another phone's screen. | Resolution['1280x720'] | 7.0.0 | | enableMultitaskingCameraAccess | boolean | Allow camera usage on iPad while in multitasking mode. Only available on iOS (16.0+). | false | 7.5.0 | | textRecognition | boolean | Also run ML Kit text recognition (Latin script) on the camera frames of this scan session and emit textScanned events. Can be toggled later with setTextRecognitionEnabled(). Only available on Android and iOS. | false | 8.3.0 | | textRecognitionInterval | number | The minimum time in milliseconds between two text recognition passes. Text recognition is a lot slower than barcode scanning, so it does not run on every frame. Lower values react faster but cost more battery. Only available on Android and iOS. | 250 | 8.3.0 | | videoElement | HTMLVideoElement | The HTML video element to use for the camera preview. Only available on web. | | 7.1.0 |

ReadBarcodesFromImageResult

| Prop | Type | Description | Since | | -------------- | ---------------------- | ---------------------- | ----- | | barcodes | Barcode[] | The detected barcodes. | 0.0.1 |

Barcode

| Prop | Type | Description | Since | | ------------------- | ------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----- | | bytes | number[] | Raw bytes as it was encoded in the barcode. | 0.0.1 | | calendarEvent | BarcodeCalendarEvent | Calendar event info. | 7.0.0 | | contactInfo | BarcodeContactInfo | Person's or organization's business card. | 7.0.0 | | cornerPoints | [[number, number], [number, number], [number, number], [number, number]] | The four corner points of the barcode in clockwise order starting with top-left. This property is currently only supported by the startScan(...) method. | 0.0.1 | | displayValue | string | The barcode value in a human readable format. | 0.0.1 | | driverLicense | BarcodeDriverLicense | Driver license or ID card. | 7.0.0 | | email | BarcodeEmail | An email message from a 'MAILTO:'. | 7.0.0 | | format | BarcodeFormat | The barcode format. | 0.0.1 | | geoPoint | BarcodeGeoPoint | GPS coordinates from a 'GEO:'. | 7.0.0 | | phone | BarcodePhone | Phone number info. | 7.0.0 | | rawValue | string | The barcode value in a machine readable format. This value is only available if the barcode is encoded in the UTF-8 character set. Otherwise, the bytes property should be used. | 0.0.1 | | sms | BarcodeSms | A sms message from a 'SMS:'. | 7.0.0 | | urlBookmark | BarcodeUrlBookmark | A URL and title from a 'MEBKM:'. | 7.0.0 | | valueType | BarcodeValueType | The barcode value type. | 0.0.1 | | wifi | BarcodeWifi | A wifi network parameters from a 'WIFI:'. | 7.0.0 |

BarcodeCalendarEvent

| Prop | Type | Description | Since | | ----------------- | ------------------- | ---------------------------------------- | ----- | | description | string | The event description. | 7.0.0 | | end | string | The event end date as ISO 8601 string. | 7.0.0 | | location | string | The event location. | 7.0.0 | | organizer | string | The event organizer. | 7.0.0 | | start | string | The event start date as ISO 8601 string. | 7.0.0 | | status | string | The event status. | 7.0.0 | | summary | string | The event summary. | 7.0.0 |

BarcodeContactInfo

| Prop | Type | Description | Since | | ------------------ | ------------------------------------------------- | --------------------------- | ----- | | addresses | Address[] | The contact's addresses. | 7.0.0 | | emails | BarcodeEmail[] | The contact's emails. | 7.0.0 | | personName | PersonName | The contact's name. | 7.0.0 | | organization | string | The contact's organization. | 7.0.0 | | phones | BarcodePhone[] | The contact's phones. | 7.0.0 | | title | string | The contact's title. | 7.0.0 | | urls | string[] | The contact's urls. | 7.0.0 |

Address

| Prop | Type | Description | Since | | ------------------ | --------------------------------------------------- | --------------------------------------------------- | ----- | | addressLines | string[] | Formatted address, multiple lines when appropriate. | 7.0.0 | | type | AddressType | Address type. | 7.0.0 |

BarcodeEmail

| Prop | Type | Description | Since | | ------------- | ----------------------------------------------------------- | ----------------------- | ----- | | address | string | The email address. | 7.0.0 | | body | string | The email body. | 7.0.0 | | subject | string | The email subject. | 7.0.0 | | type | EmailFormatType | The email address type. | 7.0.0 |

PersonName

| Prop | Type | Description | Since | | ------------------- | ------------------- | ------------------------------------------------------------------------------------ | ----- | | first | string | First name. | 7.0.0 | | formattedName | string | The formatted name. | 7.0.0 | | last | string | Last name. | 7.0.0 | | middle | string | Middle name. | 7.0.0 | | prefix | string | Name prefix. | 7.0.0 | | pronunciation | string | Text string to be set as the kana name in the phonebook. Used for Japanese contacts. | 7.0.0 | | suffix | string | Name suffix. | 7.0.0 |

BarcodePhone

| Prop | Type | Description | Since | | ------------ | ----------------------------------------------------------- | ---------------------- | ----- | | number | string | The phone number. | 7.0.0 | | type | PhoneFormatType | The phone number type. | 7.0.0 |

BarcodeDriverLicense

| Prop | Type | Description | Since | | -------------------- | ------------------- | -------------------------------------------------- | ----- | | addressCity | string | City of holder's address. | 7.0.0 | | addressState | string | State of holder's address. | 7.0.0 | | addressStreet | string | Street of holder's address. | 7.0.0 | | addressZip | string | Postal code of holder's address. | 7.0.0 | | birthDate | string | Birthdate of the holder. | 7.0.0 | | documentType | string | "DL" for driver's licenses, "ID" for ID cards. | 7.0.0 | | expiryDate | string | Expiration date of the license. | 7.0.0 | | firstName | string | Holder's first name. | 7.0.0 | | gender | string | Holder's gender. | 7.0.0 | | issueDate | string | Issue date of the license. | 7.0.0 | | issuingCountry | string | ISO 3166-1 alpha-3 code in which DL/ID was issued. | 7.0.0 | | lastName | string | Holder's last name. | 7.0.0 | | licenseNumber | string | Driver license ID number. | 7.0.0 | | middleName | string | Holder's middle name. | 7.0.0 |

BarcodeGeoPoint

| Prop | Type | Description | Since | | --------------- | ------------------- | ----------- | ----- | | latitude | number | Latitude. | 7.0.0 | | longitude | number | Longitude. | 7.0.0 |

BarcodeSms

| Prop | Type | Description | Since | | ----------------- | ------------------- | ------------------------------- | ----- | | phoneNumber | string | The phone number of the sms. | 7.0.0 | | message | string | The message content of the sms. | 7.0.0 |

BarcodeUrlBookmark

| Prop | Type | Description | Since | | ----------- | ------------------- | -------------------------- | ----- | | url | string | The URL of the bookmark. | 7.0.0 | | title | string | The title of the bookmark. | 7.0.0 |

BarcodeWifi

| Prop | Type | Description | Since | | -------------------- | ----------------------------------------------------------------- | ----------------------------- | ----- | | encryptionType | WifiEncryptionType | Encryption type of the WI-FI. | 7.0.0 | | password | string | Password of the WI-FI. | 7.0.0 | | ssid | string | SSID of the WI-FI. | 7.0.0 |

ReadBarcodesFromImageOptions

| Prop | Type | Description | Since | | ------------- | ---------------------------- | ---------------------------------------------------------------------------------------- | ----- | | blob | Blob | The blob instance of the image file. Only available on Web. | 7.4.0 | | formats | BarcodeFormat[] | Improve the speed of the barcode scanner by configuring the barcode formats to scan for. | 0.0.1 | | path | string | The local path to the image file. Only available on Android and iOS. | 0.0.1 |

ScanResult

| Prop | Type | Description | Since | | -------------- | ---------------------- | ---------------------- | ----- | | barcodes | Barcode[] | The detected barcodes. | 0.0.1 |

ScanOptions

| Prop | Type | Description | Since | | -------------- | ---------------------------- | ---------------------------------------------------------------------------------------- | ----- | | formats | BarcodeFormat[] | Improve the speed of the barcode scanner by configuring the barcode formats to scan for. | 0.0.1 | | autoZoom | boolean | Toggle the auto zoom feature. | 7.4.0 |

IsSupportedResult

| Prop | Type | Description | Since | | --------------- | -------------------- | --------------------------------------------------------------------------------------- | ----- | | supported | boolean | Whether or not the barcode scanner is supported by checking if the device has a camera. | 0.0.1 |

IsTorchEnabledResult

| Prop | Type | Description | Since | | ------------- | -------------------- | ------------------------------------ | ----- | | enabled | boolean | Whether or not the torch is enabled. | 0.0.1 |

IsTorchAvailableResult

| Prop | Type | Description | Since | | --------------- | -------------------- | -------------------------------------- | ----- | | available | boolean | Whether or not the torch is available. | 0.0.1 |

SetZoomRatioOptions

| Prop | Type | Description | Since | | --------------- | ------------------- | ---------------------- | ----- | | zoomRatio | number | The zoom ratio to set. | 5.4.0 |

GetZoomRatioResult

| Prop | Type | Description | Since | | --------------- | ------------------- | --------------- | ----- | | zoomRatio | number | The zoom ratio. | 5.4.0 |

GetMinZoomRatioResult

| Prop | Type | Description | Since | | --------------- | ------------------- | ----------------------- | ----- | | zoomRatio | number | The minimum zoom ratio. | 5.4.0 |

GetMaxZoomRatioResult

| Prop | Type | Description | Since | | --------------- | ------------------- | ----------------------- | ----- | | zoomRatio | number | The maximum zoom ratio. | 5.4.0 |

IsTextRecognitionAvailableResult

| Prop | Type | Description | Since | | --------------- | -------------------- | -------------------------------------------------- | ----- | | available | boolean | Whether or not live text recognition is available. | 8.3.0 |

SetTextRecognitionEnabledOptions

| Prop | Type | Description | Since | | ------------- | -------------------- | --------------------------------------------------------- | ----- | | enabled | boolean | Whether text recognition should run on the camera frames. | 8.3.0 |

IsGoogleBarcodeScannerModuleAvailableResult

| Prop | Type | Description | Since | | --------------- | -------------------- | ------------------------------------------------------------------------------------- | ----- | | available | boolean | Whether or not the Google Barcode Scanner module is available. | 5.1.0 |

PermissionStatus

| Prop | Type | Since | | ------------ | ----------------------------------------------------------------------- | ----- | | camera | CameraPermissionState | 0.0.1 |

PluginListenerHandle

| Prop | Type | | ------------ | ----------------------------------------- | | remove | () => Promise<void> |

BarcodesScannedEvent

| Prop | Type | Description | Since | | -------------- | ---------------------- | ---------------------- | ----- | | barcodes | Barcode[] | The detected barcodes. | 6.2.0 |

TextScannedEvent

| Prop | Type | Description | Since | | ------------ | ------------------------ | ----------------------------------------------------------------------- | ----- | | text | string | The full recognized text of the frame, blocks separated by line breaks. | 8.3.0 | | blocks | TextBlock[] | The recognized text blocks (paragraphs) of the frame. | 8.3.0 |

TextBlock

A block of text (roughly a paragraph) recognized in a camera frame.

| Prop | Type | Description | Since | | ------------------ | ------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----- | | text | string | The recognized text of the block. | 8.3.0 | | cornerPoints | [[number, number], [number, number], [number, number], [number, number]] | The four corner points of the block in clockwise order starting with top-left, in the same coordinate space as Barcode</a>.cornerPoints (screen pixels of the camera preview). | 8.3.0 | | lines | TextLine[] | The lines of the block. | 8.3.0 |

TextLine

A single line of text recognized in a camera frame.

| Prop | Type | Description | Since | | ------------------ | ------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----- | | text | string | The recognized text of the line. | 8.3.0 | | cornerPoints | [[number, number], [number, number], [number, number], [number, number]] | The four corner points of the line in clockwise order starting with top-left, in the same coordinate space as Barcode</a>.cornerPoints (screen pixels of the camera preview). | 8.3.0 |

ScanErrorEvent

| Prop | Type | Description | Since | | ------------- | ------------------- | ------------------ | ----- | | message | string | The error message. | 0.0.1 |

GoogleBarcodeScannerModuleInstallProgressEvent

| Prop | Type | Description | Since | | -------------- | --------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------- | ----- | | state | GoogleBarcodeScannerModuleInstallState | The current state of the installation. | 5.1.0 | | progress | number | The progress of the installation in percent between 0 and 100. | 5.1.0 |

Type Aliases

CameraPermissionState

PermissionState | 'limited'

PermissionState

'prompt' | 'prompt-with-rationale' | 'granted' | 'denied'

Enums

BarcodeFormat

| Members | Value | Description | Since | | ---------------- | -------------------------- | ---------------------------------- | ----- | | Aztec | 'AZTEC' | Only available on Android and iOS. | 0.0.1 | | Codabar | 'CODABAR' | Only available on Android and iOS. | 0.0.1 | | Code39 | 'CODE_39' | Only available on Android and iOS. | 0.0.1 | | Code93 | 'CODE_93' | Only available on Android and iOS. | 0.0.1 | | Code128 | 'CODE_128' | Only available on Android and iOS. | 0.0.1 | | DataMatrix | 'DATA_MATRIX' | Only available on Android and iOS. | 0.0.1 | | Ean8 | 'EAN_8' | Only available on Android and iOS. | 0.0.1 | | Ean13 | 'EAN_13' | Only available on Android and iOS. | 0.0.1 | | Itf | 'ITF' | Only available on Android and iOS. | 0.0.1 | | Pdf417 | 'PDF_417' | Only available on Android and iOS. | 0.0.1 | | QrCode | 'QR_CODE' | Only available on Android and iOS. | 0.0.1 | | UpcA | 'UPC_A' | Only available on Android and iOS. | 0.0.1 | | UpcE | 'UPC_E' | Only available on Android and iOS. | 0.0.1 |

LensFacing

| Members | Value | Since | | ----------- | -------------------- | ----- | | Front | 'FRONT' | 0.0.1 | | Back | 'BACK' | 0.0.1 |

Resolution

| Members | Value | Since | | ----------------- | -------------- | ----- | | '640x480' | 0 | 7.0.0 | | '1280x720' | 1 | 7.0.0 | | '1920x1080' | 2 | 7.0.0 | | '3840x2160' | 3 | 7.2.0 |

AddressType

| Members | Value | Since | | ------------- | -------------- | ----- | | HOME | 0 | 7.0.0 | | UNKNOWN | 1 | 7.0.0 | | WORK | 2 | 7.0.0 |

EmailFormatType

| Members | Value | Since | | ------------- | -------------- | ----- | | HOME | 0 | 7.0.0 | | UNKNOWN | 1 | 7.0.0 | | WORK | 2 | 7.0.0 |

PhoneFormatType

| Members | Value | Since | | ------------- | -------------- | ----- | | FAX | 0 | 7.0.0 | | HOME | 1 | 7.0.0 | | MOBILE | 2 | 7.0.0 | | UNKNOWN | 3 | 7.0.0 | | WORK | 4 | 7.0.0 |

BarcodeValueType

| Members | Value | Since | | -------------------- | ------------------------------ | ----- | | CalendarEvent | 'CALENDAR_EVENT' | 0.0.1 | | ContactInfo | 'CONTACT_INFO' | 0.0.1 | | DriversLicense | 'DRIVERS_LICENSE' | 0.0.1 | | Email | 'EMAIL' | 0.0.1 | | Geo | 'GEO' | 0.0.1 | | Isbn | 'ISBN' | 0.0.1 | | Phone | 'PHONE' | 0.0.1 | | Product | 'PRODUCT' | 0.0.1 | | Sms | 'SMS' | 0.0.1 | | Text | 'TEXT' | 0.0.1 | | Url | 'URL' | 0.0.1 | | Wifi | 'WIFI' | 0.0.1 | | Unknown | 'UNKNOWN' | 0.0.1 |

WifiEncryptionType

| Members | Value | Since | | ---------- | -------------- | ----- | | OPEN | 1 | 7.0.0 | | WEP | 2 | 7.0.0 | | WPA | 3 | 7.0.0 |

GoogleBarcodeScannerModuleInstallState

| Members | Value | Since | | --------------------- | -------------- | ----- | | UNKNOWN | 0 | 5.1.0 | | PENDING | 1 | 5.1.0 | | DOWNLOADING | 2 | 5.1.0 | | CANCELED | 3 | 5.1.0 | | COMPLETED | 4 | 5.1.0 | | FAILED | 5 | 5.1.0 | | INSTALLING | 6 | 5.1.0 | | DOWNLOAD_PAUSED | 7 | 5.1.0 |

FAQ

What is the difference between startScan and scan?

The startScan(...) method renders the camera behind the WebView so that you can build a completely custom scanning UI, but it requires you to hide all WebView elements that should not be visible (see the usage example). The scan(...) method opens a ready-to-use interface without any WebView customization and