BarcodeScanner Properties

• Class Properties

• Instance Properties

defaultUIElementURL

Get or set the default scanner UI. The default scanner UI is defined in the file dist/dbr.scanner.html. Follow these steps to customize the UI.

defaultUIElementURL = 'url'

Property Value

url string

Tips and Tricks

• Be sure to set defaultUIElementURL before you call createInstance.

singleFrameMode

Get or set the camera mode. If true, single video frames will be used instead of a continuous video stream. It’s especially useful for cameras that lack webcam access (lack of WebRTC support, e.g. Chrome on iOS 14.2 and below).

singleFrameMode = bool;

Property Value

bool boolean

Sample

let scanner = await Dynamsoft.DBR.BarcodeScanner.createInstance();
scanner.singleFrameMode = true; // use singleFrameMode anyway
scanner.show();

Tips and Tricks

• singleFrameMode is based on WebRTC support, not actual camera connection. In other words, if a browser supports WebRTC, it won’t be using singleFrameMode by default even when there is no camera attached.

• By default, when the default UI is used, a camera icon will appear for the singleFrameMode which is defined by a SVG (className is dbrScanner-bg-camera). If you have customized the UI, you will have to provide your own UI implementation for this mode.

soundOnSuccessfulRead

Get or set the sound played when a barcode is read successfully.

soundOnSuccessfulRead = audio

Property Value

audio HTMLAudioElement

Sample

scanner.soundOnSuccessfulRead = new Audio("./pi.mp3");

bPlaySoundOnSuccessfulRead

Set when a sound is played if a barcode is read successfully. Default value is false, which does not play a sound.

Use frame or true to play a sound when any barcode is found within a frame. Use unduplicated to play a sound only when any unique/unduplicated barcode is found within a frame.

scanner.bPlaySoundOnSuccessfulRead = false;

scanner.bPlaySoundOnSuccessfulRead = true;

scanner.bPlaySoundOnSuccessfulRead = "frame";

scanner.bPlaySoundOnSuccessfulRead = "unduplicated";

barcodeFillStyle

Set the style used when filling in the located barcode.

barcodeFillStyle = "rgba(red, green, blue, alpha)"

Property Values

• red number
• green number
• blue number
• alpha number

barcodeStrokeStyle

Set the style of the located barcode border.

barcodeStrokeStyle = "rgba(red, green, blue, alpha)"

Property Values

• red number
• green number
• blue number
• alpha number

regionMaskFillStyle

Set the style used when filling the mask beyond the region.

regionMaskFillStyle = "rgba(red, green, blue, alpha)"

Property Values

• red number
• green number
• blue number
• alpha number

regionMaskStrokeStyle

Set the style of the region border.

regionMaskStrokeStyle = "rgb(red, green, blue)"

Property Values

• red number
• green number
• blue number

onFrameRead

This event is triggered when a single frame has been scanned. The results object contains all the barcode results that the reader was able to decode.

Type Declaration

(results: TextResult[]): void

Parameters

results TextResult[]

Return Value

void

Sample

scanner.onFrameRead = results => {
    for(let result of results){
        console.log(result.barcodeText);
    }
};

Read barcodes from live camera

onPlayed

This event is triggered the camera video stream is played.

Type Declaration

(info: ScannerPlayCallbackInfo): void

Parameters

info ScannerPlayCallbackInfo

Return Value

void

Sample

Read barcodes from live camera

onUnduplicatedRead

This event is triggered when a new, unduplicated barcode is found. txt holds the barcode text result. result contains the actual barcode result, including the text result. Old barcodes will be remembered for duplicateForgetTime.

Type Declaration

(txt: string, result: TextResult): void

Parameters

• txt string
• result TextResult[]

Return Value

void

Sample

scanner.onUnduplicatedRead = (txt, result) => {
    alert(txt);
    console.log(result);
};

Read barcodes from live camera