Flutter Bridge Introduction

Introducing V0.3 of the Flutter bridge that helps invoking the SDK code of the native Android and iOS. Currently it supports the basic features from both the Android and iOS SDKs.

What's new in V0.4?

• Updated Android SDK version to v1.4.11
• Updated iOS SDK version to v1.1.6
• On iOS: Fixed selfie manual capturing callback function not being called
• On iOS: Adjusted the behaviour of the fallback to manual capturing to match the Android SDK behavior
• Changed toString method of the data models to use json.encode for better data representation
• Added selfieUrl field to the FaceMatchResult
• Added transliteratedBirthGovernorate field to the TransliterationResult
• Fixed manual capturing issue on Android
• Reduced Andorid SDK footprint size (~5.3MB)

Flutter Bridge Supported Features

1- Supported Documents Egyptian ID is the only document supported now in the flutter bridge

2- API Encapsulation Handling API calls for the methods init, extract and match

3- Flow Management Flutter bridge supports the suggestion of the next action to be performed taking into account the error messages from the API and the obtianed license flow

4- Image Capturing Supporting Automatic and Manual image capturing for Egyptian ID and Selfies

Integration

Introduction

We are going to add files to the Android native code, iOS native code and the dart code. You can expect a plugin to make it easier in the near future.

Android Native Side

• Download digified_android_v_0_3.zip from this link

• Unzip the downloaded file and you will find the following content:

  • digified folder: which contains the Kotlin native code of running the SDK on Android
  • digified_layout.xml file: which contains a container to hold the SDK capturing screens

• Add the Native Android code as follows:

  • Add digified folder / package to the project files (Make sure you adjust the imports and package names)
  • Add digified_layout.xml to the res folder
  • Open app build.gradle file and add the following in the dependencies and sync the project

  dependencies {
  	...
  	...
  	implementation 'io.digified:biometric-full:1.4.11'
  }	
  

  • Also make sure your minSdkVersion is above 19 (Digified Android SDK supports a minSdkVersion of 19 and above)
  • In the MainActivity.kt add the following code to register the method channel that will let the dart code communicate with the native code:

    • Make the MainActivity extend FlutterFragmentActivity

    • Create an instance of the Bridge object:

    private val bridge: Bridge = Bridge()
    

    • Override the configureFlutterEngine function and add the following line of code:

    override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)
        bridge.handleChannel(this, flutterEngine)
    }
    

  • Congratulations! you have completed adding the native Android code of the flutter bridge

iOS Native Side

• Download digified_ios_v_0_3.zip from this link
• Unzip the downloaded file and you will fiind the following content:
  • MainFlutterVC.swift: containing the Swift code that is needed for the integration with the native iOS code
  • Podfile: containing the dependencies of the Digified iOS SDK
• Add the Native iOS code as follows:
  • Add Podfile to the ios directory of your project
  • Open the terminal at the ios directory of your project and run the following command

        pod install
    

  • Recommendation: the following steps are recommended to be done using xCode
  • Add MainFlutterVC.swift to the Runner folder
  • Open the Runner folder
  • Open Main.storyboard and set the parameter Class in Custom Class to be MainFlutterVC
  • Open Info.plist to add the following property Privacy - Camera Usage Description to be able to use the Camera for taking Documents pictures and Selfies
  • Click on the Runner project and set the Minimum Deployments for iOS to be 12.0 aslo remember to adjust the Sigining of the app.
  • Congratulations! you have completed adding the native iOS code of the flutter bridge

  Dart Side

  • Download digified_dart_v_0_4.zip from this link
  • Unzip the downloaded file and you will find the following content:
    • digified folder: containg that Dart code that interacts with the Android and iOS native code (Make sure you adjust the imports and package names)
  • Congratualtions you have now added the Android, iOS and Flutter code! Next steps is to check the Flutter Sample Code

Flutter Sample Code

This is based on the Egyptian ID, however the Non-Egyptian ID and the Passport Capturing are similar

• Use the static method Digified.buildAndroidPlatformViewLink() to get a PlatformViewLink that will display the Android capturing screens in Flutter

• Create a Digified Object

  Digified digified = Digified();
  

• Calling digified.initialize to create a session on the Digified API (Note: To be able to use the state machine on the Flutter side, you have to initialize the SDK first)

  digified.initialize(
          baseUrl: YOUR_BASE_URL,
          apiKey: YOUR_API_KEY,
          onSuccess: (initializationResult) {
              // request is successfull, you can find the token in the initializationResult,
              // however, you will not need to use it as it's used internally in the SDK
  	// you should check if initializationResult has errors or not 
  	// using initializationResult.error
          },
          onFailed: (digifiedError) {
              // handle failure, you can check ErrorConstants to know the possible errors
          });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
        //nextActionResult.nextAction should be equal to DigifiedAction.captureDocumentFirst
    });
  

