Skip to main content

Advanced Configurations

Customization of the Overlays

To customize the appearance of an overlay you can implement a LabelCaptureBasicOverlayListener and/or LabelCaptureAdvancedOverlayListener interface, depending on the overlay(s) you are using.

The method brushForLabel() is called every time a label is captured, and brushForFieldOfLabel() is called for each of its fields to determine the brush for the label or field.

// Create a custom listener class that implements LabelCaptureBasicOverlayListener.
class MyBasicOverlayListener extends LabelCaptureBasicOverlayListener {

Future<Brush?> brushForLabel(LabelCaptureBasicOverlay overlay, CapturedLabel label) async {
// Use a transparent brush for the label itself.
return null;
}


Future<Brush?> brushForFieldOfLabel(
LabelCaptureBasicOverlay overlay, LabelField field, CapturedLabel label) async {
if (field.name == 'Barcode') {
// Highlight barcode fields with a cyan color.
return Brush(
Color.fromRGBO(0, 255, 255, 0.5),
Color.fromRGBO(0, 255, 255, 0.5),
0,
);
}

if (field.name == 'Expiry Date') {
// Highlight expiry date fields with an orange color.
return Brush(
Color.fromRGBO(255, 165, 0, 0.5),
Color.fromRGBO(255, 165, 0, 0.5),
0,
);
}

// Use transparent brush for other fields.
return null;
}


void didTapLabel(LabelCaptureBasicOverlay overlay, CapturedLabel label) {
// Handle user tap gestures on the label.
}
}

// Create the overlay and set the listener.
final overlay = LabelCaptureBasicOverlay(labelCapture);
overlay.listener = MyBasicOverlayListener();
tip

You can also use LabelCaptureBasicOverlay.setLabelBrush() and LabelCaptureBasicOverlay.setCapturedFieldBrush() to configure the overlay if you don't need to customize the appearance based on the name or content of the fields.

Advanced Overlay

For more advanced use cases, such as adding custom views or implementing Augmented Reality (AR) features, you can use the LabelCaptureAdvancedOverlay. The example below creates an advanced overlay, configuring it to display a styled warning message below expiry date fields when they’re close to expiring, while ignoring other fields.

final advancedOverlay = LabelCaptureAdvancedOverlay(labelCapture);
dataCaptureView.addOverlay(advancedOverlay);

advancedOverlay.listener = MyAdvancedOverlayListener();

Implement LabelCaptureAdvancedOverlayListener as a concrete class. The widgetForCapturedLabel and widgetForCapturedLabelField callbacks must return a LabelCaptureAdvancedOverlayWidget subclass (or null to show nothing):

class MyAdvancedOverlayListener extends LabelCaptureAdvancedOverlayListener {

Future<LabelCaptureAdvancedOverlayWidget?> widgetForCapturedLabel(
LabelCaptureAdvancedOverlay overlay, CapturedLabel capturedLabel) async {
return null; // We only care about specific fields
}


Future<Anchor> anchorForCapturedLabel(
LabelCaptureAdvancedOverlay overlay, CapturedLabel capturedLabel) async {
return Anchor.center;
}


Future<PointWithUnit> offsetForCapturedLabel(
LabelCaptureAdvancedOverlay overlay, CapturedLabel capturedLabel) async {
return PointWithUnit(DoubleWithUnit(0, MeasureUnit.pixel), DoubleWithUnit(0, MeasureUnit.pixel));
}


Future<LabelCaptureAdvancedOverlayWidget?> widgetForCapturedLabelField(
LabelCaptureAdvancedOverlay overlay, LabelField labelField) async {
if (labelField.name.toLowerCase().contains("expiry") &&
labelField.type == LabelFieldType.text) {
final daysUntilExpiry = daysUntilExpiryFunction(labelField.text); // Your method
const dayLimit = 3;

if (daysUntilExpiry < dayLimit) {
// Return your custom LabelCaptureAdvancedOverlayWidget subclass here
}
}
return null;
}


Future<Anchor> anchorForCapturedLabelField(
LabelCaptureAdvancedOverlay overlay, LabelField labelField) async {
return Anchor.bottomCenter;
}


Future<PointWithUnit> offsetForCapturedLabelField(
LabelCaptureAdvancedOverlay overlay, LabelField labelField) async {
return PointWithUnit(DoubleWithUnit(0, MeasureUnit.dip), DoubleWithUnit(22, MeasureUnit.dip));
}
}

Validation Flow

How It Works

The Validation Flow provides a guided label scanning experience. An always-present checklist shows users exactly which fields have been captured and which are still missing, making the scanning process transparent and efficient. Scanning is the fastest way to capture all label content — whether all fields are visible at once or spread across different sides of a package.

The fields shown in the checklist are driven by your Label Definition — the configuration that tells Label Capture which fields to recognize and extract. See the Label Definitions guide for details on how to set them up.

The Validation Flow overlay is a UI component built on top of Label Capture. To use it, create a LabelCaptureValidationFlowOverlay and add it to your data capture view.

Single-Step ScanMulti-Step Scan
All fields are visible togetherFields on different sides of the package
Single-step scan capturing all fields at onceMulti-step scan capturing fields from different sides
final validationFlowOverlay = LabelCaptureValidationFlowOverlay(labelCapture);
dataCaptureView.addOverlay(validationFlowOverlay);

// Set the listener
validationFlowOverlay.listener = MyValidationFlowListener();

