Google Vision API - To draw graphic layout on Camera Preview bounding the QR code

Question

I am integrating Google vision API into my existing android application. the app does recognises the QR codes but i need to implement the UI feature where the user is shown a graphic outline over the bar code .

Answer 1

This code sample includes showing a graphic outline over the barcode:

https://github.com/googlesamples/android-vision/tree/master/visionSamples/barcode-reader/app/src/main/java/com/google/android/gms/samples/vision/barcodereader

The association from the detector to the graphics is made like this:

    mGraphicOverlay = (GraphicOverlay<BarcodeGraphic>) findViewById(R.id.graphicOverlay);

    // A barcode detector is created to track barcodes.  An associated multi-processor instance
    // is set to receive the barcode detection results, track the barcodes, and maintain
    // graphics for each barcode on screen.  The factory is used by the multi-processor to
    // create a separate tracker instance for each barcode.
    BarcodeDetector barcodeDetector = new BarcodeDetector.Builder(context).build();
    BarcodeTrackerFactory barcodeFactory = new BarcodeTrackerFactory(mGraphicOverlay);
    barcodeDetector.setProcessor(
            new MultiProcessor.Builder<>(barcodeFactory).build());

GraphicOverlay is included with the code sample above. This utility makes it easy to add graphic objects that are rendered on top of the camera preview. See the code here:

https://github.com/googlesamples/android-vision/blob/master/visionSamples/barcode-reader/app/src/main/java/com/google/android/gms/samples/vision/barcodereader/ui/camera/GraphicOverlay.java

In this example, the barcode factory manages the creation of a graphics object that draws a rectangle and label for a detected barcode. See the BarcodeGraphic class defined here:

https://github.com/googlesamples/android-vision/blob/master/visionSamples/barcode-reader/app/src/main/java/com/google/android/gms/samples/vision/barcodereader/BarcodeGraphic.java