How to create an MRZ ID SCANNER with FLUTTER

Christian Ferrer
3 min readJun 21, 2024

--

Machine-Readable Zone (MRZ) is a critical component used in various identification documents, such as passports and ID cards, to encode essential information in a format that can be quickly and accurately read by machines. The MRZ typically consists of two or three lines of text with a fixed structure that includes details like the document number, name, nationality, date of birth, and expiration date.

In this project, I developed an MRZ detection tool using Flutter, leveraging several advanced tools and libraries to achieve efficient and reliable recognition. The core components of this implementation include ML Kit’s Text Recognition API, which is employed to detect and read the MRZ information using regular expressions. Additionally, I utilized Isolate Spawn to manage memory and performance more effectively, ensuring that the application remains responsive even during intensive processing tasks. Lastly, the Camera Awesome package was integrated to facilitate high-quality camera functionality within the Flutter app.

By combining these powerful tools, the application can accurately detect and process MRZ data, providing a seamless experience for users needing to scan and verify identification documents.

  1. Create new app

2. Add dependencies

Theses dependencies are only need in this project

3. Configure our app

You don’t need any special requirements to build this application, just implement what each of these packages asks for (in my case GITHUB is integrated).
In this case, you need the podfile configuration and check the minimal versions

https://pub.dev/packages/google_mlkit_text_recognition#requirements, (for google_ml_kit_commons has the similar requirements)

camerawesome | Flutter package (pub.dev)

4. Starting!

First, the implementation of Camera Awesome in this project

Then we have to add an overlay to the camera, because if we want to see the document better, it doesn’t have to take up the whole screen, just part of it, in the middle.

Secondly, we will use google_ml_kit_text_recognition to implement the algorithm that will help us recognise the MRZ code.

After that, we will create a class that recognises the process of text, in which we have 2 methods:

A. firstDetectingProcess: Detection of first match of MRZ code

B. photoTextProcess: This is where we get the MRZ information. In this case, we need it for the Colombian DNI, so you can implement it for whatever case you need.

If you want to implement this in your application, I recommend using isolate spawn. This allows us to make more efficient use of the phone’s resources.
Finally, to implement isolates, the code must look like this

Run the code and see this is what happens:

Thank you very much for taking the time to read this post, I really appreciate your feedback on how I can improve these posts and myself!

--

--