QR-codes lezen met behulp van de Mobile Vision API

Invoering

QR-codes zijn de afgelopen jaren alomtegenwoordig geworden. Ik weet zeker dat je er een hebt gezien in een krantenadvertentie of op een billboard. In de terminologie zijn QR-codes, net als alle andere barcodes, afbeeldingen die zijn ontworpen om door machines te worden gelezen. Gewoonlijk vertegenwoordigen ze een kleine reeks, zoals een verkorte URL of een telefoonnummer. Hier is een voorbeeld van een QR-code die de URL van de startpagina van Tuts + bevat:

In tegenstelling tot traditionele barcodes, die gespecialiseerde hardware nodig hebben, kunnen QR-codes nauwkeurig worden gelezen door elke smartphone met een fatsoenlijke camera.

De nieuwste versie van de SDK voor Google Play-services bevat de API voor mobiele beeldweergave, waarmee Android-ontwikkelaars heel gemakkelijk apps kunnen maken die in realtime QR-codes kunnen detecteren en lezen. In deze zelfstudie ga ik je helpen ermee aan de slag te gaan.

voorwaarden

Om deze tutorial te volgen, heb je nodig:

  • de nieuwste versie van Android Studio
  • een Android-apparaat met een camera

1. De SDK voor Google Play-services installeren

Voordat u de API voor mobiele beeldverwerking in uw app gebruikt, moet u de Google Play-services SDK 7.8 als een toevoegen compileren afhankelijkheid in uw app module build.gradle.

groovy compile 'com.google.android.gms: afspeelservices: 7.8.0'

Wanneer u op drukt Synchroniseer nu knop, ziet u een fout die er als volgt uitziet:

Klik op de Repository en synchronisatieproject installeren link om de SDK te installeren.

2. Bewerken van het App-manifest

Voeg de volgende regel toe aan uw apps AndroidManifest.xml om de barcodedetectiebibliotheken automatisch te installeren op de apparaten die uw app proberen uit te voeren:

"xml

"

Bovendien moet u, als u de camera van het apparaat gebruikt om de QR-codes vast te leggen, het volgende aanvragen android.permission.CAMERA toestemming.

"xml

"

3. Een QR-code van een foto lezen

Laten we nu een code schrijven die een QR-code kan lezen van een foto die is opgeslagen in uw app's middelen map. Ik ga de foto een naam geven myqrcode.jpg. Als je geen foto's met QR-codes bij de hand hebt, kun je wat krijgen van Flickr.

Stap 1: De foto omzetten in een Bitmap

Omdat de API voor mobiele visie een Bitmap als invoer moet je eerst je foto omzetten in een Bitmap. Om dit te doen, opent u de foto met behulp van de Open methode van de Vermogensbeheerder klasse en sla de InputStream teruggekeerd naar de decodeStream methode van BitmapFactory. Om het simpel te houden, doe het in de onCreate methode van uw Activiteit.

java Bitmap myQRCode = BitmapFactory.decodeStream (getAssets (). open ("myqrcode.jpg"));

Stap 2: Maak een streepjescodendetector

Om QR-codes (en andere soorten streepjescodes) te detecteren, moet u een instantie van de BarcodeDetector klasse. De volgende code laat zien hoe je er een kunt maken met BarcodeDetector.Builder:

java BarcodeDetector barcodeDetector = new BarcodeDetector.Builder (this) .setBarcodeFormats (Barcode.QR_CODE) .build ();

Merk op dat de detector standaard barcodes van alle ondersteunde formaten zal detecteren. Ik heb de setBarcodeFormats methode om expliciet aan te geven dat de detector alleen QR-codes moet detecteren.

Stap 3: Lees de QR-code

Gebruik Frame.Builder om een ​​te maken omlijsting de ... gebruiken Bitmap je hebt eerder gemaakt.

java Frame myFrame = new Frame.Builder () .setBitmap (myQRCode) .build ();

Bel de opsporen methode van de BarcodeDetector om een ​​te genereren SparseArray met alle QR-codes het BarcodeDetector gedetecteerd in uw foto.

java SparseArray barcodes = barcodeDetector.detect (myFrame);

Elk item van de SparseArray bevat een Barcode voorwerp. Om de onbewerkte inhoud van de QR-code op te halen, kunt u de Barcode voorwerpen ruwe waarde veld. Ik raad echter aan dat u de gemakkelijker te lezen gebruikt displayValue veld in plaats daarvan. Hier is een code die de inhoud van de eerste QR-code die de API heeft gedetecteerd, afdrukt:

"java // Controleer of er ten minste één streepjescode is gedetecteerd als (barcodes.size ()! = 0)

// Druk het bericht Log.d van de QR-code af ("My QR Code's Data", barcodes.valueAt (0) .displayValue); "

Als u uw Activiteit nu zou je het bericht in de QR-code van je foto moeten kunnen zien.

4. Een QR-code lezen met behulp van de camera

De API voor mobiele visie maakt het ook heel gemakkelijk om streepjescodes te detecteren en lezen met behulp van de camera van uw apparaat in realtime. Laten we een nieuwe maken Activiteit dat doet precies dat.

Stap 1: Definieer de lay-out

