ML Text Recognition

The easy way to use ML Kit for text recognition in Flutter.

ML Kit's text recognition can recognize text in Latin, Chinese, Devanagari, Japanese and Korean scripts and a wide range of languages. They can also be used to automate data-entry tasks such as processing credit cards, receipts, and business cards.

universe

Getting Started

Add dependency to your flutter project:

$ pub add learning_text_recognition

Usage

import 'package:learning_text_recognition/learning_text_recognition.dart';

Input Image

As in other ML vision plugins, input is fed as an instance of InputImage, which is part of package learning_input_image.

You can use widget InputCameraView from learning_input_image as default implementation for processing image (or image stream) from camera / storage into InputImage format. But feel free to learn the inside of InputCameraView code if you want to create your own custom implementation.

Here is example of using InputCameraView to get InputImage for text recognition.

import 'package:learning_input_image/learning_input_image.dart';

InputCameraView(
  canSwitchMode: false,
  mode: InputCameraMode.gallery,
  title: 'Text Recognition',
  onImage: (InputImage image) {
    // now we can feed the input image into text recognition process
  },
)

Text Recognition

After getting the InputImage, we can start doing text recognition by calling method process from an instance of TextRecognition.

// When using for Latin script
TextRecognition textRecognition = TextRecognition();
// or like this:
TextRecognition textRecognition = TextRecognition(
  options: TextRecognitionOptions.Default
);

// When using for Chinese script
TextRecognition textRecognition = TextRecognition(
  options: TextRecognitionOptions.Chinese
);

// When using for Devanagari script
TextRecognition textRecognition = TextRecognition(
  options: TextRecognitionOptions.Devanagari
);

// When using for Japanese script
TextRecognition textRecognition = TextRecognition(
  options: TextRecognitionOptions.Japanese
);

// When using for Korean script
TextRecognition textRecognition = TextRecognition(
  options: TextRecognitionOptions.Korean
);

// Process text recognition...
RecognizedText result = await textRecognition.process(image);

Output

The result of text recognition is a RecognizedText that contains nested elements describing the details of the recognized text from input image. Here is example of structure data inside RecognizedText.

universe

RecognizedText

RecognizedText
Text Wege
der parlamentarischen
Demokratie
Blocks (1 block)

TextBlock

TextBlock 0
Text Wege der parlamentarischen Demokratie
Frame (117.0, 258.0, 190.0, 83.0)
Corner Points (117, 270), (301.64, 258.49), (306.05, 329.36), (121.41, 340.86)
Recognized Language Code de
Lines (3 lines)

TextLine

TextLine 0
Text Wege der
Frame (167.0, 261.0, 91.0, 28.0)
Corner Points (167, 267), (255.82, 261.46), (257.19, 283.42), (168.36, 288.95)
Recognized Language Code de
Elements (2 elements)

TextElement

TextElement 0
Text Wege
Frame (167.0, 263.0, 59.0, 26.0)
Corner Points (167, 267), (223.88, 263.45), (225.25, 285.41), (168.36, 288.95)

Dispose

textRecognition.dispose();

Example Project

You can learn more from example project here.

Libraries

learning_text_recognition