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 as easy as you think, but firstly, you need to take note of these points because, presently, this feature has not been added to the master branch but on the development branch and has not been published on pub.dev yet.

This article will be updated immediately once it is done.

To add the plugin to your pubspec.yaml, you copy the following code and paste it as a dependencies

dependencies:
  google_mlkit_document_scanner:
    git:
      url: https://github.com/flutter-ml/google_ml_kit_flutter.git
      ref: feature/doc_scanner 
      path: packages/google_mlkit_document_scanner

Wait, hold on! ⚠️ , what is this ?🤔 Let me explain

You can easily add a package right from git.

git here says this package is found using Git, and the url after that is the Git URL that can be used to clone the package. ref here is the name of the branch path, which means the path of the package

Note: I will update this when the package is made available on pub.dev

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