Skip to main content

Custom UI for the Android MRZ Scanner Module with Jetpack Compose

Overview

The Scanbot SDK now supports a customizable MRZ scanner composable that you can use to build your own MRZ scanner screen using Jetpack Compose. It provides a UI for MRZ scanning with guidance overlays and a camera preview.

The MrzScannerCustomUI provides fully customizable camera controls and features with encapsulated scanning logic.

Adding the feature as a dependency

implementation("io.scanbot:sdk-mrz-assets:$latestSdkVersion")
implementation("io.scanbot:sdk-package-2:$latestVersion")
implementation("io.scanbot:rtu-ui-v2-bundle:$latestSdkVersion") // To use compose components

Integration

  • MrzScannerCustomUI provides fully customizable camera controls and features with encapsulated scanning logic.

Take a look at the mrz-scanner example app to see how to integrate the scanner and the compose-example to see how to build a custom UI using the compose components.

To implement the MRZ Scanner using composables, you need to create a composable layout with MrzScannerCustomUI:

Detailed MRZ Scanner Composable
loading...

To control the scanning process and camera params, use mutable states and pass them to the MrzScannerCustomUI composable:

Mutable states for camera control
loading...

Additionally, you can customize the finder overlay by passing your FinderOverlayConfiguration to the finderConfiguration parameter of the MrzScannerCustomUI composable:

Detailed Finder Configuration
loading...

Want to scan longer than one minute?

Generate a free trial license to test the Scanbot SDK thoroughly.

Get free trial license