Using the New Google ML Kit Document Scanner for Flutter Apps

Written by bensonarafat | Published 2024/04/17
Tech Story Tags: flutter | google-mk-kit | document-scanner | dart | google | machine-learning | flutter-plugins | flutter-development-tools

TLDRThe Document Scanner is a new feature in the Google MLKit Flutter package. It allows users to convert physical documents into digital formats. It is not yet supported for iOS and is currently in Beta mode. The plugin is available on the development branch but not on the master branch yet.via the TL;DR App

If you are here, that means you must have seen my PR from the Google MLKit Flutter package, which was merged recently. If you have not, you can check it out here #605.

Google ML Kit for Flutter

The Google Machine Language Kit for Flutter is a set of Flutter plugins that enable Flutter apps to use Google’s standalone ML Kit. Presently, 13 plugins are available, most commonly face detectiontext recognitionbarcode scanningselfie segmentation, and so on.

So, let’s talk about the new plugin Document Scanner.

Digitizing physical documents, which allows users to convert physical documents into digital formats, has become a very common user journey in mobile apps. The Document Scanner provides a solution with high-quality, orderly UI flow across Android Apps. You can apply filters, remove stains and shadows, and crop documents.

Read more #here.

Some of the key capabilities are:

  • High-quality and consistent user interface for digitizing physical documents.
  • Automatic capture with document detection.
  • No camera permission is needed from your app.

Note: Document Scanner is not yet support for iOS and is currently on Beta mode

Using the package on your flutter app is much easy as you think. you just have to add the plugin yo your pubspec.yaml as followed:

dependencies:
  google_mlkit_document_scanner: ^0.2.0

Or you can run this command on your terminal to add the package

flutter pub add google_mlkit_document_scanner

We cannot go ahead with using the package in our app.

Create an instance of the DocumentOption class.

DocumentScannerOptions options = DocumentScannerOptions(
      mode: ScannerMode.filter, // to control the feature sets in the flow
      isGalleryImport: false, // importing from the photo gallery
      pageLimit: 1, // setting a limit to the number of pages scanned
 );

  1. Mode is to change the scanner mode, which can be ScannerMode*.fullScannerMode.filter or ScannerMode.base*

  2. IsGalleryImport if you want to allow gallery import set to true

  3. pageLimit to set the number of pages scanned

  4. DocumentFormat to be retrieved after the scanned, which can be in **jpeg or pdf

    Create an instance of the DocumentScanner class and pass the options.

 DocumentScanner documentScanner = DocumentScanner(
    options: options
  );

Create a List to store the path of the scanned documents.

List<String>? documents;

Don’t forget to dispose.

  @override
  void dispose() {
    documentScanner.close();
    super.dispose();
  }

To start the scan, all you have to do is call the scanDocument method like so.

  documents = await documentScanner.scanDocument();

Easy-peasy, now the documents list contains the paths to the document scanned.

You can get all code sources from below

https://github.com/bensonarafat/document_scanner?source=post_page-----e3d978ef2957--------------------------------&embedable=true

If you have any questions or issues, please add them to the comment section.

I’m open to discussing any Flutter project opportunities, big or small. Also, feel free to follow me on Twitter @bensonarafat for updates and stay connected.

Adios! 👋


Written by bensonarafat | Software engineer by day, software engineer by night
Published by HackerNoon on 2024/04/17