Search code examples
fluttercameragoogle-mlkit

Rectangular box to scan/analyze on the camera preview with Flutter Google-ml-kit Text Recognition


There's an example app using on-device Text Recognition of Google ML Kit: https://github.com/bharat-biradar/Google-Ml-Kit-plugin/tree/master/example

I'm using the "text recognition" part of that example app in my app and it works good. The only thing I need to do but can't do is that I want to show a rectangular box on the camera preview and only want to recognize texts inside this box. Other parts of the preview should be ignored. Otherwise, all the text in the preview would be recognized which is bad for my use case.

It's easy to show a rectangular box on the camera preview but I don't know how to only analyze the part in that rectangular box instead of the whole preview. Any help please?


Solution

  • There are two ideas you can consider:

    (1) Crop your camera preview down to only the rectangular box and feed that cropped image to the ML Kit API. (2) ML Kit's Text Recognition API returns a bounding box on Android (and frame on iOS). You can use that to determine if any of the text recognition results falls into or overlaps with your rectangular box. Depending on your use case and the input image, this approach may not be ideal since it can return text recognition result for text not entirely inside your rectangle.