Skip to main content

UI Components

Ready-To-Use UI Components​

The Ready-To-Use UI (RTU-UI) Components are a set of easy-to-integrate and customizable high-level UI components (UIViewControllers) for the most common tasks:

  • Document Scanner v2 - SBSDKUI2DocumentScannerController
  • Document Scanner - SBSDKUIDocumentScannerViewController (Deprecated)
  • Barcode and QR-Code Scanner v2 - SBSDKUI2BarcodeScannerViewController
  • Barcode and QR-Code Scanner - SBSDKUIBarcodeScannerViewController (Deprecated)
  • Batch Barcode Scanner - SBSDKUIBarcodesBatchScannerViewController (Deprecated)
  • Document Data Extractor - SBSDKUIDocumentDataExtractorViewController
  • Machine-Readable Zone Scanner - SBSDKUIMRZScannerViewController
  • Medical Certificates Scanner - SBSDKUIMedicalCertificateScannerViewController
  • Text Pattern Scanner - SBSDKUITextPatternScannerViewController
  • Health Insurance Card Scanner - SBSDKUIHealthInsuranceCardRecognizerViewController (Deprecated, please use SBSDKUIDocumentDataExtractorViewController)
  • Check Scanner - SBSDKUICheckScannerViewController
  • VIN Scanner - SBSDKUIVINScannerViewController
  • Finder Document Scanner - SBSDKUIFinderDocumentScannerViewController (Deprecated)
  • Cropping v2 - SBSDKUI2CroppingViewController
  • Cropping - SBSDKUICroppingViewController (Deprecated)

The design and behavior of these ready-to-use UIViewControllers are based on our many years of experience as well as the feedback from our SDK customers.

Customization​

You can customize the look and behavior of our RTU-UI components with regard to the following characteristics:

  • UI: You can customize all colors and text resources (localization).
  • Behavior: You can enable or disable features like Multi Page, Auto Snapping, and Flashlight.
  • Use in workflows of your app: e.g. Your Main Screen => Scanbot Document Scanner Screen => Your Custom Review Screen => Scanbot Cropping Screen => Your Custom Document Handling.

Please note: The main idea of the RTU UI is to provide simple-to-integrate and simple-to-customize UIViewController components. Due to this idea, there are some limitations to the possibilities of customization. If you need more customization options you have to implement custom UIViewControllers using our Classic UI components.

RTU UI Example App​

Please see the project DocumentScannerRTUUIExample in our GitHub repository scanbot-sdk-example-ios.

Classic UI Components​

Our Classic Components allow you to build your own flexible and fully customizable UI components. These building blocks are easy to integrate and customize and can be used in your UIViewControllers to implement the most common tasks:

  • Document Scanner - SBSDKDocumentScannerViewController
  • Barcode and QR-Code Scanner - SBSDKBarcodeScannerViewController
  • Document Data Extractor - SBSDKDocumentDataExtractorViewController
  • Machine-Readable Zone Scanner - SBSDKMRZScannerViewController
  • Medical Certificates Scanner - SBSDKMedicalCertificateScannerViewController
  • Text Pattern Scanner - SBSDKTextPatternScannerViewController
  • Health Insurance Card Scanner - SBSDKHealthInsuranceCardRecognizerViewController (Deprecated, please use SBSDKDocumentDataExtractorViewController)
  • Check Scanner - SBSDKCheckScannerViewController
  • Cropping - SBSDKImageEditingViewController
  • Credit Card Scanner - SBSDKCreditCardScannerViewController

General programming guide​

Usage and initialization​

The design pattern that Classic UI components are used with is called 'Embedded Child View Controller': you create your own subclass of UIViewController and in its viewDidLoad method you initialize the desired Scanbot SDK Classic UI component by calling its designated initializer and passing your view controller instance as the parent view controller.

Typically, your view controller class also acts as the delegate for the Scanbot SDK Classic component. Additionally, you can specify a view to which the component's view should be added as a subview. This may be your view controller's view (for full size) as well as any of its (smaller) subviews for a more sophisticated layout.

After creating the component's instance, you may configure it to make it work as you see fit.

The final step is the implementation of the component's delegation protocol to receive the scanned results, respond to special events, or make behavioral decisions.

Configuration​

All Scanbot SDK Classic UI component classes derive from SBSDKBaseScannerViewController. This abstract base class encapsulates all of the shared functionality, e.g.

  • Camera device with preview
  • Viewfinder
  • Zooming
  • Energy management
  • Capturing still images
  • Flashlight control
  • Focus locking
  • Overlay views
  • View layout
  • User interface orientation handling

Each Classic UI component can make use of these features. Additionally, each component has its own properties and delegation protocol which are dedicated to the specific use case of the component.

Some of the features are accessible using functions and properties of SBSDKBaseScannerViewController directly, e.g. flashlight control, focus locking, camera device selection, zoom control, and still image capturing.

Complex features with multiple properties are gathered into configuration objects:

  • SBSDKBaseScannerGeneralConfiguration
  • SBSDKBaseScannerZoomConfiguration
  • SBSDKBaseScannerEnergyConfiguration
  • SBSDKBaseScannerViewFinderConfiguration

These configuration objects are accessible using the component's instances copy properties generalConfiguration, zoomConfiguration, energyConfiguration and viewFinderConfiguration.

Important note: Do not modify a configuration object directly. Since it is a copy of the component's configuration, this will have no effect. Instead, get a copy of the desired configuration object, modify it to your taste, and use the component's setter to apply the changes.

Example of how to configure these common configuration objects​
Common Classic UI configurations example
loading...

What do you think of this documentation?

On this page

Scroll to top