1. Einführung
ML Kit ist ein mobiles SDK, das die Expertise von Google im Bereich des maschinellen Lernens in einem leistungsstarken und dennoch benutzerfreundlichen Paket für Android- und iOS-Apps bereitstellt. Unabhängig davon, ob Sie neu im Bereich des maschinellen Lernens sind oder bereits Erfahrung damit haben, können Sie die benötigte Funktionalität mit nur wenigen Codezeilen ganz einfach implementieren. Sie benötigen keine fundierten Kenntnisse über neuronale Netze oder die Modelloptimierung, um loszulegen.
Wie funktioniert das?
Mit ML Kit können Sie ML-Techniken ganz einfach in Ihren Apps anwenden, indem Sie die ML-Technologien von Google wie Mobile Vision und TensorFlow Lite in einem einzigen SDK zusammenführen. Ob Sie die Leistung der Echtzeitfunktionen der On-Device-Modelle von Mobile Vision oder die Flexibilität benutzerdefinierter TensorFlow Lite-Bildklassifizierungsmodelle benötigen – mit ML Kit ist das mit nur wenigen Codezeilen möglich.
In diesem Codelab erfahren Sie, wie Sie Ihre eigene iOS-App erstellen, die Text und Gesichtszüge in einem Bild automatisch erkennen kann.
Überblick
In diesem Codelab erstellen Sie eine iOS-App mit ML Kit. Mit der Anwendung können Sie Folgendes tun:
|
|
Lerninhalte
- Verwendung des ML Kit SDK, um jeder iOS-App ganz einfach erweiterte Funktionen für maschinelles Lernen wie Texterkennung und Gesichtszugerkennung hinzuzufügen
Voraussetzungen
- Eine aktuelle Version von Xcode (Version 12.4 oder höher)
- iOS-Simulator oder ein physisches iOS-Gerät mit iOS 10.0 oder höher
- ML Kit unterstützt nur diese beiden 64-Bit-Architekturen:
x86_64undarm64. - Beispielcode
- Grundkenntnisse der iOS-Entwicklung in Swift
- Grundlegendes Verständnis von Modellen für maschinelles Lernen
Dieses Codelab konzentriert sich auf ML Kit. Auf irrelevante Konzepte wird nicht genauer eingegangen und entsprechende Codeblöcke können Sie einfach kopieren und einfügen.
2. Einrichtung
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-ios-codelab) mit allen benötigten Ressourcen erstellt. Für dieses Codelab benötigen Sie nur die Ressourcen im Unterverzeichnis vision.
Das Unterverzeichnis vision im Repository mlkit-ios-codelab enthält zwei Verzeichnisse:
starter: Startcode, auf dem Sie in diesem Codelab aufbauen.- final: Vollständiger Code für die fertige Beispiel-App.
Abhängigkeiten für ML Kit mit CocoaPods hinzufügen
CocoaPods wird verwendet, um die ML Kit-Abhängigkeiten zu Ihrer App hinzuzufügen. Wenn CocoaPods noch nicht auf Ihrem Computer installiert ist, finden Sie hier die Installationsanleitung hier. Öffnen Sie nach der Installation die Podfile-Datei in Ihrem bevorzugten Editor und fügen Sie ML Kit als Abhängigkeiten hinzu:
Podfile
platform :ios, '10.0'
use_frameworks!
pod 'GoogleMLKit/FaceDetection'
pod 'GoogleMLKit/TextRecognition'
target 'MLKit-codelab' do
end
ML Kit Cocoa Pods installieren
Damit alle Abhängigkeiten für Ihre App verfügbar sind, sollten Sie die ML Kit Cocoa Pods über die Befehlszeile installieren.
Befehlszeile
# Make sure you are in the root of your app
pod install
xed .
3. Start-App ausführen
Jetzt können Sie die App zum ersten Mal ausführen. Klicken Sie in Xcode auf 
Ausführen , um die App zu kompilieren und im iOS-Simulator auszuführen.
Die App sollte im Simulator gestartet werden. An dieser Stelle sollten Sie ein einfaches Layout mit einer Auswahl sehen, mit der Sie zwischen zwei Bildern auswählen können. Im nächsten Abschnitt fügen Sie Ihrer App die Texterkennung hinzu, um Text in den Bildern zu erkennen.
4. On-Device-Texterkennung hinzufügen
In diesem Schritt fügen wir Ihrer App eine Funktion hinzu, mit der Text in Bildern erkannt werden kann.
MLVision-Modul importieren
Prüfen Sie, ob die folgenden Importe in Ihrer ViewController-Klasse vorhanden sind.
ViewController.swift
import MLKit
VisionTextRecognizer erstellen
Fügen Sie der ViewController-Klasse die folgenden Lazy-Properties hinzu.
ViewController.swift
private lazy var textRecognizer = TextRecognizer.textRecognizer()
On-Device-Texterkennung für ein Bild einrichten und ausführen
Fügen Sie der Methode runTextRecognition der Klasse ViewController Folgendes hinzu:
ViewController.swift
func runTextRecognition(with image: UIImage) {
let visionImage = VisionImage(image: image)
textRecognizer.process(visionImage) { features, error in
self.processResult(from: features, error: error)
}
}
Der obige Code konfiguriert den Texterkennungsdetektor und ruft die Funktion processResult(from:, error:) mit der Antwort auf.
Antwort der Texterkennung verarbeiten
Fügen Sie der processResult-Methode in der ViewController-Klasse den folgenden Code hinzu, um die Ergebnisse zu parsen und in Ihrer App anzuzeigen.
ViewController.swift
func processResult(from text: Text?, error: Error?) {
removeDetectionAnnotations()
guard error == nil, let text = text else {
let errorString = error?.localizedDescription ?? Constants.detectionNoResultsMessage
print("Text recognizer failed with error: \(errorString)")
return
}
let transform = self.transformMatrix()
// Blocks.
for block in text.blocks {
drawFrame(block.frame, in: .purple, transform: transform)
// Lines.
for line in block.lines {
drawFrame(line.frame, in: .orange, transform: transform)
// Elements.
for element in line.elements {
drawFrame(element.frame, in: .green, transform: transform)
let transformedRect = element.frame.applying(transform)
let label = UILabel(frame: transformedRect)
label.text = element.text
label.adjustsFontSizeToFitWidth = true
self.annotationOverlayView.addSubview(label)
}
}
}
}
App im Simulator ausführen
Klicken Sie jetzt in Xcode auf Ausführen. Wenn die App geladen wurde, prüfen Sie, ob in der Auswahl Image 1 ausgewählt ist, und klicken Sie auf die Schaltfläche Find Text.
Ihre App sollte jetzt wie in der Abbildung unten aussehen. Die Ergebnisse der Texterkennung und die Begrenzungsrahmen werden über dem Originalbild angezeigt.
Foto: Kai Schreiber / Wikimedia Commons / CC BY-SA 2.0
Glückwunsch! Sie haben Ihrer App gerade mit ML Kit die On-Device-Texterkennung hinzugefügt. Die On-Device-Texterkennung eignet sich für viele Anwendungsfälle, da sie auch dann funktioniert, wenn Ihre App keine Internetverbindung hat. Außerdem ist sie schnell genug, um sowohl für Standbilder als auch für Live-Videoframes verwendet zu werden.
5. On-Device-Gesichtskonturerkennung hinzufügen
In diesem Schritt fügen wir Ihrer App eine Funktion hinzu, mit der die Konturen von Gesichtern in Bildern erkannt werden können.
FaceDetector erstellen
Fügen Sie der ViewController-Klasse die folgenden Lazy-Properties hinzu.
ViewController.swift
private lazy var faceDetectorOption: FaceDetectorOptions = {
let option = FaceDetectorOptions()
option.contourMode = .all
option.performanceMode = .fast
return option
}()
private lazy var faceDetector = FaceDetector.faceDetector(options: faceDetectorOption)
On-Device-Gesichtskonturerkennung für ein Bild einrichten und ausführen
Fügen Sie der Methode runFaceContourDetection der Klasse ViewController Folgendes hinzu:
ViewController.swift
func runFaceContourDetection(with image: UIImage) {
let visionImage = VisionImage(image: image)
faceDetector.process(visionImage) { features, error in
self.processResult(from: features, error: error)
}
}
Der obige Code konfiguriert den Texterkennungsdetektor und ruft die Funktion processResult(from:, error:) mit der Antwort auf.
Antwort des Gesichtserkennungsdetektors verarbeiten
Fügen Sie der processResult-Methode in der ViewController-Klasse den folgenden Code hinzu, um die Ergebnisse zu parsen und in Ihrer App anzuzeigen.
ViewController.swift
func processResult(from faces: [Face]?, error: Error?) {
removeDetectionAnnotations()
guard let faces = faces else {
return
}
for feature in faces {
let transform = self.transformMatrix()
let transformedRect = feature.frame.applying(transform)
UIUtilities.addRectangle(
transformedRect,
to: self.annotationOverlayView,
color: UIColor.green
)
self.addContours(forFace: feature, transform: transform)
}
}
Fügen Sie abschließend die Hilfsmethode addContours in der ViewController-Klasse hinzu, um die Konturpunkte zu zeichnen.
ViewController.swift
private func addContours(forFace face: Face, transform: CGAffineTransform) {
// Face
if let faceContour = face.contour(ofType: .face) {
for point in faceContour.points {
drawPoint(point, in: .blue, transform: transform)
}
}
// Eyebrows
if let topLeftEyebrowContour = face.contour(ofType: .leftEyebrowTop) {
for point in topLeftEyebrowContour.points {
drawPoint(point, in: .orange, transform: transform)
}
}
if let bottomLeftEyebrowContour = face.contour(ofType: .leftEyebrowBottom) {
for point in bottomLeftEyebrowContour.points {
drawPoint(point, in: .orange, transform: transform)
}
}
if let topRightEyebrowContour = face.contour(ofType: .rightEyebrowTop) {
for point in topRightEyebrowContour.points {
drawPoint(point, in: .orange, transform: transform)
}
}
if let bottomRightEyebrowContour = face.contour(ofType: .rightEyebrowBottom) {
for point in bottomRightEyebrowContour.points {
drawPoint(point, in: .orange, transform: transform)
}
}
// Eyes
if let leftEyeContour = face.contour(ofType: .leftEye) {
for point in leftEyeContour.points {
drawPoint(point, in: .cyan, transform: transform)
}
}
if let rightEyeContour = face.contour(ofType: .rightEye) {
for point in rightEyeContour.points {
drawPoint(point, in: .cyan, transform: transform)
}
}
// Lips
if let topUpperLipContour = face.contour(ofType: .upperLipTop) {
for point in topUpperLipContour.points {
drawPoint(point, in: .red, transform: transform)
}
}
if let bottomUpperLipContour = face.contour(ofType: .upperLipBottom) {
for point in bottomUpperLipContour.points {
drawPoint(point, in: .red, transform: transform)
}
}
if let topLowerLipContour = face.contour(ofType: .lowerLipTop) {
for point in topLowerLipContour.points {
drawPoint(point, in: .red, transform: transform)
}
}
if let bottomLowerLipContour = face.contour(ofType: .lowerLipBottom) {
for point in bottomLowerLipContour.points {
drawPoint(point, in: .red, transform: transform)
}
}
// Nose
if let noseBridgeContour = face.contour(ofType: .noseBridge) {
for point in noseBridgeContour.points {
drawPoint(point, in: .yellow, transform: transform)
}
}
if let noseBottomContour = face.contour(ofType: .noseBottom) {
for point in noseBottomContour.points {
drawPoint(point, in: .yellow, transform: transform)
}
}
}
App im Simulator ausführen
Klicken Sie jetzt in Xcode auf Ausführen. Wenn die App geladen wurde, prüfen Sie, ob in der Auswahl Image 2 ausgewählt ist, und klicken Sie auf die Schaltfläche Find Face Contour. Ihre App sollte jetzt wie in der Abbildung unten aussehen. Die Konturen des Gesichts von Grace Hopper werden als Punkte über dem Originalbild angezeigt.
Glückwunsch! Sie haben Ihrer App gerade mit ML Kit die On-Device-Gesichtskonturerkennung hinzugefügt. Die On-Device-Gesichtskonturerkennung eignet sich für viele Anwendungsfälle, da sie auch dann funktioniert, wenn Ihre App keine Internetverbindung hat. Außerdem ist sie schnell genug, um sowohl für Standbilder als auch für Live-Videoframes verwendet zu werden.
6. Glückwunsch!
Sie haben ML Kit verwendet, um Ihrer App ganz einfach erweiterte Funktionen für maschinelles Lernen hinzuzufügen.
Behandelte Themen
- ML Kit zu Ihrer iOS-App hinzufügen
- On-Device-Texterkennung in ML Kit verwenden, um Text in Bildern zu finden
- On-Device-Gesichtserkennung in ML Kit verwenden, um Gesichtszüge in Bildern zu erkennen
Nächste Schritte
- ML Kit in Ihrer eigenen iOS-App verwenden
Weitere Informationen
- https://g.co/mlkit