Deprecation warning

Please note that this is outdated documentation for an older release of the Scandit Barcode Scanner SDK.

We encourage you to migrate to 6.x and take advantage of our latest / advanced features and improved performance.

You'll find the updated documentation at: Data Capture SDK Documentation for Xamarin.Android and Data Capture SDK Documentation for Xamarin.iOS

Customizing the Scan User Interface

Customizing the Scandit Scan UI Elements

The Scandit Barcode Scanner has methods to enable/disable/configure the following UI elements (see the API of the ScanditSDKOverlayController for more details):

  • Torch Button (a button to switch the torch on/off)
  • Camera Direction Switch (a button to switch the camera direction)
  • Toolbar (modal view controller only)
  • Sound (to configure the sound when a barcode is decoded)
  • Viewfinder (the white viewfinder target rectangle)

The SBSOverlayController has methods to enable/disable the above UI elements and methods to customize their location in the Scan UI and their appearance.

Add your own UI Elements

There are three different approaches to add your own UI elements to the scan user interface:

  • Add the BarcodePicker as a subview and add additional ui elements as separate views in the view hierarchy.
  • Add subviews to the default ScanOverlay
BarcodePicker picker = new BarcodePicker (ScanSettings.DefaultSettings ());
UIView yourCustomView = new UIView (new CoreGraphics.CGRect(40, 200, 100, 100));
picker.OverlayView.View.AddSubview (yourCustomView);
  • Subclass the ScanOverlay. Create your own class that inherits from ScanOverlay, add your UI elements of choice and set this overlay controller as the picker's overlay via
picker.OverlayView = subclassedOverlayView;