@juit/nativescript-barcodeview
v1.1.3
Published
Embedded barcode scanning view for NativeScript 7
Downloads
5
Maintainers
Readme
Barcode-Scanning View for NativeScript 7
This package implements a minimalistic barcode-scanning View
for
NativeScript (from v. 7).
Sample
Attributes
The BarcodeScannerView
exposes a few attributes to control the operation of
barcode scanning:
XML
<BarcodeScannerView
formats="QR_CODE, CODE_39"
preferFrontCamera="false"
isPaused="false"
(scanResult)="barcodeScanned($event)"
/>
TypeScript
import { ScanResultEventData } from '@juit/nativescript-barcodeview'
export function barcodeScanned(event: ScanResultEventData) {
alert(`Scanned "${event.format}" barcode: ${event.text}`)
}
formats
The formats
property is defined as a KnownBarcodeFormat[]
and informs the
barcode scanner what formats should be recognized.
When specified as a string
, the formats are case-insensitive, comma and/or
whitespace separated
See Barcode Formats below for a list of supported formats.
The default (empty array) represents all supported formats.
isPaused
The isPaused
boolean
attribute specifies whether barcode scanning is
running (false
) or paused (true
)paused or running.
preferFrontCamera
The preferFrontCamera
boolean
attribute specifies whether preferentially
the scanner should use the back camera (false
) or the front one (true
).
Events
The scanResult
event is triggered once a barcode has been scanned. The event
instance associated with this is a ScanResultEventData
defined as follows:
export interface ScanResultEventData extends EventData {
/** The event name, always `scanResult` */
eventName: ScanResultEvent,
/** The `BarcodeScannerView` source of this event */
object: BarcodeScannerView,
/** The `BarcodeFormat` of the scanned barcode */
format: BarcodeFormat;
/** The text contained in the scanned barcode */
text: string;
}
Clearing results
The BarcodeScannerView
will not emit a scanResult
event once it detects the
same barcode. To clear the last result and be notified of the same barcode, you
can call the clearScanResult()
method on its instance.
barcodeScannerView.on('scanResult', (result: ScanResultEventData) => {
// do something with the result and then clear it,
// allowing it to be reported it once more
result.object.clearScanResult()
})
Dismissal
Make sure that the BarcodeScannerView
's own disposeNativeView()
is called
to release the camera and barcode-scanning resources
Image Parsing
In some cases (e.g. simulators) it might be necessary to simulate the scanning of a barcode using an image stored on the device.
While this library doesn't support picking images (see the wonderful
@nativescript/imagepicker
plugin for a good implementation), it offers function to scan ImageAsset
s.
import { parseBarcodes, BarcodeFormat } from '@juit/nativescript-barcodeview'
const ImageAsset asset = // ... get this with '@nativescript/imagepicker'
parseBarcode(asset, [ BarcodeFormat.QR_CODE ])
.then((result: scanResult) => {
console.log(`Scanned "${event.format}" barcode from image: ${event.text}`)
})
Barcode Formats
| Format | iOS | Android |
| ------------------------- | ------- | ------- |
| AZTEC
| ✓ | ✓ |
| CODABAR
| ✗ | ✓ |
| CODE_128
| ✓ | ✓ |
| CODE_39
| ✓ | ✓ |
| CODE_39_MOD_43
| ✓ | ✗ |
| CODE_93
| ✓ | ✓ |
| DATA_MATRIX
| ✓ | ✓ |
| EAN_13
| ✓ | ✓ |
| EAN_8
| ✓ | ✓ |
| INTERLEAVED_2_OF_5
| ✓ | ✗ |
| ITF_14
| ✓ | ✓ |
| MAXICODE
| ✗ | ✓ |
| PDF_417
| ✓ | ✓ |
| QR_CODE
| ✓ | ✓ |
| RSS_14
| ✗ | ✓ |
| RSS_EXPANDED
| ✗ | ✓ |
| UPC_A
| ✗ | ✓ |
| UPC_E
| ✓ | ✓ |
| UPC_EAN_EXTENSION
| ✗ | ✓ |