#699 Add ML Kit support (Barcode format input)

Author: EddyVerbruggen

demo/app/images/faces.jpg

@@ -133,10 +133,8 @@
             <Button row="42" col="0" text="send invitation" tap="{{ sendInvitation }}" class="button button-invites"/>
             <Button row="42" col="1" text="get invitation" tap="{{ getInvitation }}" class="button button-invites"/>
 
-            <Label row="43" colSpan="2" text="ML Kit" class="subtitle"/>
+            <Label row="43" colSpan="2" text="ML Kit" class="subtitle"/-->
 
-            <Button row="44" col="0" text="recognize text" tap="{{ recognizeText }}" class="button button-mlkit"/>
-            <Button row="44" col="1" text="scan barcodes" tap="{{ scanBarcode }}" class="button button-mlkit"/-->
 
 
 
@@ -148,6 +146,7 @@
                 row="2"
                 colSpan="2"
                 class="barcodescanner"
+                formats="QR_CODE, EAN_13"
                 scanResult="onBarcodesScanResult" />
 
             <!--FirebaseMLKitFaceDetection:MLKitFaceDetection
@@ -168,6 +167,10 @@
             <!--<Label row="4" col="1" text="If all above 70%, the image is shown here." textWrap="true" visibility="{{ lastMatch ? 'collapsed' : 'visible' }} " />-->
             <!--<Image row="4" col="1" src="{{ lastMatch }}" visibility="{{ lastMatch ? 'visible' : 'collapsed' }} " />-->
 
+            <Button row="5" col="0" text="recognize text" tap="{{ recognizeText }}" class="button button-mlkit"/>
+            <Button row="5" col="1" text="scan barcodes" tap="{{ scanBarcode }}" class="button button-mlkit"/>
+            <Button row="6" col="0" text="detect faces" tap="{{ detectFaces }}" class="button button-mlkit"/>
+
 
 
 

demo/app/main-page.xml

@@ -8,8 +8,9 @@ import { ImageSource } from "tns-core-modules/image-source";
 
 import * as firebase from "nativescript-plugin-firebase";
 
-import { MLKitScanBarcodesResult } from "nativescript-plugin-firebase/mlkit/barcodescanning";
+import { BarcodeFormat, MLKitScanBarcodesResult } from "nativescript-plugin-firebase/mlkit/barcodescanning";
 import { MLKitRecognizeTextResult } from "nativescript-plugin-firebase/mlkit/textrecognition";
+import { MLKitDetectFacesResult } from "nativescript-plugin-firebase/mlkit/facedetection";
 
 const firebaseWebApi = require("nativescript-plugin-firebase/app");
 
