Google MLKit Vision Barcode Scanner Plugin
npm install cordova-plugin-mlkit-barcode-scannercordova-android | >=8.0.0 | |
cordova-ios | >=4.5.0 | |
cordova-plugin-androidx | ^3.0.0 | If cordova-android < 9.0.0 |
cordova-plugin-androidx-adapter | ^1.1.3 | |
cordova-android version is below 9.0.0, you have to install cordova-plugin-androidx first before installing this plugin.
bash
npx cordova plugin add cordova-plugin-androidx
`
Installation
Run this command in your project root:
`bash
npx cordova plugin add cordova-plugin-mlkit-barcode-scanner
`
Supported Platforms
- Android
- iOS/iPadOS
Barcode Support
| 1d formats | Android | iOS |
| ------------ | ------- | --- |
| Codabar | ✓ | ✓ |
| Code 39 | ✓ | ✓ |
| Code 93 | ✓ | ✓ |
| Code 128 | ✓ | ✓ |
| EAN-8. | ✓ | ✓ |
| EAN-13 | ✓ | ✓ |
| ITF | ✓ | ✓ |
| MSI | ✗ | ✗ |
| RSS Expanded | ✗ | ✗ |
| RSS-14 | ✗ | ✗ |
| UPC-A | ✓ | ✓ |
| UPC-E | ✓ | ✓ |
| 2d formats | Android | iOS |
| ----------- | ------- | --- |
| Aztec | ✓ | ✓ |
| Codablock | ✗ | ✗ |
| Data Matrix | ✓ | ✓ |
| MaxiCode | ✗ | ✗ |
| PDF417 | ✓ | ✓ |
| QR Code | ✓ | ✓ |
:information_source: Note that this API does not recognize barcodes in these forms:
- 1D Barcodes with only one character
- Barcodes in ITF format with fewer than six characters
- Barcodes encoded with FNC2, FNC3 or FNC4
- QR codes generated in the ECI mode
Usage
To use the plugin simply call cordova.plugins.mlkit.barcodeScanner.scan(options, sucessCallback, failureCallback). See the sample below.
`javascript
cordova.plugins.mlkit.barcodeScanner.scan(
options,
(result) => {
// Do something with the data
alert(result);
},
(error) => {
// Error handling
},
);
`
$3
The default options are shown below.
All values are optional.
Note that the detectorSize value must be between 0 and 1, because it determines how many percent of the screen should be covered by the detector.
If the value is greater than 1 the detector will not be visible on the screen.
`javascript
const defaultOptions = {
barcodeFormats: {
Code128: true,
Code39: true,
Code93: true,
CodaBar: true,
DataMatrix: true,
EAN13: true,
EAN8: true,
ITF: true,
QRCode: true,
UPCA: true,
UPCE: true,
PDF417: true,
Aztec: true,
},
beepOnSuccess: false,
vibrateOnSuccess: false,
detectorSize: 0.6,
rotateCamera: false,
};
`
$3
`javascript
result: {
text: string;
format: string;
type: string;
}
`
Known Issues
On some devices the camera may be upside down.
Here is a list of devices with this problem:
- Zebra MC330K (Manufacturer: Zebra Technologies, Model: MC33)
Current Solution:
if your device has this problem, you can call the plugin with the option rotateCamera set to true.
This will rotate the camera stream by 180 degrees.
Development
$3
This project uses npm scripts for building:
`shell
lint the project using eslint
npm run lint
removes the generated folders
npm run clean
build the project
(includes clean and lint)
npm run build
publish the project
(includes build)
npm publish
`
A VS Code task for build is also included.
Run the test app
Install cordova:
`
npm i -g cordova
`
Go to test app:
`
cd test/scan-test-app
`
Install node modules:
`
npm i
`
Prepare Cordova:
`
cordova prepare && cordova plugin add ../../ --link --force
`
Build and run the project Android:
`
cordova build android && cordova run android
`
and iOS:
`
cordova build ios && cordova run ios
`
$3
⚠️ Before incrementing the version in package.json, remember to increment the version in plugin.xml by hand.
$3
This project is intended to be used with Visual Studio Code and the recommended extensions can be found in .vscode/extensions.json`.