Maak een nieuw lay-out XML-bestand met de naam activity_main.xml. De lay-out moet een SurfaceView om de voorbeeldkaders weer te geven die door de camera zijn vastgelegd. Als je wilt, kun je ook een toevoegen Tekstweergave om de inhoud van de QR-codes weer te geven die de API detecteert.

Na het gebruik van een Relatieve layout om beide widgets te plaatsen, zou het lay-out XML-bestand er ongeveer zo uit moeten zien:

"xml

"

Stap 2: Maak het Activiteit

Maak een nieuwe Java-klasse met de naam MainActivity.java. Maak er een subklasse van Activiteit en negeer het onCreate methode. Binnen in de onCreate methode, bel setContentView om de lay-out toe te passen die u in de vorige stap hebt gemaakt. Gebruik vervolgens findViewById om verwijzingen naar de widgets te krijgen die in de lay-out zijn gedefinieerd.

"java setContentView (R.layout.activity_main);

cameraView = (SurfaceView) findViewById (R.id.camera_view); barcodeInfo = (TextView) findViewById (R.id.code_info); "

Een stroom afbeeldingen ophalen van de camera van het apparaat en deze weergeven in de SurfaceView, maak een nieuw exemplaar van de CameraSource klasse gebruiken CameraSource.Builder. Omdat het CameraSource heeft behoefte aan een BarcodeDetector, maak er een met behulp van de BarcodeDetector.Builder klasse. Als u wilt, kunt u de afmetingen van het cameravoorbeeld aanpassen met behulp van de setRequestedPreviewSize methode.

"java barcodeDetector = new BarcodeDetector.Builder (this) .setBarcodeFormats (Barcode.QR_CODE) .build ();

cameraSource = nieuwe CameraSource .Builder (this, barcodeDetector) .setRequestedPreviewSize (640, 480) .build (); "

Voeg vervolgens een callback toe aan de SurfaceHolder van de SurfaceView zodat je weet wanneer je de voorbeeldkaders kunt tekenen. De callback zou de. Moeten implementeren SurfaceHolder.Callback interface.

"java cameraView.getHolder (). addCallback (nieuwe SurfaceHolder.Callback () @Overleden openbare ongeldige oppervlakteCreated (SurfaceHolder-houder)

@Override public void surfaceChanged (SurfaceHolder-houder, int-formaat, int-width, int height)  @Override public unfinal surfaceDestroyed (SurfaceHolder-houder) ); "

Binnen in de surfaceCreated methode, bel de begin methode van de CameraSource om de voorbeeldkaders te tekenen. Omdat het begin methode verwacht dat je omgaat met een IOException, je zou het van binnenuit moeten noemen proberen te vangen blok.

java probeer cameraSource.start (cameraView.getHolder ()); catch (IOException ie) Log.e ("CAMERA SOURCE", ie.getMessage ());

Evenzo, binnen de surfaceDestroyed methode, bel de hou op methode van de CameraSource om te stoppen met het tekenen van de voorbeeldkaders.

java cameraSource.stop ();

Jouw Activiteit is bijna klaar. U moet het echter nog wel vertellen BarcodeDetector wat het zou moeten doen als het een QR-code detecteert. Maak een instantie van een klasse die de. Implementeert Detector.Processor interface en geef deze door aan de setProcessor methode van de BarcodeDetector. Android Studio genereert automatisch stubs voor de methoden van de interface.

"java barcodeDetector.setProcessor (nieuwe Detector.Processor() @Override public void release ()

@Override openbare nietige ontvangDetecties (Detector.Detections detecties) ); "

Binnen in de receiveDetections methode, haal de SparseArray van Barcode objecten door de getDetectedItems methode van de Detector.Detections klasse. Je kunt nu de code schrijven om iets te doen met de gedetecteerde QR-codes, omdat ik je al heb laten zien hoe je ermee kunt werken SpareArray objecten eerder in deze tutorial.

Hier ziet u hoe u de QR-codes kunt weergeven displayValue in de Tekstweergave:

"java finale SparseArray barcodes = detections.getDetectedItems ();

if (barcodes.size ()! = 0) barcodeInfo.post (nieuw Runnable () // Gebruik de postmethode van de openbare weergave van TextView () barcodeInfo.setText (// Update de TextView barcodes.valueAt (0 ) .displayValue);); "

Merk op dat u de oproep zou moeten insluiten in de setText methode binnen een oproep naar de post methode van de Tekstweergave, omdat receiveDetections werkt niet op de UI-thread. Als u dit niet doet, leidt dit tot een runtime-fout.

U kunt nu uw app compileren en uitvoeren. Richt de camera van uw apparaat op een QR-code en u zou onmiddellijk de inhoud van de QR-code kunnen zien.

Conclusie

In deze zelfstudie hebt u geleerd om de API voor mobiele beeldverwerking te gebruiken om QR-codes te lezen van statische afbeeldingen en van live camerastreams. Hoewel we in deze tutorial alleen met QR-codes hebben gewerkt, kun je de API ook gebruiken om andere populaire barcodeformaten zoals UPC-A en EAN-13 te lezen.

Als u meer wilt weten over de API voor mobiele beeldverwerking, raad ik u aan de API-documentatie te bezoeken.