• Capturing the front side of the Egyptian national ID

  digified.capture(
          captureType: DigifiedCaptureType.idFront,
          onCaptured: (captureResult) {
              // we have the captureResult which encapsulate the captured image
  	// you can display it to the user and ask them whether they want
  	// to retake it or not
          },
          onFailed: (digifiedError, captureType) {
              // handle failure, you can check ErrorConstants to know the possible errors
          },
          onCancelled: (captureType) {
              // this method is called if you cancel the capturing using Digified.cancelCapturing()
          },
          onTimeout: () {
              // this methid is called if the timeout for capturing has passed
  	// this is just an indicator for you to assist the user with
  	// instructions dialog for example.
          });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
        //nextActionResult.nextAction should be equal to DigifiedAction.sendDocumentFirst
    });
  

• Sending the front side of the Egyptian national ID

  digified.send<IdExtractionResult>(onResult: (idExtractionResult) {
          // request is successfull, you can find the token in the initializationResult,
  // you can find the data of the ID side you sent in the idExtractionResult
  // you should check if idExtractionResult has errors or not using idExtractionResult.error
      }, onFailure: (digifiedError) {
          // handle failure, you can check ErrorConstants to know the possible errors
      }, onUploadProgress: (captureType, progress) {
          // this will be call while uploading the image to the servers
      }, onUploadingDone: (captureType) {
          // this will be called after the request is send and it's being processed
      });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
        //nextActionResult.nextAction should be equal to DigifiedAction.captureDocumentSecond
    });
  

• Capturing the back side of the Egyptian national ID

  digified.capture(
          captureType: DigifiedCaptureType.idBack,
          onCaptured: (captureResult) {
              // we have the captureResult which encapsulate the captured image
  	// you can display it to the user and ask them whether they want
  	// to retake it or not
          },
          onFailed: (digifiedError, captureType) {
              // handle failure, you can check ErrorConstants to know the possible errors
          },
          onCancelled: (captureType) {
              // this method is called if you cancel the capturing using Digified.cancelCapturing()
          },
          onTimeout: () {
              // this methid is called if the timeout for capturing has passed
  	// this is just an indicator for you to assist the user with
  	// instructions dialog for example.
          });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
        //nextActionResult.nextAction should be equal to DigifiedAction.sendDocumentSecond
    });
  

• Sending the back side of the Egyptian national ID

  digified.send<IdExtractionResult>(onResult: (idExtractionResult) {
          // request is successfull, you can find the token in the initializationResult,
  // you can find the data of the ID side you sent in the idExtractionResult
  // you should check if idExtractionResult has errors or not using idExtractionResult.error
      }, onFailure: (digifiedError) {
          // handle failure, you can check ErrorConstants to know the possible errors
      }, onUploadProgress: (captureType, progress) {
          // this will be call while uploading the image to the servers
      }, onUploadingDone: (captureType) {
          // this will be called after the request is send and it's being processed
      });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
        //nextActionResult.nextAction should be equal to DigifiedAction.captureSelfie
    });
  

• Capturing a selfie of the user

  digified.capture(
          captureType: DigifiedCaptureType.selfie,
          onCaptured: (captureResult) {
              // we have the captureResult which encapsulate the captured image
  	// you can display it to the user and ask them whether they want
  	// to retake it or not
          },
          onFailed: (digifiedError, captureType) {
              // handle failure, you can check ErrorConstants to know the possible errors
          },
          onCancelled: (captureType) {
              // this method is called if you cancel the capturing using Digified.cancelCapturing()
          },
          onTimeout: () {
              // this methid is called if the timeout for capturing has passed
  	// this is just an indicator for you to assist the user with
  	// instructions dialog for example.
          });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
       //nextActionResult.nextAction should be equal to DigifiedAction.sendSelfie
   });
  

• Sending the user's selfie

  digified.send<FaceMatchResult>(onResult: (faceMatchResult) {
          // you can find the scores (congurence and liveness) of the selfie captured
          // you should check if faceMatchResult has errors or not using faceMatchResult.error
      }, onFailure: (digifiedError) {
          // handle failure, you can check ErrorConstants to know the possible errors
      }, onUploadProgress: (captureType, progress) {
          // this will be call while uploading the image to the servers
      }, onUploadingDone: (captureType) {
          // this will be called after the request is send and it's being processed
      });
  

• Using the state machine to know the next action

  digified.getNextAction(onResult: (nextActionResult) {
       //nextActionResult.nextAction should be equal to DigifiedAction.statusReady
   });
  

• Getting the verification result

  digified.getFinalStatus(onResult: (finalStatusResult) {
        // finalStatusResult.status (final statuses can be found in DigifiedConstants.Status)
      });
  

• Congratulations!

Flutter Documentation

You can find the full documentation of the dart code of the flutter bridge through this link