Check Scanner UI | Cordova Document Scanner

The Scanbot SDK provides the ability to detect various types of checks in an image, crop them and recognize data fields via the Check Scanner.

Currently, the Check Scanner supports the following types of checks:

• USACheck - a check compatible with the ASC X9 standard used in the USA
• FRACheck - a check format commonly used in France
• KWTCheck - a check format commonly used in Kuwait
• AUSCheck - a check compatible with the Australian Paper Clearing System check standard
• INDCheck - a check compatible with the CTS-2010 standard issued by the Reserve Bank of India in 2012

Integrating the Check Scanner UI

import ScanbotSdk, { CheckRecognizerConfiguration } from 'cordova-plugin-scanbot-sdk';

private SDK = ScanbotSdk.promisify();

// Always make sure you have a valid license on runtime via SDK.getLicenseInfo()
if (!licenseCheckMethod()) { return; }

const configs: CheckRecognizerConfiguration = {
  // Customize colors, text resources, behavior, etc..
  enableCameraButtonTitle: 'Enable Camera',
  interfaceOrientation: 'PORTRAIT',
  finderLineColor: '#0000ff',
  // see further configs ...
};

const result = await this.SDK.UI.startCheckRecognizer({uiConfigs: configs});

if (result.status === 'CANCELED') {
  // user has canceled the scanning operation
  return;
}

// handle the extracted data
// result.fields.accountNumber
// result.fields.chequeNumber
// ...

Handling the Result

interface CheckRecognizerResult {
    checkType?: CheckType;
    imageUri?: string;
    status?: CheckRecognizerResultStatus;
    fields?: CheckRecognizerFields;
}

The result object contains the following fields:

• checkType: CheckType may be one of the following check types 'USACheck', 'FRACheck', 'KWTCheck', 'AUSCheck', 'INDCheck', or 'UnknownCheck'.
• status: 'SUCCESS' if data was extracted or 'FAIL' if the operation failed, and 'CANCELED' if the user canceled the operation (tapped on the "cancel" button).
• fields An object with extracted data fields.
• imageUri: string An object with extracted data fields.

The fields property will be of type CheckRecognizerFields. According to checkType, fields will be one of the interfaces below:

type CheckRecognizerFields =
    USACheckResult
    | FRACheckResult
    | KWTCheckResult
    | AUSCheckResult
    | INDCheckResult
    | UnknownCheckResult
    ;

USACheckResult contains the following properties:

interface USACheckResult {
  fontType?: CheckRecognizerField;
  rawString?: CheckRecognizerField;
  accountNumber?: CheckRecognizerField;
  auxiliaryOnUs?: CheckRecognizerField;
  transitNumber?: CheckRecognizerField;
}

FRACheckResult contains the following properties:

interface FRACheckResult {
  fontType?: CheckRecognizerField;
  rawString?: CheckRecognizerField;
  accountNumber?: CheckRecognizerField;
  chequeNumber?: CheckRecognizerField;
  routingNumber?: CheckRecognizerField;
}

KWTCheckResult contains the following properties:

interface KWTCheckResult {
  fontType?: CheckRecognizerField;
  rawString?: CheckRecognizerField;
  accountNumber?: CheckRecognizerField;
  chequeNumber?: CheckRecognizerField;
  sortCode?: CheckRecognizerField;
}

AUSCheckResult contains the following properties:

interface AUSCheckResult {
  fontType?: CheckRecognizerField;
  rawString?: CheckRecognizerField;
  accountNumber?: CheckRecognizerField;
  auxDomestic?: CheckRecognizerField;
  bsb?: CheckRecognizerField;
  extraAuxDomestic?: CheckRecognizerField;
  transactionCode?: CheckRecognizerField;
}

INDCheckResult contains the following properties:

interface INDCheckResult {
  fontType?: CheckRecognizerField;
  rawString?: CheckRecognizerField;
  accountNumber?: CheckRecognizerField;
  serialNumber?: CheckRecognizerField;
  sortNumber?: CheckRecognizerField;
  transactionCode?: CheckRecognizerField;
}

UnknownCheckResult contains the following properties:

interface UnknownCheckResult {
  fontType?: CheckRecognizerField;
  rawString?: CheckRecognizerField;
}

CheckRecognizerField contains the following properties:

interface CheckRecognizerField {
    value?: GenericDocumentField;
    validationStatus?: CheckRecognizerFieldValidationStatus;
}

interface GenericDocumentField {
    text?: string;
    confidence?: number;
}

type CheckRecognizerFieldValidationStatus =
    'Invalid'
    | 'Valid'
    ;

Customization

The UI and the behavior of the Check Scanner can be customized by passing the configs value via CheckRecognizerConfiguration. All configuration options are optional.

interface CheckRecognizerConfiguration {
    /**
     * An optional array of check types that acts as a detection filter.
     * By default all supported document formats will be detected.
     */
    acceptedCheckStandards?: CheckType[];
    /**
    * The preferred camera module (default: BACK).
    */
    cameraModule?: CameraModule;
    /**
    * Background color of the detection overlay.
    */
    cameraOverlayColor?: string;
    /**
     * Title of the cancel button.
     */
    cancelButtonTitle?: string;
    /**
     * Set high-resolution Check image capturing.
     */
    captureHighResolutionImage?: boolean;
    /**
     * Title of the button that opens the screen where the user can allow
     * the usage of the camera by the app.
     */
    enableCameraButtonTitle?: string;
    /**
     * Text that will be displayed when the app
     * is not allowed to use the camera, prompting the user
     * to enable the usage of the camera.
     */
    enableCameraExplanationText?: string;
    /**
     * Aspect ratio of the finder frame (width \ height).
     */
    finderAspectRatio?: FinderAspectRatio;
    /**
     * Foreground color of the detection overlay.
     */
    finderLineColor?: string;
    /**
     * Width of the finder frame border. Default is 2.
     */
    finderLineWidth?: number;
    /**
     * Controls whether the flash should be initially enabled.
     * The default value is FALSE.
     */
    flashEnabled?: boolean;
    /**
     * Orientation lock mode of the UI, the camera preview, and the output images.
     * By default the orientation is not locked.
     */
    interfaceOrientation?: UIInterfaceOrientationMask;
    /**
     * Background color of the top bar.
     */
    topBarBackgroundColor?: string;
    /**
     * Foreground color of the top bar buttons on the scanning screen.
     */
    topBarButtonsColor?: string;
    /**
     * Foreground color of the flash button when the flash is off.
     */
    topBarButtonsInactiveColor?: string;
    /**
     * Controls whether buttons should use all capitals style, as defined by the Android Material Design.
     * Defaults to TRUE.
     * Android only.
     */
    useButtonsAllCaps?: boolean;
    /**
     * The background color of the user guidance hints.
     */
    userGuidanceBackgroundColor?: string;
    /**
     * The text color of the user guidance hints.
     */
    userGuidanceTextColor?: string;
}

Want to scan longer than one minute?

Generate your free "no-strings-attached" Trial License and properly test the Scanbot SDK.

Get your free Trial License

What do you think of this documentation?

What can we do to improve it? Please be as detailed as you like.

---