Migrate from Barcode Scanner 5.x
Scandit Data Capture SDK 6.0 introduces all new APIs that are not backwards compatible with apps using ScanditSDK 5.x. To migrate your code to SDK 6.0 and newer, you will need to modify your app. This guide will assist you in performing this migration. In case you are unsure about how to perform the migration or the feature you are using is not covered in this migration guide, please reach out to us. We will gladly assist you in the upgrade process.
Before you start…
Replace the BarcodePicker
In 5.x, the BarcodePicker (SBSBarcodePicker on iOS) was the central class that manages recognition, renders the video preview and provides means to configure what barcodes get scanned. In 6.0 and newer, there is no direct equivalent to the BarcodePicker. Instead this functionality is covered by multiple classes:
The DataCaptureContext is the central object that manages the data capture/recognition process.
The Camera class wraps the native camera on Web.
The DataCaptureView displays the camera preview as well as augmentations on top of the camera preview.
In your app you will need to use all of these classes to implement the functionality offered by the BarcodePicker. The following couple of lines show you how to do this. Take a look at Before You Start for more details, or check out one of our barcode capture samples.
import * as SDCCore from "scandit-web-datacapture-core"; import * as SDCBarcode from "scandit-web-datacapture-barcode"; // Create data capture context. context = await SDCCore.DataCaptureContext.create(); // The device camera will serve as a frame source. camera = SDCCore.Camera.default; await context.setFrameSource(camera); // See below for differences between 5.x and 6.x. const settings = new SDCBarcode.BarcodeCaptureSettings(); settings.enableSymbology(SDCBarcode.Symbology.EAN13UPCA, true); barcodeCapture = await SDCBarcode.BarcodeCapture.forContext(context, settings); // Add a listener to get informed whenever a new barcode is recognized. barcodeCapture.addListener(listener) view = await SDCCore.DataCaptureView.forContext(context); // Connect the data capture view to the HTML element, so it can fill up its size and follow its position. view.connectToElement(element);
Start/Stop the Capture Process
In 5.x the scan process was started by calling resumeScanning on the BarcodePicker. In 6.0+, the equivalent functionality is to switch the frame source from off to on and to enable the capture mode. Capture modes are enabled by default, the first line to enable the capture mode is only required when you are reusing a previously disabled data capture mode.
await barcodeCapture.setEnabled(true); await camera.switchToDesiredState(SDCCore.FrameSourceState.On);
To pause the barcode capture process, simply call BarcodeCapture.setEnabled() passing false (without turning the camera off). To resume the capture process, call BarcodeCapture.setEnabled() passing true.
To stop the barcode capture process and turn the camera off, disable the capture mode and turn the camera off, as shown below:
await barcodeCapture.setEnabled(false); await camera.switchToDesiredState(SDCCore.FrameSourceState.Off);
Barcode Scanner Changes Between 5.x and 6.0+
The default code duplicate filter has been changed from 500ms to 0ms. This means that a barcode that gets scanned in two consecutive scans will get reported twice. When you pause/stop the scanning as soon as one code gets scanned, the code duplicate filtering setting does not affect you. However if you continue scanning further codes without pausing/stopping recognition, you may want to change the BarcodeCaptureSettings.codeDuplicateFilter property back to 500ms.
EAN13 and UPCA used to be separate symbologies in 5.x but have now been merged into one symbology called Symbology.EAN13UPCA.
The leading zero of UPCA codes is no longer removed by default. If you rely on this behavior in your app, you can either remove the leading zero yourself, or enable the “remove_leading_upca_zero” extension:
The Scanner class functionality is not provided anymore.
Migrate the Scan UI
Without any further configuration, the default UI renders the “Scanning by Scandit” logo in the bottom-right corner of the data capture view. To replicate the default look from 5.x, you need to create a viewfinder. This functionality is only available for barcode capture, but not barcode tracking (MatrixScan).
Enable the Rectangular Viewfinder
To enable the rectangular viewfinder (previously called the default viewfinder), use the following lines of code:
const overlay = await SDCBarcode.BarcodeCaptureOverlay.withBarcodeCaptureForView(barcodeCapture, view); const viewfinder = new SDCCore.RectangularViewfinder(); await overlay.setViewfinder(viewfinder); await view.addOverlay(overlay);
To change the size of the viewfinder using sizes relative to the data capture view (same as in 5.x), you can use the following lines of code:
viewfinder.setSize(new Scandit.SizeWithUnit( new SDCCore.NumberWithUnit(0.8, SDCCore.MeasureUnit.Fraction), new SDCCore.NumberWithUnit(0.4, SDCCore.MeasureUnit.Fraction) ));
Enable the Laserline Viewfinder
To enable the laserline viewfinder use the following lines of code:
const overlay = await SDCBarcode.BarcodeCaptureOverlay.withBarcodeCaptureForView(barcodeCapture, view); const viewfinder = new SDCCore.LaserlineViewfinder(); await overlay.setViewfinder(viewfinder);
To change the width of the laserline relative to the data capture view (same as in 5.x), you can use the following line of code:
viewfinder.width = new SDCCore.NumberWithUnit(0.8, Scandit.MeasureUnit.Fraction);