1. Introduction
ML Kit est un SDK mobile qui intègre l'expertise de Google en matière de machine learning dans les applications Android et iOS, le tout dans un package puissant et simple d'utilisation. Que vous soyez débutant ou expérimenté en machine learning, vous pouvez facilement implémenter la fonctionnalité dont vous avez besoin en quelques lignes de code. Pour commencer, vous n'avez pas besoin d'avoir des connaissances approfondies sur les réseaux de neurones ni sur l'optimisation des modèles.
Comment ça marche ?
ML Kit permet d'appliquer facilement des techniques de machine learning à vos applications en rassemblant dans un seul SDK les technologies de machine learning de Google, telles que Mobile Vision et TensorFlow Lite. Que vous ayez besoin de la puissance des fonctionnalités en temps réel des modèles sur l'appareil de Mobile Vision ou de la flexibilité des modèles de classification d'images TensorFlow Lite personnalisés, ML Kit vous permet de le faire en quelques lignes de code.
Cet atelier de programmation vous explique comment créer votre propre application iOS capable de détecter automatiquement du texte et des traits du visage dans une image.
Objectif de cet atelier
Dans cet atelier de programmation, vous allez créer une application iOS avec ML Kit. Cette application pourra :
|
|
Points abordés
- Comment utiliser le SDK ML Kit pour ajouter facilement des fonctionnalités avancées de machine learning (apprentissage automatique) telles que la reconnaissance de texte et la détection des caractéristiques du visage à n'importe quelle application iOS
Prérequis
- Une version récente de Xcode (v12.4 ou ultérieure)
- Simulateur iOS ou appareil iOS physique équipé d'iOS 10.0 ou version ultérieure
- ML Kit n'est compatible qu'avec les deux architectures 64 bits suivantes :
x86_64etarm64. - L'exemple de code
- Connaissances de base du développement iOS en Swift
- Connaissances de base des modèles de machine learning
Cet atelier de programmation est consacré à ML Kit. Les concepts et les blocs de codes non pertinents ne sont pas abordés, et vous sont fournis afin que vous puissiez simplement les copier et les coller.
2. Configuration
Télécharger le code
Cliquez sur le lien ci-dessous pour télécharger l'ensemble du code de cet atelier de programmation :
Décompressez le fichier ZIP téléchargé. Cette action crée un dossier racine (mlkit-ios-codelab) contenant toutes les ressources dont vous aurez besoin. Pour cet atelier de programmation, vous n'aurez besoin que des ressources du sous-répertoire vision.
Le sous-répertoire vision du dépôt mlkit-ios-codelab contient deux répertoires :
starter : code de démarrage sur lequel s'appuie cet atelier de programmation.
final : code complet de l'exemple d'application finalisée.
Ajouter les dépendances pour ML Kit avec CocoaPods
CocoaPods permet d'ajouter les dépendances ML Kit à votre application. Si CocoaPods n'est pas installé sur votre ordinateur, consultez les instructions d'installation ici. Une fois installé, ouvrez Podfile dans votre éditeur préféré et ajoutez ML Kit en tant que dépendances :
Podfile
platform :ios, '10.0'
use_frameworks!
pod 'GoogleMLKit/FaceDetection'
pod 'GoogleMLKit/TextRecognition'
target 'MLKit-codelab' do
end
Installer les CocoaPods ML Kit
Pour vous assurer que toutes les dépendances sont disponibles pour votre application, vous devez utiliser la ligne de commande pour installer les CocoaPods ML Kit.
Ligne de commande
# Make sure you are in the root of your app
pod install
xed .
3. Exécuter l'application de démarrage
Vous êtes maintenant prêt à exécuter l'application pour la première fois. Cliquez sur
Run (Exécuter) dans Xcode pour compiler l'application et l'exécuter sur le simulateur iOS.
L'application doit se lancer sur votre simulateur. À ce stade, vous devriez voir une mise en page de base avec un sélecteur qui vous permet de choisir entre deux images. Dans la section suivante, vous allez ajouter la reconnaissance de texte à votre application pour identifier le texte dans les images.
4. Ajouter la reconnaissance de texte sur l'appareil
Dans cette étape, nous allons ajouter à votre application une fonctionnalité permettant de reconnaître le texte dans les images.
Importer le module MLVision
Vérifiez que les importations suivantes existent dans votre classe ViewController.
ViewController.swift
import MLKit
Créer un VisionTextRecognizer
Ajoutez les propriétés lazy suivantes à votre classe ViewController.
ViewController.swift
private lazy var textRecognizer = TextRecognizer.textRecognizer()
Configurer et exécuter la reconnaissance de texte sur un appareil pour une image
Ajoutez les éléments suivants à la méthode runTextRecognition de la classe ViewController :
ViewController.swift
func runTextRecognition(with image: UIImage) {
let visionImage = VisionImage(image: image)
textRecognizer.process(visionImage) { features, error in
self.processResult(from: features, error: error)
}
}
Le code ci-dessus configure le détecteur de reconnaissance de texte et appelle la fonction processResult(from:, error:) avec la réponse.
Traiter la réponse de reconnaissance de texte
Ajoutez le code suivant à processResult dans la classe ViewController pour analyser les résultats et les afficher dans votre application.
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)
}
}
}
}
Exécuter l'application sur le simulateur
Cliquez à présent sur Run (Exécuter)
dans Xcode. Une fois l'application chargée, assurez-vous que Image 1 est sélectionné dans le sélecteur, puis cliquez sur le bouton Find Text.
Votre application devrait maintenant ressembler à l'image ci-dessous, affichant les résultats de la reconnaissance de texte et les cadres de sélection superposés à l'image d'origine.

