1. Vision SDK
  2. Flutter

Vision SDK

Flutter

Overview

A Flutter plugin package for seamless integration of the Flutter Vision SDK into your Flutter applications. This package provides features for scanning barcodes, QR codes, and text, along with OCR (Optical Character Recognition) support. Customize scan and capture modes to meet your specific needs.

Getting Started

Import the package and use it in your app. You can visit the following link to see details about the package and version history.

        import 'package:fluttervisionsdkplugin/fluttervisionsdkplugin.dart';

Usage

Here's an example of how to use the NativeViewWidget in your Flutter application:

        class VisionSDKView extends StatefulWidget {
  const VisionSDKView({super.key});

  @override
  State<VisionSDKView> createState() => VisionSDKState();
}

class VisionSDKState extends State<VisionSDKView> {
  MyPluginToFlutterCommunicator receiver = MyPluginToFlutterCommunicator();
  FlutterToPluginCommunicator? sender;

  @override
  Widget build(BuildContext context) {
    return NativeViewWidget(
      environment: Environment.sandbox,
      listener: receiver,
      onViewCreated: (FlutterToPluginCommunicator sender) {
        this.sender = sender;
        this.sender?.startCamera();
      },
    );
  }
}

class MyPluginToFlutterCommunicator extends PluginToFlutterCommunicator {
  @override void onCameraStarted() {}
  @override void onCameraStopped() {}
  @override void onScanError(String error) {}
  @override void onCodesReceived(List<String> codes) {}
  @override void onDetectionResult(bool isText, bool isBarcode, bool isQrCode) {}
  @override void onImageCaptured(Uint8List byteArrayImage, List<String> codes) {}
  @override void onOnDeviceConfigureProgress(double progress) {}
  @override void onOnDeviceConfigurationComplete() {}
  @override void onOnlineSLResult(Map<String, dynamic> result) {}
  @override void onOnlineBOLResult(Map<String, dynamic> result) {}
  @override void onOnDeviceOCRResult(Map<String, dynamic> result) {}
}

User can set capture modes to Barcode, QRCode or OCR as following:

          void setCaptureMode(FlutterToPluginCommunicator? sender) {
    sender?.setCaptureModeBarcode();
    // OR
    sender?.setCaptureModeQrCode();
    // OR
    sender?.setCaptureModeOCR();
  }

User can set scan modes to Auto or Manual as following:

          void setCaptureMode(FlutterToPluginCommunicator? sender) {
    sender?.setScanMode(1); // Auto
    // OR
    sender?.setScanMode(2); // Manual
  }

In order to detect Barcode or QRCode in Manual mode, use the following function:

          void capture(FlutterToPluginCommunicator? sender) {
    sender?.capturePhoto();
  }

  // You will get results in the following callback:
  @override void onCodesReceived(List<String> codes) {
    print(codes);
  }

In order to perform OCR processes in Manual mode, use the following function:

          void capture(FlutterToPluginCommunicator? sender) {
    sender?.capturePhoto();
  }

  // You will get the captured image in byte array form and any barcodes detected in that image in the following callback:
  @override void onImageCaptured(Uint8List byteArrayImage, List<String> codes) {

  }

Shipping Label API

After an image is captured, you can send it to our cloud service for further logistics processing like extracting data from a shipping label. You can do that using the following methods:

          void makeShippingLabelAPICall(FlutterToPluginCommunicator? sender, Uint8List byteArrayImage, List<String> codes) {
    sender?.callOcrApi(
          apiKey: 'YOUR_API_KEY_HERE',
          // OR
          token: 'YOUR_TOKEN_HERE',
          image: base64Image,
          barcodes: codes
        );
  }

  // You will get the response from API in following functions:
  @override void onOnlineSLResult(Map<String, dynamic> result) {

  }

  // Or in case of any error:
  @override void onScanError(String error) {

  }

Bill of Lading API

