Objekte in Bildern mit ML Kit erkennen: Android

1. Hinweis

ML Kit ist ein mobiles SDK, mit dem Sie die Expertise von Google im Bereich des geräteinternen maschinellen Lernens in Android- und iOS-Apps nutzen können. Mit den leistungsstarken und dennoch einfach zu verwendenden Vision- und Natural Language-APIs können Sie häufige Probleme in Ihren Apps lösen oder ganz neue Nutzererlebnisse schaffen. Alle basieren auf den erstklassigen ML-Modellen von Google und sind für Sie kostenlos.

Die APIs von ML Kit werden alle auf dem Gerät ausgeführt. Das ermöglicht Echtzeitanwendungen, bei denen Sie beispielsweise einen Live-Kamerastream verarbeiten möchten. Das bedeutet auch, dass die Funktion offline verfügbar ist.

In diesem Codelab erfahren Sie, wie Sie Ihrer vorhandenen Android-App in wenigen Schritten die Objekterkennung und ‑verfolgung (Object Detection and Tracking, ODT) für ein bestimmtes Bild hinzufügen. Bitte beachten Sie, dass in diesem Codelab einige Abkürzungen verwendet werden, um die Verwendung von ML Kit-ODT hervorzuheben.

Umfang

In diesem Codelab erstellen Sie eine Android-App mit ML Kit. Ihre App verwendet die ML Kit Object Detection and Tracking API, um Objekte in einem bestimmten Bild zu erkennen.Am Ende sollte das Ergebnis in etwa so aussehen wie auf dem Bild rechts.

Lerninhalte

  • ML Kit SDK in Ihre Android-App einbinden
  • ML Kit Object Detection and Tracking API

Voraussetzungen

  • Eine aktuelle Version von Android Studio (Version 4.1.2 oder höher)
  • Android Studio-Emulator oder physisches Android-Gerät
  • Der Beispielcode
  • Grundkenntnisse der Android-Entwicklung in Kotlin

In diesem Codelab geht es um ML Kit. Auf irrelevante Konzepte wird nicht genauer eingegangen und entsprechende Codeblöcke können Sie einfach kopieren und einfügen.

2. Einrichten

Code herunterladen

Klicken Sie auf den folgenden Link, um den gesamten Code für dieses Codelab herunterzuladen:

Entpacken Sie die heruntergeladene ZIP-Datei. Dadurch wird ein Stammordner (mlkit-android-main) mit allen erforderlichen Ressourcen entpackt. Für dieses Codelab benötigen Sie nur die Quellen im Unterverzeichnis object-detection.

Das Unterverzeichnis „object-detection“ im Repository „mlkit-android“ enthält zwei Verzeichnisse:

  • android_studio_folder.pngstarter: Der Startcode, auf dem Sie in diesem Codelab aufbauen.
  • android_studio_folder.pngfinal: Der vollständige Code der fertigen Beispiel-App.

3. ML Kit Object Detection and Tracking API zum Projekt hinzufügen

App in Android Studio importieren

Importieren wir zuerst die Starter-App in Android Studio.

Öffnen Sie Android Studio, wählen Sie Import Project (Gradle, Eclipse ADT, etc.) (Projekt importieren (Gradle, Eclipse ADT usw.)) aus und wählen Sie den Ordner starter aus dem Quellcode aus, den Sie zuvor heruntergeladen haben.

7c0f27882a2698ac.png

Abhängigkeiten für ML Kit Object Detection and Tracking hinzufügen

Mit den ML Kit-Abhängigkeiten können Sie das ML Kit ODT SDK in Ihre App einbinden. Fügen Sie die folgenden Zeilen am Ende der Datei app/build.gradle Ihres Projekts hinzu:

build.gradle

dependencies {
  // ...
  implementation 'com.google.mlkit:object-detection:16.2.4'
}

Projekt mit Gradle-Dateien synchronisieren

