React Native Barcode Scanner

The Ready-To-Use UI (RTU UI) is an easy-to-integrate and highly customizable high-level UI component that can handle most barcode scanning use cases and tasks.

The design and behavior of this component are based on our many years of experience as well as the feedback from our SDK customers.

Although the main idea of the RTU UI is to provide simple-to-integrate and simple-to-configure components, its customization capabilities are numerous and should suit most of your needs. To achieve an even higher degree of customization, you can implement a custom UI and business-logic using our Custom UI Components.

Import

​

To use the RTU UI component please import  startBarcodeScanner  function and all related configurations and results from react-native-scanbot-barcode-scanner-sdk/ui_v2.

Example:​

import { startBarcodeScanner, BarcodeScannerConfiguration } from 'react-native-scanbot-barcode-scanner-sdk/ui_v2';

RTU UI v2 Default Configuration

// Create the default configuration object.
const config = new BarcodeScannerConfiguration();
 
// See further customization configs...
 
const result = await startBarcodeScanner(config);

See full example on GitHub

Returns

​

• result.status – OK  If the scanning is completed, CANCELED if the user has canceled the operation (tapped on the “cancel” button).
• result.data?.items – Optional List of recognized barcodes as items. See the barcode item structure below.

Barcode item structure:

• type – Recognized barcode symbology.
• count – Number of recognized barcodes of this symbology and value.
• text – Recognized value of the barcode.
• textWithExtension – Recognized barcode value with extension (if available).
• rawBytes – Representation of the raw data that is contained the recognized barcode.
• parsedDocument – The parsed known document format (if parsed successfully).

React Native Barcode Scanner for Expo

The Scanbot Barcode Scanner SDK can be integrated into React Native applications using the Expo framework. This integration is only possible when using an Expo development build.

Combining Expo’s framework with Scanbot SDK allows you to implement powerful barcode scanning features with minimal setup. The entire integration process can be completed in less than an hour, with comprehensive documentation and dedicated integration support available. Check out our comprehensive, step-by-step tutorial that guides you through the entire process of integrating the React Native Barcode Scanner SDK into your Expo project.