Advanced Configurations
Customization of the Overlays
Basic Overlay
To customize the appearance of an overlay you can implement a ILabelCaptureBasicOverlayListener and/or ILabelCaptureAdvancedOverlayListener interface, depending on the overlay(s) you are using.
The method BrushForLabel() is called every time a label is captured, and BrushForField() is called for each of its fields to determine the brush for the label or field.
public class BasicOverlayListener : ILabelCaptureBasicOverlayListener
{
private readonly Brush upcBrush = new(
fillColor: UIColor.FromRGB(46, 193, 206), // #2EC1CE
strokeColor: UIColor.FromRGB(46, 193, 206),
strokeWidth: 1f);
private readonly Brush expiryDateBrush = new(
fillColor: UIColor.FromRGB(250, 68, 70), // #FA4446
strokeColor: UIColor.FromRGB(250, 68, 70),
strokeWidth: 1f);
private readonly Brush transparentBrush = Brush.TransparentBrush;
/*
* Customize the appearance of the overlay for the individual fields.
*/
public Brush? BrushForField(
LabelCaptureBasicOverlay overlay,
LabelField field,
CapturedLabel label)
{
return field.Name switch
{
"<your-barcode-field-name>" => this.upcBrush,
"<your-expiry-date-field-name>" => this.expiryDateBrush,
_ => null
};
}
/*
* Customize the appearance of the overlay for the full label.
* In this example, we disable label overlays by returning a transparent brush.
*/
public Brush? BrushForLabel(
LabelCaptureBasicOverlay overlay,
CapturedLabel label)
{
return this.transparentBrush;
}
public void OnLabelTapped(
LabelCaptureBasicOverlay overlay,
CapturedLabel label)
{
/*
* Handle the user tap gesture on the label.
*/
}
}
// Set the listener on the overlay
overlay.Listener = new BasicOverlayListener();
You can also use LabelCaptureBasicOverlay.LabelBrush, LabelCaptureBasicOverlay.CapturedFieldBrush, and LabelCaptureBasicOverlay.PredictedFieldBrush properties 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.
// Create an advanced overlay that allows for custom views to be added over detected label fields
// This is the key component for implementing Augmented Reality features
var advancedOverlay = LabelCaptureAdvancedOverlay.Create(labelCapture);
// Add the overlay to the data capture view
dataCaptureView.AddOverlay(advancedOverlay);
// Configure the advanced overlay with a listener that handles AR content creation and positioning
advancedOverlay.Listener = new AdvancedOverlayListener();
public class AdvancedOverlayListener : ILabelCaptureAdvancedOverlayListener
{
// This method is called when a label is detected - we return null since we're only adding AR elements to specific fields, not the entire label
public UIView? ViewForCapturedLabel(
LabelCaptureAdvancedOverlay overlay,
CapturedLabel capturedLabel)
{
return null;
}
// This defines where on the detected label the AR view would be anchored
public Anchor AnchorForCapturedLabel(
LabelCaptureAdvancedOverlay overlay,
CapturedLabel capturedLabel)
{
return Anchor.Center;
}
// This defines the offset from the anchor point for the label's AR view
public PointWithUnit OffsetForCapturedLabel(
LabelCaptureAdvancedOverlay overlay,
CapturedLabel capturedLabel,
UIView view)
{
return new PointWithUnit(0f, 0f, MeasureUnit.Pixel);
}
// This method is called when a field is detected in a label
public UIView? ViewForCapturedLabelField(
LabelCaptureAdvancedOverlay overlay,
LabelField labelField)
{
// We only want to create AR elements for expiry date fields that are text-based
if (labelField.Name.ToLower().Contains("expiry") && labelField.Type == LabelFieldType.Text)
{
//
// data extraction from expiry date field and days until expiry date calculation
//
// Check if scanned expiry date is too close to actual date
var daysUntilExpiry = CalculateDaysUntilExpiry(labelField.Text);
var dayLimit = 3;
if (daysUntilExpiry < dayLimit)
{
// Create and configure the AR element - a UILabel with appropriate styling
// This view will appear as an overlay on the camera feed
var label = new UILabel
{
Text = "Item expires soon!",
Font = UIFont.SystemFontOfSize(14f),
TextColor = UIColor.White,
BackgroundColor = UIColor.Red
};
label.Layer.CornerRadius = 4f;
label.Layer.MasksToBounds = true;
// Add some padding
label.SizeToFit();
var frame = label.Frame;
frame.Width += 32;
frame.Height += 16;
label.Frame = frame;
return label;
}
}
// Return null for any fields that aren't expiry dates, which means no AR overlay
return null;
}
// This defines where on the detected field the AR view should be anchored
// BottomCenter places it right below the expiry date text for better visibility
public Anchor AnchorForCapturedLabelField(
LabelCaptureAdvancedOverlay overlay,
LabelField labelField)
{
return Anchor.BottomCenter;
}
// This defines the offset from the anchor point
public PointWithUnit OffsetForCapturedLabelField(
LabelCaptureAdvancedOverlay overlay,
LabelField labelField,
UIView view)
{
return new PointWithUnit(0f, 22f, MeasureUnit.Dip);
}
private int CalculateDaysUntilExpiry(string? expiryDateText)
{
// Parse the expiry date and calculate days remaining
// Implementation depends on your date format
return 0; // placeholder
}
}
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 Scan | Multi-Step Scan |
|---|---|
| All fields are visible together | Fields on different sides of the package |
![]() | ![]() |
// Create the overlay
var validationFlowOverlay = LabelCaptureValidationFlowOverlay.Create(
labelCapture,
dataCaptureView
);
// Set the listener to receive validation events
validationFlowOverlay.Listener = new ValidationFlowListener();
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 ILabelCaptureValidationFlowListener interface:
public class ValidationFlowListener : ILabelCaptureValidationFlowListener
{
// This is called by the validation flow overlay when a label has been fully captured and validated
public void OnValidationFlowLabelCaptured(IList<LabelField> fields)
{
string? barcodeData = null;
string? expiryDate = null;
foreach (var 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;
}
}
// Process the captured and validated data
}
}
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 Field | Optional Field |
|---|---|
| Must be captured to finish the flow | Does 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 |
|---|
![]() |
The field name in the label definition is used as the reference for setting placeholder text:
var validationFlowOverlaySettings = LabelCaptureValidationFlowSettings.Create();
validationFlowOverlaySettings.SetPlaceholderText("MM/DD/YYYY", "Expiry Date");
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 Language | Company Slang | No Text |
|---|---|---|---|
var validationFlowOverlaySettings = LabelCaptureValidationFlowSettings.Create();
validationFlowOverlaySettings.RestartButtonText = "Borrar todo";
validationFlowOverlaySettings.PauseButtonText = "Pausar";
validationFlowOverlaySettings.FinishButtonText = "Finalizar";
validationFlowOverlay.ApplySettings(validationFlowOverlaySettings);