@@ -406,7 +407,6 @@ export class HelloWorldModel extends Observable {
             image: img
           }).then(
               (result: MLKitRecognizeTextResult) => {
-                console.log("ML Kit result: " + JSON.stringify(result));
                 alert({
                   title: `Result from ${path}:`,
                   message: JSON.stringify(result.features),
@@ -426,10 +426,10 @@ export class HelloWorldModel extends Observable {
     img.fromFile(path)
         .then(() => {
           firebase.mlkit.barcodescanning.scanBarcodes({
-            image: img
+            image: img,
+            formats: [BarcodeFormat.QR_CODE, BarcodeFormat.EAN_13]
           }).then(
               (result: MLKitScanBarcodesResult) => {
-                console.log("ML Kit result: " + JSON.stringify(result));
                 alert({
                   title: `Result from ${path}:`,
                   message: JSON.stringify(result.barcodes),
@@ -443,6 +443,28 @@ export class HelloWorldModel extends Observable {
         .catch(err => console.log("Error in scanBarcode: " + err));
   }
 
+  public detectFaces(): void {
+    const path = "~/images/faces.jpg";
+    const img = new ImageSource();
+    img.fromFile(path)
+        .then(() => {
+          firebase.mlkit.facedetection.detectFaces({
+            image: img
+          }).then(
+              (result: MLKitDetectFacesResult) => {
+                alert({
+                  title: `Result from ${path}:`,
+                  message: JSON.stringify(result.faces),
+                  okButtonText: "OK"
+                });
+              }, errorMessage => {
+                console.log("ML Kit error: " + errorMessage);
+              }
+          );
+        })
+        .catch(err => console.log("Error in detectFaces: " + err));
+  }
+
   public doSetAnalyticsUserProperty(): void {
     firebase.analytics.setUserProperty({
       key: "origin", // note that this needs to be preregistered, see https://support.google.com/firebase/answer/6317519?hl=en&ref_topic=6317489#create-property

demo/app/main-view-model.ts

@@ -5,10 +5,18 @@ import { BarcodeFormat, MLKitBarcodeScanner as MLKitBarcodeScannerBase } from ".
 
 declare const com: any;
 
+export { BarcodeFormat };
+
 export class MLKitBarcodeScanner extends MLKitBarcodeScannerBase {
 
   protected createDetector(): any {
-    return getBarcodeDetector();
+    let formats: Array<BarcodeFormat>;
+    if (this.formats) {
+      formats = [];
+      const requestedFormats = this.formats.split(",");
+      requestedFormats.forEach(format => formats.push(BarcodeFormat[format.trim().toUpperCase()]))
+    }
+    return getBarcodeDetector(formats);
   }
 
   protected createSuccessListener(): any {
@@ -43,21 +51,10 @@ export class MLKitBarcodeScanner extends MLKitBarcodeScannerBase {
 }
 
 function getBarcodeDetector(formats?: Array<BarcodeFormat>): any {
-  if (formats) {
-    const nativeFormats: Array<any> = [];
-    formats.forEach(format => {
-      format === BarcodeFormat.AZTEC && nativeFormats.push(com.google.firebase.ml.vision.barcode.FirebaseVisionBarcode.FORMAT_AZTEC);
-      format === BarcodeFormat.CODABAR && nativeFormats.push(com.google.firebase.ml.vision.barcode.FirebaseVisionBarcode.FORMAT_CODABAR);
-      format === BarcodeFormat.QR_CODE && nativeFormats.push(com.google.firebase.ml.vision.barcode.FirebaseVisionBarcode.FORMAT_QR_CODE);
-      // TODO other formats..
-    });
-
-    console.log("formats: " + JSON.stringify(formats));
-    console.log("nativeFormats: " + JSON.stringify(nativeFormats));
-
+  if (formats && formats.length > 0) {
     const firebaseVisionBarcodeDetectorOptions =
         new com.google.firebase.ml.vision.barcode.FirebaseVisionBarcodeDetectorOptions.Builder()
-            .setBarcodeFormats(nativeFormats)
+            .setBarcodeFormats(formats[0], formats) // the seconds argument is a varargs.. let's make it easy and just do it like this
             .build();
     return com.google.firebase.ml.vision.FirebaseVision.getInstance().getVisionBarcodeDetector(firebaseVisionBarcodeDetectorOptions);
   } else {
@@ -76,7 +73,7 @@ export function scanBarcodes(options: MLKitScanBarcodesOptions): Promise<MLKitSc
             barcodes: []
           };
 
-          // see https://github.com/firebase/quickstart-android/blob/0f4c86877fc5f771cac95797dffa8bd026dd9dc7/mlkit/app/src/main/java/com/google/firebase/samples/apps/mlkit/textrecognition/TextRecognitionProcessor.java#L62
+          // There are more details available, see https://github.com/firebase/quickstart-android/blob/0f4c86877fc5f771cac95797dffa8bd026dd9dc7/mlkit/app/src/main/java/com/google/firebase/samples/apps/mlkit/textrecognition/TextRecognitionProcessor.java#L62
           for (let i = 0; i < barcodes.size(); i++) {
             const barcode = barcodes.get(i);
             result.barcodes.push({

src/mlkit/barcodescanning/index.android.ts

@@ -4,6 +4,8 @@ import { MLKitCameraView as MLKitBarcodeScannerBase } from "../mlkit-cameraview"
 import { MLKitScanBarcodesOptions, MLKitScanBarcodesResult } from "./index";
 import { MLKitOptions } from "../index";
 
+export { BarcodeFormat };
+
 export class MLKitBarcodeScanner extends MLKitBarcodeScannerBase {
 
   protected createDetector(): any {