fluttervisionsdkplugin 0.0.8

A Flutter plugin package for integrating the Flutter Vision SDK into your Flutter application for scanning Barcodes and QrCodes

Flutter Vision SDK Plugin

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.

Features

Scan barcodes, QR codes, and text. Optical Character Recognition (OCR) support. Flexible customization of scan and capture modes.

Getting started

import the package and use it in your app.

import 'package:fluttervisionsdkplugin/fluttervisionsdkplugin.dart';

Usage

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

     NativeViewWidget(
                onScanError: _onScanError,
                onCodesReceived: _onCodesReceived,
                onDetectionResult: _onDetectionResult,
                onOCRImagesReceived: _onOCRImagesReceived,
                apiKey:
                    'key_stag_00203c56428WHECda5Hfu53dFQj2gJrJDMmD14FYyfRmkewE5vE66aydykdDZYbnzauGcC9Pz3v2D3pK',
                environment: Environment.qa,
                onViewCreated: (communicator) =>
                    this.communicator = communicator,
                listener: MainNativeViewWidgetListener(this),
                shouldDisplayFocusImage: true,
                shouldScanInFocusImageRect: true,
                onDetected: onDetected,
                isTextIndicationOn: true,
                isBarCodeOrQRCodeIndicationOn: true,
                selectionTintColor: 'white',
                imageTintColor: 'white',
                codeDetectionConfidence: 0.5,
                sessionPreset: 'high',
                nthFrameToProcess: 10,
                captureMode: 0,
                captureType: 0,
                scanMode: 0,
                focusImage: '',
                focusImageRect: const {
                  'x': 0,
                  'y': 0,
                  'height': 0,
                  'width': 0,
                }),

User can make the Barcode or Qrcode window customizable by giving values here :

focusImageRect: const {
                  'x': 0,
                  'y': 0,
                  'height': 0,
                  'width': 0,
                }

This will show us either the detected type is Text, QrCode or BarCode:

                Text(
                      'Detected Type: $scannedType',
                      style: const TextStyle(color: Colors.black, fontSize: 16),
                    ),

This will show us the scanned code from barCode and QrCode:

                Text(
                'Scanned Code: $scannedCode',
                style:
                const TextStyle(color: Colors.black, fontSize: 16),
                ),

This will change the scanning mode to Auto:

                        Platform.isIOS
                            ? ElevatedButton(
                                onPressed: () {
                                  const NativeViewWidget()
                                      .onPressChangeCaptureMode('auto');
                                },
                                child: const Text('Auto'),
                              )
                            : Expanded(
                                child: RadioListTile(
                                    value: true,
                                    title: const Text('Auto'),
                                    groupValue: isAutoScanning,
                                    onChanged: (i) {
                                      setState(() {
                                        isAutoScanning = true;
                                      });
                                      communicator?.setScanMode(1);
                                      updateCaptureMode(false);
                                    }),
                              ),

This will change the scanning mode to Manual:

                        Platform.isIOS
                            ? ElevatedButton(
                                onPressed: () {
                                  const NativeViewWidget()
                                      .onPressChangeCaptureMode('manual');
                                  updateCaptureMode(true);
                                },
                                child: const Text('Manual'),
                              )
                            : Expanded(
                                child: RadioListTile(
                                    value: false,
                                    title: const Text('Manual'),
                                    groupValue: isAutoScanning,
                                    onChanged: (i) {
                                      setState(() {
                                        isAutoScanning = false;
                                      });
                                      communicator?.setScanMode(2);
                                      updateCaptureMode(true);
                                    }),
                              ),

This will change the Scan Mode to Barcode:

                         Platform.isIOS
                            ? ElevatedButton(
                                onPressed: () {
                                  const NativeViewWidget()
                                      .onPressChangeScanMode('barcode');
                                },
                                child: const Text('Barcode'),
                              )
                            : Expanded(
                                flex: 1,
                                child: RadioListTile(
                                    value: 1,
                                    title: const Text('Barcode'),
                                    groupValue: scanMode,
                                    onChanged: (i) {
                                      setState(() {
                                        scanMode = 1;
                                      });
                                      communicator?.setCaptureModeBarcode();
                                    }),
                              ),

