Dynamsoft Barcode Reader samples for React-Native edition

This repository contains multiple samples that demonstrate how to use the Dynamsoft Barcode Reader React-Native Edition.

Integration Guide For Your Project

• Guide for Scanning Barcodes with Ready-to-use Component
• Guide for Scanning Barcodes with Foundational APIs

API References

There are two ways to use the Dynamsoft Barcode Reader React-Native SDK:

• Ready-to-use BarcodeScanner APIs

• Foundational APIs

Samples

Sample Name	Description
ScanBarcodes_ReadyToUseComponent	Demonstrates the quickest way to scan barcodes from live camera preview using the Ready-to-Use Barcode Scanner component, with minimal configuration required.
ScanBarcodes_FoundationalAPI	Demonstrates how to scan barcodes from live camera preview using the Foundational API, providing full control over camera, processing pipeline, and barcode results.
ScanBarcodes_Expo	Demonstrates barcode scanning using the Foundational API in an Expo (Bare) project, showing how to integrate Dynamsoft Barcode Reader into an Expo-based workflow.
ScanDriversLicense	Demonstrates how to recognize and extract information from drivers’ licenses in real-time video streaming.
ScanVIN	Demonstrates how to recognize and extract information from VIN barcodes in real-time video streaming.
ScenarioOptimizedScanning	Demonstrates how to optimize scanning performance for different barcode formats and scenarios by loading scenario-specific templates (1D Retail, 1D Industrial, QR Code, Data Matrix, Aztec, Dot Code, DPM, PDF417, and High-Density codes).
BarcodeReaderSettings	Demonstrates how to configure the barcode reading settings via the Foundational API, including barcode formats, expected barcode count, minimum result confidence, and timeout.
LocateAnItemWithBarcode	Demonstrates how to locate an item by scanning or entering its barcode ID, using visual guidance to help find the matching item in real-time video streaming.
ReadGS1AI	Demonstrates how to recognize and parse GS1 Application Identifiers (AIs) from barcodes, extracting and formatting fields such as dates and other AI data.

📌 Note on sample types

The samples above are divided into two categories based on the project type:

• React Native CLI samples (non-Expo): ScanBarcodes_ReadyToUseComponent, ScanBarcodes_FoundationalAPI, ScanDriversLicense, ScanVIN
• Expo (Bare) samples: ScanBarcodes_Expo, ScenarioOptimizedScanning, BarcodeReaderSettings, LocateAnItemWithBarcode, ReadGS1AI

Please refer to the corresponding build instructions below for your sample type.

How to build and run a sample

For React Native CLI Samples

1. Enter a sample folder that you want to try

cd ScanBarcodes_FoundationalAPI

or

cd ScanBarcodes_ReadyToUseComponent

or

cd ScanDriversLicense

or

cd ScanVIN

2. Install node modules

Run the following command:

yarn install

or

npm install

3. Prepare iOS

You must install the necessary native frameworks from CocoaPods to run the application. In order to do this, the pod install command needs to be run as such:

cd ios
pod install

Open the workspace file *.xcworkspace (not .xcodeproj) from the ios directory in Xcode. Adjust Provisioning and Signing settings.

4. Build and Run

• Android

Go to your project folder and run the following command:

# using npm
npm run android

# OR using Yarn
yarn android

• iOS

In the terminal, go to the project folder in your project:

# using npm
npm run ios

# OR using Yarn
yarn ios

If everything is set up correctly, you should see your new app running on your device. This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.

Note

If you want to run Android via Windows, You may encounter some build errors due to the Windows Maximum Path Length Limitation. Therefore, we recommend that you move the project to a directory with a shorter path.

Note

• The application needs to run on a physical device rather than a simulator as it requires the use of the camera. If you try running it on a simulator, you will most likely run into a number of errors/failures.
• On iOS, in order to run the React Native app on a physical device you will need to install the ios-deploy library. Afterwards, you can run the react native app from the terminal as such npx react-native run-ios --device assuming it's the only device connected to the Mac.
• Alternatively on iOS, you can simply open the xcworkspace of the project found in the ios folder using Xcode and run the sample on your connected iOS device from there. The advantage that this offers is that it is easier to deal with the developer signatures for deployment in there.

For Expo Sample

1. Enter the Expo sample folder

cd ScanBarcodes_Expo

or

cd ScenarioOptimizedScanning

or

cd BarcodeReaderSettings

or

cd LocateAnItemWithBarcode

or

cd ReadGS1AI

2. Install node modules

yarn install

or

npm install

3. Generate native projects

Run the following command to generate the android and ios folders:

npx expo prebuild

4. Prepare iOS

Install the necessary native frameworks from CocoaPods:

cd ios
pod install
cd ..

5. Build and Run

• Android

npx expo run:android

• iOS

npx expo run:ios

Note

The application needs to run on a physical device rather than a simulator as it requires the use of the camera.

How to use the new architecture of React Native (Optional)

How to enable new architecture in Android

How to enable new architecture in iOS

License

• You can request a 30-day trial license via the Request a Trial License link.

Contact

https://www.dynamsoft.com/company/contact/