Photo : Kai Schreiber / Wikimedia Commons / CC BY-SA 2.0
Félicitations, vous venez d'ajouter la reconnaissance de texte sur l'appareil à votre application à l'aide de ML Kit ! La reconnaissance de texte sur l'appareil est idéale pour de nombreux cas d'utilisation, car elle fonctionne même lorsque votre application n'est pas connectée à Internet. Elle est également suffisamment rapide pour être utilisée sur des images fixes ainsi que sur des images vidéo en direct.
5. Ajouter la détection des contours du visage sur l'appareil
Dans cette étape, nous allons ajouter à votre application une fonctionnalité permettant de détecter les contours des visages dans les images.
Créer un FaceDetector
Ajoutez les propriétés lazy suivantes à votre classe ViewController.
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)
Configurer et exécuter la détection des contours du visage sur un appareil pour une image
Ajoutez les éléments suivants à la méthode runFaceContourDetection de la classe ViewController :
ViewController.swift
func runFaceContourDetection(with image: UIImage) {
let visionImage = VisionImage(image: image)
faceDetector.process(visionImage) { features, error in
self.processResult(from: features, error: error)
}
}
Le code ci-dessus configure le détecteur de reconnaissance de texte et appelle la fonction processResult(from:, error:) avec la réponse.
Traiter la réponse du détecteur de visages
Ajoutez le code suivant à processResult dans la classe ViewController pour analyser les résultats et les afficher dans votre application.
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)
}
}
Enfin, ajoutez la méthode d'assistance addContours dans la classe ViewController pour dessiner les points de contour.
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)
}
}
}
Exécuter l'application sur le simulateur
Cliquez à présent sur Run (Exécuter)
dans Xcode. Une fois l'application chargée, assurez-vous que Image 2 est sélectionné dans le sélecteur, puis cliquez sur le bouton Find Face Contour. Votre application devrait maintenant ressembler à l'image ci-dessous, qui montre les contours du visage de Grace Hopper sous forme de points superposés à l'image d'origine.

Félicitations ! Vous venez d'ajouter la détection des contours du visage sur l'appareil à votre application. La détection des contours du visage avec ML Kit sur l'appareil est idéale pour de nombreux cas d'utilisation, car elle fonctionne même lorsque votre application n'est pas connectée à Internet et est suffisamment rapide pour être utilisée sur des images fixes ainsi que sur des images vidéo en direct.
6. Félicitations !
Vous avez utilisé ML Kit pour ajouter facilement des fonctionnalités de machine learning avancées à votre application.
Points abordés
- Ajouter ML Kit à votre application iOS
- Utiliser la reconnaissance de texte sur l'appareil dans ML Kit pour trouver du texte dans des images
- Utiliser la reconnaissance faciale sur l'appareil dans ML Kit pour identifier les caractéristiques faciales dans les images
Étapes suivantes
- Utilisez ML Kit dans votre propre application iOS.
En savoir plus
- https://g.co/mlkit