This will change the Scan Mode to QR:

                         Platform.isIOS
                            ? ElevatedButton(
                                onPressed: () {
                                  const NativeViewWidget()
                                      .onPressChangeScanMode('qrcode');
                                },
                                child: const Text(' QR Code'),
                              )
                            : Expanded(
                                flex: 1,
                                child: RadioListTile(
                                    value: 2,
                                    title: const Text('Qrcode'),
                                    groupValue: scanMode,
                                    onChanged: (i) {
                                      setState(() {
                                        scanMode = 2;
                                      });
                                      communicator?.setCaptureModeQrCode();
                                    }),
                              ),

This will change the Scan Mode to OCR:

                          Expanded(
                            flex: 1,
                            child: RadioListTile(
                                value: 3,
                                title: const Text('OCR'),
                                groupValue: scanMode,
                                onChanged: (i) {
                                  setState(() {
                                    scanMode = 3;
                                  });
                                  communicator?.setCaptureModeOCR();
                                }),
                          ),
                        Platform.isIOS
                            ? ElevatedButton(
                                onPressed: () {
                                  const NativeViewWidget()
                                      .onPressChangeScanMode('ocr');
                                },
                                child: const Text('OCR'),
                              )

Parameters

• onScanError: - This method is called when an error occurs in any stage of initializing or capturing the codes when there is none detected.

• onCodesReceived: - This method returns with the codes scanned after successful scan

• onDetectionResult: - This method is called when text, barcode or qr code is detected in the camera stream. Values depend on whether text or code indication is enabled while configuring the scanner view.

• onOCRImagesReceived: - This method is called when capturePhoto() method is called in OCR Mode. It return with the captured image from camera stream, all the detected codes in it, and an optional cropped document image if a document is detected with in the captured image.

• environment: - You can set environment from here.

• focusImage: UIImage - Image to be displayed in the centre if the view. If not provided, VisionSDK will use the default image. Note that focus rectangle frame is subject to change with respect to different scan modes.

• focusImageRect: CGRECT - Custom rect for the focus image. You can provide your preferred rect or use .zero for default. Note that default focus rectangle frame is subject to change with respect to different scan modes.

• shouldDisplayFocusImage: Bool - set true if you need focused region to be drawn.

• shouldScanInFocusImageRect: Bool - set true if you want to detect codes visible in focused region only. This will discard the codes detected to be outside of the focus image.

• imageTintColor: UIColor - Set the tint color of the focus image. Note that the image that you may provide in focusImage: UIImage property is loaded with rendering mode of .alwaysTemplate. So you need to provide the color of the focus image. Default value is UIColor.white

• selectionTintColor: UIColor- Set the tint color of the focus image to use when code is detected. Depending on the properties scanMode and shouldScanInFocusImageRect, the focus image displayed can change the tint color when a code is detected. Default value is UIColor.white

• isTextIndicationOn: Bool - Set false if you do not want to detect text in live camera feed. If set false codeScannerViewDidDetect(\_ text: Bool, barCode: Bool, qrCode: Bool) method will send text parameter as false.

• isBarCodeOrQRCodeIndicationOn: Bool - Set false if you do not want to detect bar codes or qrcodes in live camera feed. Using this proerty my be helpful in cases if you want to perform manual capture based on code detection.

• sessionPreset: Session.Preset - You can set session preset as per your requirement. Default is .high.

• nthFrameToProcess: Int - This is the nth number of the frame that is processed for detection of text, barcodes, and qrcodes in live camera feed if enabled by isTextIndicationOn or isBarCodeOrQRCodeIndicationOn. Processing every single frame may be costly in terms of CPU usage and battery consumption. Default value is 10 which means that from camera stream of usual 30 fps, every 10 frame is processed. Its value should be set between 1 - 30.

• captureMode - Defines whether the VisionSDK should capture codes automatically or not. If you want to capture code on user action, then set it to .manual. Default value is .auto. If otherwise, you will have to manually trigger scanning using capturePhoto() method.

• captureType - Set it to .multiple if you want to allow multiple results from scan. In .manual case, you will have to manually trigger scanning using capturePhoto() method.

• codeDetectionConfidence: Float - You can set the minimum confidence level for codes detected. Those below the given value will be dicarded. Value must be set on the scale of 0 - 1. Default is 0.5.

• scanMode - Defines the scan mode. It has following options

  • .barCode - Detects barcodes only in this mode
  • .qrCode - Detects qr codes only in this mode
  • .ocr - Use this mode to capture photos for later user in OCR API call.
  • .autoBarCodeOrQRCode - Detects both bar codes and qr codes

Native Doccumentation

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 21 targetSdkVersion 33 in android->app->build.gradle.