Damit alle Abhängigkeiten für Ihre App verfügbar sind, sollten Sie Ihr Projekt jetzt mit Gradle-Dateien synchronisieren.

Wählen Sie in der Android Studio-Symbolleiste Sync Project with Gradle Files ( b451ab2d04d835f9.png) aus.

Wenn diese Schaltfläche deaktiviert ist, importieren Sie nur starter/app/build.gradle , nicht das gesamte Repository.

4. Start-App ausführen

Nachdem Sie das Projekt in Android Studio importiert und die Abhängigkeiten für die ML Kit-Objekterkennung und ‑Verfolgung hinzugefügt haben, können Sie die App zum ersten Mal ausführen.

Verbinden Sie Ihr Android-Gerät über USB mit Ihrem Host oder starten Sie den Android Studio-Emulator und klicken Sie in der Android Studio-Symbolleiste auf Ausführen ( execute.png).

App ausführen und ausprobieren

Die App sollte auf Ihrem Android-Gerät gestartet werden. Es enthält etwas Boilerplate-Code, mit dem Sie ein Foto aufnehmen oder ein voreingestelltes Bild auswählen und es in eine Pipeline zur Objekterkennung und ‑verfolgung einfügen können, die Sie in diesem Codelab erstellen. Sehen wir uns die App genauer an, bevor wir Code schreiben.

Unten befindet sich ein Button ( c6d965d639c3646.png), mit dem Sie Folgendes tun können:

  • die in Ihr Gerät/Ihren Emulator integrierte Kamera-App aufrufen
  • ein Foto in der Kamera App aufnehmen
  • Empfangen des aufgenommenen Bildes in der Startanwendung
  • Bild anzeigen

Probieren Sie die Schaltfläche Foto aufnehmen aus, folgen Sie der Anleitung, um ein Foto aufzunehmen, bestätigen Sie das Foto und sehen Sie es sich in der Starter-App an.

Wiederholen Sie die ersten beiden Schritte einige Male, um zu sehen, wie es funktioniert:

9ec541980dbe2d31.png 8312dde41425ba4b.png fa8492bfc1914ff0.png

Zweitens stehen drei voreingestellte Bilder zur Auswahl. Sie können diese Bilder später verwenden, um den Code zur Objekterkennung zu testen, wenn Sie einen Android-Emulator verwenden.

Wählen Sie ein Bild aus den drei voreingestellten Bildern aus. Prüfen Sie, ob das Bild in der größeren Ansicht angezeigt wird:

1dd41b3ec978f1d9.png

5. On-Device-Objekterkennung hinzufügen

In diesem Schritt fügen Sie der Starter-App die Funktion hinzu, Objekte in Bildern zu erkennen. Wie Sie im vorherigen Schritt gesehen haben, enthält die Starter-App Boilerplate-Code zum Aufnehmen von Fotos mit der Kamera-App auf dem Gerät. Außerdem gibt es in der App drei voreingestellte Bilder, mit denen Sie die Objekterkennung testen können, wenn Sie das Codelab in einem Android-Emulator ausführen.

Wenn Sie ein Bild ausgewählt haben, entweder aus den voreingestellten Bildern oder indem Sie mit der Kamera-App ein Foto aufgenommen haben, wird das Bild durch den Boilerplate-Code in eine Bitmap-Instanz decodiert, auf dem Bildschirm angezeigt und die Methode runObjectDetection mit dem Bild aufgerufen.

In diesem Schritt fügen Sie der Methode runObjectDetection Code für die Objekterkennung hinzu.

Objekterkennung auf dem Gerät für ein Bild einrichten und ausführen

Die Einrichtung von ML Kit ODT ist ganz einfach und erfordert nur drei Schritte mit drei APIs:

  • Bild vorbereiten: InputImage
  • Erstellen Sie ein Detektorobjekt: ObjectDetection.getClient(options)
  • Verbinde die beiden Objekte oben: process(image)

Sie erreichen dies in der Funktion runObjectDetection(bitmap: Bitmap) in der Datei MainActivity.kt.