After an image is captured, you can send it to our cloud service for further logistics processing like extracting data from a bill of lading. You can do that using the following methods:

          void makeBillOfLadingAPICall(FlutterToPluginCommunicator? sender, Uint8List byteArrayImage, List<String> codes) {
    sender?.callBolApi(
          apiKey: 'YOUR_API_KEY_HERE',
          // OR
          token: 'YOUR_TOKEN_HERE',
          image: base64Image,
          barcodes: codes);
  }

  // You will get the response from API in following functions:
  @override void onOnlineBOLResult(Map<String, dynamic> result) {

  }

  // Or in case of any error:
  @override void onScanError(String error) {

  }

On-Device Shipping Label

After an image is captured, you can extract shipping label information from it using our On-Device image processing AI powered capabilities, without the requirement of Internet. In order to do that, firstly you need to call the following function to load the AI related files before image processing actually begins:

          void configureOnDeviceSLModel(FlutterToPluginCommunicator? sender) {
    sender?.configureOnDeviceOCR(
          apiKey: 'YOUR_API_KEY_HERE',
          // OR
          token: 'YOUR_TOKEN_HERE',
          modelClass: ModelClass.shippingLabel,
          modelSize: ModelSize.large);
  }

Note that currently only ModelClass.shippingLabel is supported and only ModelSize.micro or Model.large are available.

You will get its progress and completion callbacks in the following function:

          @override void onOnDeviceConfigureProgress(double progress) {
    // Progress goes from 0.0 to 1.0
  }

  @override void onOnDeviceConfigurationComplete() {
    // At this point, model configuration has been completed.
  }

  // Or in case of any error:
  @override void onScanError(String error) {

  }

After model configuration has been completed, you can send the Base64 image to the following function to extract Shipping Label information from it:

          void getShippingLabelInfoOffline(FlutterToPluginCommunicator? sender, Uint8List byteArrayImage, List<String> codes) {
  sender?.getPredictions(base64Image, codes);
}

// You will get the response in following functions:
@override void onOnDeviceOCRResult(Map<String, dynamic> result) {
  
}

// Or in case of any error:
@override void onScanError(String error) {

}

iOS Documentation

To see the iOS documentation you can visit Here to see the details of each feature and their configuration parameters

Android Documentation

To see the Android documentation you can visit Here to see the details of each feature and their configuration parameters

Additional information

Users can import this package and integrate it into their Flutter projects to enable barcode and QR code scanning with customizable modes. This package provides a simple and efficient way to leverage the power of the Flutter Vision SDK in your applications.

For ios installation you need to install the pods again

For android add the below code in setting.gradle:

        dependencyResolutionManagement {
    repositories {
        google()
        mavenCentral()
        maven { url "https://jitpack.io" }
    }
}

Add the below line in android->build.gradle-> inside repositories and all projects.

        maven { url "https://jitpack.io" }

Set the below versions minSdkVersion 29 targetSdkVersion 34 in android->app->build.gradle.

Report an Issue

VisionSDK contains internal error reporting mechanism if it faces any issue. Furthermore, if you get a response from On-Device models, that you consider to be incorrect, then you can report it using the following function:

        void reportAnIssue(
  FlutterToPluginCommunicator? sender,
  String? apiKey,
  String? token,
  required ModelClass modelClass,
  required ModelSize modelSize,
  required String report,
  Map<String, dynamic>? customData,
  String? base64ImageToReportOn
) {
    sender?.reportAnIssue(
      apiKey: apiKey,
      token: tokem
      modelClass: modelClass,
      modelSize: modelSize,
      report: report,
      customData: customData,
      base64ImageToReportOn: base64ImageToReportOn
    );
  }

  // You will get the response in following functions:
  @override void onReportResult(Map<ReportResult, String> reportResult) {
    switch (reportResult.keys.first) {
      
      case ReportResult.successful:
        // Case where report was submitted successfully.
        break;
        
      case ReportResult.savedForLater:
        // Case where report was saved to be submitted later.
        // NOTE: Saved reports will be submitted by VisionSDK automatically.
        break;
        
      case ReportResult.failed:
        // Case where report submission faced an error. These reports needs to be submitted again.
        val errorMessage = reportResult.values.first;
        break;
        
    }
  }
Previous <- React Native