Define a Listener

When the user has verified that all fields are correctly captured and presses the finish button, the Validation Flow triggers a callback with the final results. To receive these results, implement the LabelCaptureValidationFlowOverlayListener interface:

class MyValidationFlowListener extends LabelCaptureValidationFlowListener {

void didCaptureLabelWithFields(List<LabelField> fields) {
String? barcodeData;
String? expiryDate;

for (final field in fields) {
if (field.name == "<your-barcode-field-name>") {
barcodeData = field.barcode?.data;
} else if (field.name == "<your-expiry-date-field-name>") {
expiryDate = field.text;
}
}

// Handle the captured values
}
}

Required and Optional Fields

The Validation Flow clearly indicates which fields must be captured and which are optional. Required fields are visually highlighted and the flow can only be completed once all of them have been successfully scanned or manually entered. Optional fields are shown but do not block the user from finishing.

Required FieldOptional Field
Must be captured to finish the flowDoes not block finishing
Required fields must be captured to finishOptional fields do not block finishing

Typing Hints

If neither on-device nor cloud-based scanning can capture a field, the user can always manually enter the value. To make manual input easier and reduce errors, you can configure placeholder text (typing hints) that show the expected format directly in the input field.

Typing hints showing expected input format

The field name in the label definition is used as the reference for setting placeholder text:

final validationFlowOverlaySettings = LabelCaptureValidationFlowSettings();
validationFlowOverlaySettings.setPlaceholderTextForLabelDefinition("Expiry Date", "MM/DD/YYYY");

validationFlowOverlay.applySettings(validationFlowOverlaySettings);

Customization

All text in the Validation Flow overlay can be adjusted to match your application's needs. This is useful for localization, adapting terminology, or removing text entirely for a minimal interface.

Buttons

The text on the restart, pause, and finish buttons can be customized or removed entirely.

English (Default)Custom LanguageCompany SlangNo Text
Button text in EnglishButton text in SpanishButton text in FrenchButtons with no text
final validationFlowOverlaySettings = LabelCaptureValidationFlowSettings();
validationFlowOverlaySettings.restartButtonText = "Borrar todo";
validationFlowOverlaySettings.pauseButtonText = "Pausar";
validationFlowOverlaySettings.finishButtonText = "Finalizar";

validationFlowOverlay.applySettings(validationFlowOverlaySettings);

Toasts

Toast messages appear at the top of the camera preview to inform the user about a scanning state change. The standby toast is shown when the camera is auto-paused after no label is detected for a long time. The validation toast shows how many fields have been captured so far after a scan.

StandbyValidation
Standby toast shown when no label is detectedValidation toast showing captured field count
final validationFlowOverlaySettings = LabelCaptureValidationFlowSettings();
validationFlowOverlaySettings.standbyHintText = "No label detected, camera paused";
validationFlowOverlaySettings.validationHintText = "data fields collected"; // X/Y (X fields out of total Y) is shown in front

validationFlowOverlay.applySettings(validationFlowOverlaySettings);

Field

The field state texts are shown inside the input field itself during different phases of scanning.

Invalid InputScanning TextAdaptive Scanning Text
Shown when manual input does not match the expected formatShown while the camera is actively scanningShown while cloud-based recognition is processing
Invalid input state showing error stylingScanning text shown while camera is activeAdaptive scanning text shown during cloud processing
final validationFlowOverlaySettings = LabelCaptureValidationFlowSettings();
validationFlowOverlaySettings.validationErrorText = "Incorrect format.";
validationFlowOverlaySettings.scanningText = "Scan in progress";
validationFlowOverlaySettings.adaptiveScanningText = "Processing";

validationFlowOverlay.applySettings(validationFlowOverlaySettings);

Cloud Fallback

Beta

The Adaptive Recognition API is still in beta and may change in future versions of Scandit Data Capture SDK. To enable it on your subscription, please contact support@scandit.com.

The Adaptive Recognition Engine helps making Smart Label Capture more robust and scalable thanks to its larger, more capable model hosted in the cloud. Whenever Smart Label Capture's on-device model fails to capture data, the SDK will automatically trigger the Adaptive Recognition Engine to capture complex, unforeseen data and process it with high accuracy and reliability — avoiding the need for the user to type data manually.

Cloud fallback using Adaptive Recognition

Enable Adaptive Recognition by setting the mode to .auto on the label definition. This is a single extra line added to your existing label definition configuration:

LabelCaptureSettings _buildLabelCaptureSettings() {
final customBarcode = CustomBarcodeBuilder()
.setSymbologies([Symbology.ean13Upca, Symbology.gs1DatabarExpanded, Symbology.code128])
.isOptional(false)
.build(Constants.fieldBarcode);

final expiryDateText = ExpiryDateTextBuilder()
.setLabelDateFormat(
LabelDateFormat(
LabelDateComponentFormat.mdy,
false, // acceptPartialDates
),
)
.isOptional(false)
.build(Constants.fieldExpiryDate);

final labelDefinition = LabelDefinitionBuilder()
.addCustomBarcode(customBarcode)
.addExpiryDateText(expiryDateText)
.build(Constants.labelRetailItem);
labelDefinition.adaptiveRecognitionMode = AdaptiveRecognitionMode.auto;

var settings = LabelCaptureSettings([labelDefinition]);
return settings;
}

See AdaptiveRecognitionMode for available options.