/**
 * ML Kit Object Detection Function
 */
private fun runObjectDetection(bitmap: Bitmap) {
}

Derzeit ist die Funktion leer. Fahren Sie mit den folgenden Schritten fort, um ML Kit ODT zu implementieren. Android Studio fordert Sie dann auf, die erforderlichen Importe hinzuzufügen:

  • com.google.mlkit.vision.common.InputImage
  • com.google.mlkit.vision.objects.ObjectDetection
  • com.google.mlkit.vision.objects.defaults.ObjectDetectorOptions

Schritt 1: InputImage erstellen

ML Kit bietet eine einfache API zum Erstellen eines InputImage aus einem Bitmap. Anschließend können Sie ein InputImage in die ML Kit-APIs einfügen.

// Step 1: create ML Kit's InputImage object
val image = InputImage.fromBitmap(bitmap, 0)

Fügen Sie den oben stehenden Code am Anfang von runObjectDetection(bitmap:Bitmap) ein.

Schritt 2: Detektorinstanz erstellen

ML Kit folgt dem Builder-Entwurfsmuster. Sie übergeben die Konfiguration an den Builder und rufen dann einen Detektor ab. Es gibt drei Konfigurationsoptionen (die Optionen in Fettdruck werden in diesem Codelab verwendet):

  • Detektormodus (einzelnes Bild oder Stream)
  • Erkennungsmodus (einzelne oder mehrere Objekterkennung)
  • Klassifizierungsmodus (aktiviert oder deaktiviert)

In diesem Codelab geht es um die Erkennung und Klassifizierung mehrerer Objekte in einem einzelnen Bild. Fügen Sie das jetzt hinzu:

// Step 2: acquire detector object
val options = ObjectDetectorOptions.Builder()
   .setDetectorMode(ObjectDetectorOptions.SINGLE_IMAGE_MODE)
   .enableMultipleObjects()
   .enableClassification()
   .build()
val objectDetector = ObjectDetection.getClient(options)

Schritt 3: Bilder an den Detektor senden

Objekterkennung und ‑klassifizierung sind asynchrone Prozesse:

  • Sie senden ein Bild an den Detektor (über process()).
  • Der Detector arbeitet ziemlich hart daran.
  • Der Detector meldet das Ergebnis über einen Callback an Sie zurück.

Der folgende Code führt genau das aus. Kopieren Sie ihn und hängen Sie ihn an den vorhandenen Code in fun runObjectDetection(bitmap:Bitmap)): an.

// Step 3: feed given image to detector and setup callback
objectDetector.process(image)
   .addOnSuccessListener {
       // Task completed successfully
        debugPrint(it)
   }
   .addOnFailureListener {
       // Task failed with an exception
       Log.e(TAG, it.message.toString())
   }

Nach Abschluss der Analyse werden Sie vom Detektor benachrichtigt:

  • Die Gesamtzahl der erkannten Objekte. Jedes erkannte Objekt wird mit Folgendem beschrieben:
  • trackingId: Eine Ganzzahl, die Sie verwenden, um sie über Frames hinweg zu verfolgen (wird in diesem Codelab NICHT verwendet).
  • boundingBox: Der Begrenzungsrahmen des Objekts.
  • labels: eine Liste mit Labels für das erkannte Objekt (nur wenn die Klassifizierung aktiviert ist):
  • index (Index dieses Labels abrufen)
  • text (Gib den Text dieses Labels aus, einschließlich „Fashion Goods“, „Food“, „Home Goods“, „Place“, „Plant“.)
  • confidence ( Gleitkommazahl zwischen 0,0 und 1,0, wobei 1,0 100 % entspricht)

Sie haben wahrscheinlich bemerkt, dass der Code eine printf-ähnliche Verarbeitung für das erkannte Ergebnis mit debugPrint() durchführt.

Fügen Sie sie in die Klasse MainActivity ein:

private fun debugPrint(detectedObjects: List<DetectedObject>) {
   detectedObjects.forEachIndexed { index, detectedObject ->
       val box = detectedObject.boundingBox

       Log.d(TAG, "Detected object: $index")
       Log.d(TAG, " trackingId: ${detectedObject.trackingId}")
       Log.d(TAG, " boundingBox: (${box.left}, ${box.top}) - (${box.right},${box.bottom})")
       detectedObject.labels.forEach {
           Log.d(TAG, " categories: ${it.text}")
           Log.d(TAG, " confidence: ${it.confidence}")
       }
   }
}

Jetzt können Sie Bilder zur Erkennung annehmen.

Klicken Sie in der Android Studio-Symbolleiste auf Ausführen ( execute.png), um das Codelab auszuführen. Wählen Sie ein voreingestelltes Bild aus oder machen Sie ein Foto und sehen Sie sich dann das logcat-Fenster( 16bd6ea224cf8cf1.png) in der IDE an.

Die Ausgabe sollte etwa so aussehen:

D/MLKit Object Detection: Detected object: 0
D/MLKit Object Detection:  trackingId: null
D/MLKit Object Detection:  boundingBox: (481, 2021) - (2426,3376)
D/MLKit Object Detection:  categories: Food
D/MLKit Object Detection:  confidence: 0.90234375
D/MLKit Object Detection: Detected object: 1
D/MLKit Object Detection:  trackingId: null
D/MLKit Object Detection:  boundingBox: (2639, 2633) - (3058,3577)
D/MLKit Object Detection: Detected object: 2
D/MLKit Object Detection:  trackingId: null
D/MLKit Object Detection:  boundingBox: (3, 1816) - (615,2597)
D/MLKit Object Detection:  categories: Home good
D/MLKit Object Detection:  confidence: 0.75390625

…was bedeutet, dass der Detektor drei Objekte erkannt hat:

  • Die Kategorien sind Lebensmittel und Haushaltswaren.
  • Für die zweite Antwort wird keine Kategorie zurückgegeben, da es sich um eine unbekannte Klasse handelt.
  • Kein trackingId, da dies der Einzelbilderkennungsmodus ist.
  • Die Position innerhalb des Rechtecks boundingBox, z.B. (481, 2021) – (2426, 3376)
  • Der Detektor ist sich ziemlich sicher, dass das erste Bild Lebensmittel zeigt (Konfidenzniveau: 90 % – es war Salat).

Technisch gesehen ist das alles, was Sie für die Objekterkennung von ML Kit benötigen. Sie haben alles, was Sie brauchen! Glückwunsch!

Auf der UI-Seite sind Sie noch am Anfang, aber Sie könnten die erkannten Ergebnisse in der UI nutzen, z. B. die Begrenzungsbox zeichnen, um die Nutzerfreundlichkeit zu verbessern. Gehen wir zum nächsten Schritt über: Nachbearbeitung der erkannten Ergebnisse.

6. Ergebnisse der Erkennung nachbearbeiten

In den vorherigen Schritten haben Sie das erkannte Ergebnis in logcat ausgegeben – einfach und schnell.

In diesem Abschnitt verwenden Sie das Ergebnis im Bild:

  • Begrenzungsrahmen auf dem Bild zeichnen
  • Kategoriename und Konfidenz innerhalb des Begrenzungsrahmens zeichnen

Visualisierungstools

Im Codelab ist Boilerplate-Code enthalten, mit dem Sie das Erkennungsergebnis visualisieren können. Mit diesen Dienstprogrammen können Sie den Visualisierungscode vereinfachen:

  • data class BoxWithText(val box: Rect, val text: String) Dies ist eine Datenklasse zum Speichern eines Objekterkennungsergebnisses für die Visualisierung. box ist der Begrenzungsrahmen, in dem sich das Objekt befindet, und text ist der String mit dem Erkennungsergebnis, der zusammen mit dem Begrenzungsrahmen des Objekts angezeigt werden soll.
  • fun drawDetectionResult(bitmap: Bitmap, detectionResults: List<BoxWithText>): Bitmap Mit dieser Methode werden die Ergebnisse der Objekterkennung in detectionResults auf die Eingabe bitmap gezeichnet und die geänderte Kopie zurückgegeben.

Hier sehen Sie ein Beispiel für die Ausgabe der drawDetectionResult-Dienstprogrammfunktion:

58c6f1d4ddb00dfa.png

ML Kit-Erkennungsergebnis visualisieren

Verwenden Sie die Visualisierungstools, um das Ergebnis der ML Kit-Objekterkennung über dem Eingabebild darzustellen.

Suchen Sie die Stelle, an der Sie debugPrint() aufrufen, und fügen Sie das folgende Code-Snippet darunter ein:

// Parse ML Kit's DetectedObject and create corresponding visualization data
val detectedObjects = it.map { obj ->
    var text = "Unknown"

    // We will show the top confident detection result if it exist
    if (obj.labels.isNotEmpty()) {
        val firstLabel = obj.labels.first()
        text = "${firstLabel.text}, ${firstLabel.confidence.times(100).toInt()}%"
    }
    BoxWithText(obj.boundingBox, text)
}

// Draw the detection result on the input bitmap
val visualizedResult = drawDetectionResult(bitmap, detectedObjects)

// Show the detection result on the app screen
runOnUiThread {
    inputImageView.setImageBitmap(visualizedResult)
}
  • Zuerst parsen Sie die DetectedObject von ML Kit und erstellen eine Liste von BoxWithText-Objekten, um das Visualisierungsergebnis darzustellen.
  • Anschließend zeichnen Sie das Erkennungsergebnis mit der Hilfsmethode drawDetectionResult auf das Eingabebild und zeigen es auf dem Bildschirm an.

Ausführen

Klicken Sie jetzt in der Android Studio-Symbolleiste auf Ausführen ( execute.png).

Wenn die App geladen ist, drücken Sie die Schaltfläche mit dem Kamerasymbol, richten Sie die Kamera auf ein Objekt, nehmen Sie ein Foto auf, bestätigen Sie das Foto (in der Kamera-App) oder tippen Sie einfach auf ein beliebiges voreingestelltes Bild. Die Erkennungsergebnisse sollten angezeigt werden. Drücken Sie die Schaltfläche noch einmal oder wählen Sie ein anderes Bild aus, um den Vorgang einige Male zu wiederholen und die neueste ML Kit-ODT zu testen.

a03109cb30d5014d.png

7. Glückwunsch!

Sie haben ML Kit verwendet, um Ihrer App Funktionen zur Objekterkennung hinzuzufügen:

  • 3 Schritte mit 3 APIs
  • Eingabebild erstellen
  • Detektor erstellen
  • Bild an den Detektor senden

Das ist alles, was Sie für die Einrichtung benötigen.

Im weiteren Verlauf können Sie das Modell verbessern. Das Standardmodell kann nur fünf Kategorien erkennen und kennt nicht einmal Messer, Gabel und Flasche. Im anderen Codelab in unserem Lernpfad „On-Device Machine Learning – Objekterkennung“ erfahren Sie, wie Sie ein benutzerdefiniertes Modell trainieren können.

Behandelte Themen

  • ML Kit-Objekterkennung und ‑Tracking in Ihre Android-App einbinden
  • On-Device-Objekterkennung und ‑Tracking in ML Kit verwenden, um Objekte in Bildern zu erkennen

Nächste Schritte

  • Mit ML Kit ODT können Sie mehr Bilder und Live-Videos verwenden, um die Genauigkeit und Leistung der Erkennung und Klassifizierung zu testen.
  • Im Lernpfad für die Objekterkennung finden Sie Informationen zum Trainieren eines benutzerdefinierten Modells.
  • ML Kit ODT in Ihrer eigenen Android-App verwenden

Weitere Informationen