HoloLens (1ère génération) et Azure 302 : Vision par ordinateur


Notes

Les tutoriels Mixed Reality Academy ont été conçus pour les appareils HoloLens (1re génération) et les casques immersifs de réalité mixte. Nous estimons qu’il est important de laisser ces tutoriels à la disposition des développeurs qui recherchent encore des conseils pour développer des applications sur ces appareils. Notez que ces tutoriels ne sont pas mis à jour avec les derniers ensembles d’outils ou interactions utilisés pour HoloLens 2. Ils sont fournis dans le but de fonctionner sur les appareils pris en charge. Il y aura une nouvelle série de tutoriels qui seront publiés à l’avenir qui démontreront comment développer pour HoloLens 2. Cet avis sera mis à jour avec un lien vers ces tutoriels lorsqu’ils sont publiés.


Dans ce cours, vous allez apprendre à reconnaître du contenu visuel dans une image fournie, à l’aide des fonctionnalités d’Azure Vision par ordinateur dans une application de réalité mixte.

Les résultats de la reconnaissance s’affichent sous forme de balises descriptives. Vous pouvez utiliser ce service sans avoir besoin d’entraîner un modèle Machine Learning. Si votre implémentation nécessite l’apprentissage d’un modèle Machine Learning, consultez MR et Azure 302b.

lab outcome

Microsoft Vision par ordinateur est un ensemble d’API conçues pour fournir aux développeurs un traitement et une analyse d’images (avec des informations de retour), à l’aide d’algorithmes avancés, tous à partir du cloud. Les développeurs chargent une image ou une URL d’image, et les algorithmes d’API Microsoft Vision par ordinateur analysent le contenu visuel, en fonction des entrées choisies par l’utilisateur, qui peuvent ensuite retourner des informations, y compris, identifier le type et la qualité d’une image, détecter les visages humains (renvoyant leurs coordonnées) et marquer ou catégoriser des images. Pour plus d’informations, consultez la page API Azure Vision par ordinateur.

Après avoir terminé ce cours, vous aurez une application de réalité mixte HoloLens, qui sera en mesure d’effectuer les opérations suivantes :

  1. À l’aide du mouvement Tap, l’appareil photo du HoloLens capture une image.
  2. L’image est envoyée au service API Azure Vision par ordinateur.
  3. Les objets reconnus sont répertoriés dans un groupe d’interface utilisateur simple positionné dans la scène Unity.

Dans votre application, il vous suffit de savoir comment intégrer les résultats à votre conception. Ce cours est conçu pour vous apprendre à intégrer un service Azure à votre projet Unity. Il s’agit de votre travail d’utiliser les connaissances que vous obtenez de ce cours pour améliorer votre application de réalité mixte.

Prise en charge des appareils

Cours HoloLens Casques immersifs
Réalité mixte - Azure - Cours 302 : Vision par ordinateur ✔️ ✔️

Notes

Bien que ce cours se concentre principalement sur HoloLens, vous pouvez également appliquer ce que vous apprenez dans ce cours à Windows Mixed Reality casques immersifs (VR). Étant donné que les casques immersifs (VR) n’ont pas de caméras accessibles, vous aurez besoin d’une caméra externe connectée à votre PC. À mesure que vous suivez le cours, vous verrez des notes sur les modifications que vous devrez peut-être utiliser pour prendre en charge les casques immersifs (VR).

Prérequis

Notes

Ce didacticiel est conçu pour les développeurs qui ont une expérience de base avec Unity et C#. Sachez également que les prérequis et les instructions écrites de ce document représentent ce qui a été testé et vérifié au moment de l’écriture (mai 2018). Vous êtes libre d’utiliser le logiciel le plus récent, comme indiqué dans l’article d’installation des outils , mais il ne doit pas être supposé que les informations de ce cours correspondent parfaitement à ce que vous trouverez dans un logiciel plus récent que ce qui est répertorié ci-dessous.

Nous vous recommandons le matériel et le logiciel suivants pour ce cours :

Avant de commencer

  1. Pour éviter de rencontrer des problèmes de création de ce projet, il est fortement suggéré de créer le projet mentionné dans ce didacticiel dans un dossier racine ou proche (des chemins d’accès de dossier longs peuvent provoquer des problèmes au moment de la build).
  2. Configurez et testez votre HoloLens. Si vous avez besoin de support pour configurer votre HoloLens, veillez à consulter l’article de configuration HoloLens.
  3. Il est judicieux d’effectuer le réglage de l’étalonnage et du capteur lors du développement d’une nouvelle application HoloLens (parfois, il peut aider à effectuer ces tâches pour chaque utilisateur).

Pour obtenir de l’aide sur l’étalonnage, suivez ce lien vers l’article HoloLens Étalonnage.

Pour obtenir de l’aide sur le réglage du capteur, suivez ce lien vers l’article HoloLens Paramétrage du capteur.

Chapitre 1 – Portail Azure

Pour utiliser le service d’API Vision par ordinateur dans Azure, vous devez configurer une instance du service à rendre disponible pour votre application.

  1. Tout d’abord, connectez-vous au portail Azure.

    Notes

    Si vous n’avez pas encore de compte Azure, vous devez en créer un. Si vous suivez ce tutoriel dans une situation de salle de classe ou de laboratoire, demandez à votre instructeur ou à l’un des spécialistes de l’aide pour configurer votre nouveau compte.

  2. Une fois connecté, cliquez sur Nouveau dans le coin supérieur gauche, puis recherchez Vision par ordinateur API, puis cliquez sur Entrée.

    Create a new resource in Azure

    Notes

    Le mot Nouveau peut avoir été remplacé par Créer une ressource, dans des portails plus récents.

  3. La nouvelle page fournit une description du service API Vision par ordinateur. En bas à gauche de cette page, sélectionnez le bouton Créer pour créer une association avec ce service.

    About the computer vision api service

  4. Une fois que vous avez cliqué sur Créer :

    1. Insérez votre nom souhaité pour cette instance de service.

    2. Sélectionnez un Abonnement.

    3. Sélectionnez le niveau tarifaire approprié pour vous, si c’est la première fois que vous créez un service d’API Vision par ordinateur, un niveau gratuit (nommé F0) doit être disponible pour vous.

    4. Choisissez un groupe de ressources ou créez-en un. Un groupe de ressources permet de surveiller, de contrôler l’accès, de provisionner et de gérer la facturation pour une collection de ressources Azure. Il est recommandé de conserver tous les services Azure associés à un seul projet (par exemple, ces laboratoires) sous un groupe de ressources commun.

      Si vous souhaitez en savoir plus sur les groupes de ressources Azure, consultez l’article du groupe de ressources.

    5. Déterminez l’emplacement de votre groupe de ressources (si vous créez un groupe de ressources). L’emplacement se trouverait idéalement dans la région où l’application s’exécuterait. Certaines ressources Azure sont disponibles uniquement dans certaines régions.

    6. Vous devrez également confirmer que vous avez compris les conditions générales appliquées à ce service.

    7. Cliquez sur Créer.

      Service creation information

  5. Une fois que vous avez cliqué sur Créer, vous devez attendre que le service soit créé, cela peut prendre une minute.

  6. Une notification s’affiche dans le portail une fois l’instance de service créée.

    See the new notification for your new service

  7. Cliquez sur la notification pour explorer votre nouvelle instance de service.

    Select the Go To Resource button.

  8. Cliquez sur le bouton Accéder à la ressource dans la notification pour explorer votre nouvelle instance de service. Vous êtes redirigé vers votre nouvelle instance de service d’API Vision par ordinateur.

    Your new Computer Vision API service image

  9. Dans ce tutoriel, votre application doit effectuer des appels à votre service, ce qui est effectué à l’aide de la clé d’abonnement de votre service.

  10. Dans la page Démarrage rapide, de votre service API Vision par ordinateur, accédez à la première étape, récupérez vos clés et cliquez sur Clés (vous pouvez également le faire en cliquant sur les touches de lien hypertexte bleues, situées dans le menu de navigation des services, indiquée par l’icône de touche). Cela révélera vos clés de service.

  11. Prenez une copie de l’une des clés affichées, car vous en aurez besoin plus loin dans votre projet.

  12. Retour à la page de démarrage rapide, et à partir de là, récupérez votre point de terminaison. N’oubliez pas que votre région peut être différente(laquelle, si c’est le cas, vous devrez apporter une modification à votre code ultérieurement). Prenez une copie de ce point de terminaison pour une utilisation ultérieure :

    Your new Computer Vision API service

    Conseil

    Vous pouvez vérifier les différents points de terminaison ici.

Chapitre 2 : Configurer le projet Unity

Voici une configuration classique pour le développement avec la réalité mixte et, par conséquent, est un bon modèle pour d’autres projets.

  1. Ouvrez Unity , puis cliquez sur Nouveau.

    Start new Unity project.

  2. Vous devez maintenant fournir un nom de Project Unity. Insérez MR_ComputerVision. Vérifiez que le type de projet est défini sur 3D. Définissez l’emplacement sur un emplacement approprié pour vous (n’oubliez pas que plus près des répertoires racines est préférable). Cliquez ensuite sur Créer un projet.

    Provide details for new Unity project.

  3. Avec Unity ouvert, il est utile de vérifier que l’éditeur de script par défaut est défini sur Visual Studio. Accédez à Modifier > les préférences , puis à partir de la nouvelle fenêtre, accédez à Outils externes. Remplacez l’éditeur de script externepar Visual Studio 2017. Fermez la fenêtre Préférences .

    Update script editor preference.

  4. Ensuite, accédez à File > Build Paramètres et sélectionnez plateforme Windows universelle, puis cliquez sur le bouton Changer de plateforme pour appliquer votre sélection.

    Build Settings window, switch platform to UWP.

  5. Toujours dans la build de fichier > Paramètres et assurez-vous que :

    1. L’appareil cible est défini sur HoloLens

      Pour les casques immersifs, définissez l’appareil cible sur n’importe quel appareil.

    2. Le type de build est défini sur D3D

    3. Le Kit de développement logiciel (SDK) est défini sur La dernière version installée

    4. Visual Studio Version est définie sur La dernière version installée

    5. La génération et l’exécution sont définies sur Ordinateur local

    6. Enregistrez la scène et ajoutez-la à la build.

      1. Pour ce faire, sélectionnez Ajouter des scènes ouvertes. Une fenêtre d’enregistrement s’affiche.

        Click add open scenes button

      2. Créez un dossier pour cela, et n’importe quelle scène future, puis sélectionnez le bouton Nouveau dossier pour créer un dossier, nommez-le Scènes.

        Create new scripts folder

      3. Ouvrez votre dossier Scenes nouvellement créé, puis, dans le champ Fichier : champ de texte, tapez MR_ComputerVisionScene, puis cliquez sur Enregistrer.

        Give new scene a name.

        Sachez que vous devez enregistrer vos scènes Unity dans le dossier Ressources, car elles doivent être associées au Project Unity. La création du dossier de scènes (et d’autres dossiers similaires) est un moyen classique de structurer un projet Unity.

    7. Les autres paramètres, dans Build Paramètres, doivent être conservés comme paramètres par défaut pour l’instant.

  6. Dans la fenêtre Build Paramètres, cliquez sur le bouton Player Paramètres, ce qui ouvre le panneau associé dans l’espace où se trouve l’Inspecteur.

    Open player settings.

  7. Dans ce panneau, quelques paramètres doivent être vérifiés :

    1. Sous l’onglet Autres Paramètres :

      1. La version du runtime de script doit être stable (équivalent .NET 3.5).

      2. Le serveur principal de script doit être .NET

      3. Le niveau de compatibilité des API doit être .NET 4.6

        Update other settings.

    2. Sous l’onglet Publication Paramètres, sous Fonctionnalités, vérifiez :

      1. InternetClient

      2. Webcam

        Updating publishing settings.

    3. Plus loin dans le panneau, dans XR Paramètres (indiqué ci-dessous Publier Paramètres), cochez Virtual Reality Supported, assurez-vous que le sdk Windows Mixed Reality est ajouté.

      Update the X R Settings.

  8. De retour dans Build ParamètresUnity C# Projects n’est plus grisé ; cochez la case en regard de cela.

  9. Fermez la fenêtre Build Settings.

  10. Enregistrez votre scène et Project (FILE > SAVE SCENE / FILE > SAVE PROJECT).

Chapitre 3 : Configuration principale de la caméra

Important

Si vous souhaitez ignorer le composant De configuration Unity de ce cours et continuer directement dans le code, n’hésitez pas à télécharger ce .unitypackage, à l’importer dans votre projet en tant que package personnalisé, puis à continuer à partir du chapitre 5.

  1. Dans le panneau Hiérarchie, sélectionnez l’appareil photo principal.

  2. Une fois sélectionné, vous pourrez voir tous les composants de l’appareil photo principal dans le panneau Inspecteur.

    1. L’objet Camera doit être nommé Main Camera (notez l’orthographe !)

    2. La balise Main Camera doit être définie sur MainCamera (notez l’orthographe !)

    3. Vérifiez que la position de transformation est définie sur 0, 0, 0

    4. Définissez clear flags sur Solid Color (ignorez-le pour le casque immersif).

    5. Définissez la couleur d’arrière-plan du composant caméra sur Noir, Alpha 0 (code hexadécimal : #000000000) (ignorez-le pour le casque immersif).

      Update Camera Components.

  3. Ensuite, vous devrez créer un objet « Cursor » simple attaché à l’appareil photo principal, ce qui vous aidera à positionner la sortie de l’analyse d’image lorsque l’application est en cours d’exécution. Ce curseur détermine le point central du focus de la caméra.

Pour créer le curseur :

  1. Dans le panneau Hiérarchie, cliquez avec le bouton droit sur l’appareil photo principal. Sous Objet 3D, cliquez sur Sphere.

    Select the Cursor Object.

  2. Renommez la sphère en curseur (double-cliquez sur l’objet Cursor ou appuyez sur le bouton de clavier « F2 » avec l’objet sélectionné), puis vérifiez qu’il est situé en tant qu’enfant de la caméra principale.

  3. Dans le panneau Hiérarchie, cliquez sur le curseur. Une fois le curseur sélectionné, ajustez les variables suivantes dans le panneau Inspecteur :

    1. Définir la position de transformation sur 0, 0, 5

    2. Définir l’échelle sur 0.02, 0.02, 0.02

      Update the Transform Position and Scale.

Chapitre 4 : Configurer le système d’étiquettes

Une fois que vous avez capturé une image avec l’appareil photo du HoloLens, cette image est envoyée à votre instance de service d’API Azure Vision par ordinateur à des fins d’analyse.

Les résultats de cette analyse seront une liste d’objets reconnus appelés Balises.

Vous allez utiliser des étiquettes (en tant que texte 3D dans l’espace du monde) pour afficher ces balises à l’emplacement où la photo a été prise.

Les étapes suivantes montrent comment configurer l’objet Label .

  1. Cliquez avec le bouton droit n’importe où dans le panneau hiérarchie (l’emplacement n’a pas d’importance à ce stade), sous Objet 3D, ajoutez un texte 3D. Nommez-le LabelText.

    Create 3D Text object.

  2. Dans le panneau Hiérarchie, cliquez sur LabelText. Une fois LabelText sélectionné, ajustez les variables suivantes dans le panneau Inspecteur :

    1. Définir la position sur 0,0,0
    2. Définir l’échelle sur 0.01, 0.01, 0.01
    3. Dans le composant Text Mesh :
    4. Remplacez tout le texte dans texte, par « ... »
    5. Définir l’ancre au centre intermédiaire
    6. Définir l’alignement sur le centre
    7. Définir la taille de l’onglet sur 4
    8. Définir la taille de police sur 50
    9. Définir la couleur sur #FFFFFFFF

    Text Component

  3. Faites glisser LabelText à partir du panneau Hiérarchie, dans le dossier de ressources, dans le panneau Project. Ainsi, LabelText est un préfabriqué, afin qu’il puisse être instancié dans le code.

    Create a prefab of the LabelText object.

  4. Vous devez supprimer LabelText du panneau Hiérarchie afin qu’il ne s’affiche pas dans la scène d’ouverture. Comme il s’agit maintenant d’un préfabriqué, que vous allez appeler pour des instances individuelles de votre dossier Assets, il n’est pas nécessaire de le conserver dans la scène.

  5. La structure de l’objet final dans le panneau hiérarchie doit être semblable à celle indiquée dans l’image ci-dessous :

    Final structure of the hierarchy panel.

Chapitre 5 : Créer la classe ResultsLabel

Le premier script que vous devez créer est la classe ResultsLabel , qui est responsable des éléments suivants :

  • Création des étiquettes dans l’espace mondial approprié, par rapport à la position de l’appareil photo.
  • Affichage des balises à partir de l’image Anaysis.

Pour créer cette classe :

  1. Cliquez avec le bouton droit dans le volet Project, puis créez un > dossier. Nommez les scripts du dossier.

    Create scripts folder.

  2. Avec le dossier Scripts créé, double-cliquez dessus pour l’ouvrir. Ensuite, dans ce dossier, cliquez avec le bouton droit, puis sélectionnez Créer > puis script C#. Nommez le script ResultsLabel.

  3. Double-cliquez sur le nouveau script ResultsLabel pour l’ouvrir avec Visual Studio.

  4. Dans la classe, insérez le code suivant dans la classe ResultsLabel :

        using System.Collections.Generic;
        using UnityEngine;
    
        public class ResultsLabel : MonoBehaviour
        {	
            public static ResultsLabel instance;
    
            public GameObject cursor;
    
            public Transform labelPrefab;
    
            [HideInInspector]
            public Transform lastLabelPlaced;
    
            [HideInInspector]
            public TextMesh lastLabelPlacedText;
    
            private void Awake()
            {
                // allows this instance to behave like a singleton
                instance = this;
            }
    
            /// <summary>
            /// Instantiate a Label in the appropriate location relative to the Main Camera.
            /// </summary>
            public void CreateLabel()
            {
                lastLabelPlaced = Instantiate(labelPrefab, cursor.transform.position, transform.rotation);
    
                lastLabelPlacedText = lastLabelPlaced.GetComponent<TextMesh>();
    
                // Change the text of the label to show that has been placed
                // The final text will be set at a later stage
                lastLabelPlacedText.text = "Analysing...";
            }
    
            /// <summary>
            /// Set the Tags as Text of the last Label created. 
            /// </summary>
            public void SetTagsToLastLabel(Dictionary<string, float> tagsDictionary)
            {
                lastLabelPlacedText = lastLabelPlaced.GetComponent<TextMesh>();
    
                // At this point we go through all the tags received and set them as text of the label
                lastLabelPlacedText.text = "I see: \n";
    
                foreach (KeyValuePair<string, float> tag in tagsDictionary)
                {
                    lastLabelPlacedText.text += tag.Key + ", Confidence: " + tag.Value.ToString("0.00 \n");
                }    
            }
        }
    
  5. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

  6. Dans l’Éditeur Unity, cliquez et faites glisser la classe ResultsLabel du dossier Scripts vers l’objet Appareil photo principal dans le panneau hiérarchie.

  7. Cliquez sur l’appareil photo principal et examinez le panneau inspecteur.

Vous remarquerez que du script que vous venez de faire glisser dans l’appareil photo, il y a deux champs : Curseur et Étiquette Prefab.

  1. Faites glisser l’objet appelé Cursor à partir du panneau hiérarchie vers l’emplacement nommé Cursor, comme illustré dans l’image ci-dessous.

  2. Faites glisser l’objet appelé LabelText à partir du dossier ressources dans le panneau Project vers l’emplacement nommé Label Prefab, comme illustré dans l’image ci-dessous.

    Set the reference targets within Unity.

Chapitre 6 : Créer la classe ImageCapture

La classe suivante que vous allez créer est la classe ImageCapture . Cette classe est responsable des opérations suivantes :

  • Capture d’une image à l’aide de la caméra HoloLens et du stockage dans le dossier de l’application.
  • Capture des mouvements d’appui de l’utilisateur.

Pour créer cette classe :

  1. Accédez au dossier Scripts que vous avez créé précédemment.

  2. Cliquez avec le bouton droit dans le dossier, créez > un script C#. Appelez le script ImageCapture.

  3. Double-cliquez sur le nouveau script ImageCapture pour l’ouvrir avec Visual Studio.

  4. Ajoutez les espaces de noms suivants en haut du fichier :

        using System.IO;
        using System.Linq;
        using UnityEngine;
        using UnityEngine.XR.WSA.Input;
        using UnityEngine.XR.WSA.WebCam;
    
  5. Ajoutez ensuite les variables suivantes à l’intérieur de la classe ImageCapture , au-dessus de la méthode Start() :

        public static ImageCapture instance; 
        public int tapsCount;
        private PhotoCapture photoCaptureObject = null;
        private GestureRecognizer recognizer;
        private bool currentlyCapturing = false;
    

La variable tapsCount stocke le nombre de mouvements d’appui capturés à partir de l’utilisateur. Ce nombre est utilisé dans le nommage des images capturées.

  1. Les méthodes Eveil() et Start() doivent maintenant être ajoutées. Celles-ci seront appelées lorsque la classe initialise :

        private void Awake()
        {
            // Allows this instance to behave like a singleton
            instance = this;
        }
    
        void Start()
        {
            // subscribing to the HoloLens API gesture recognizer to track user gestures
            recognizer = new GestureRecognizer();
            recognizer.SetRecognizableGestures(GestureSettings.Tap);
            recognizer.Tapped += TapHandler;
            recognizer.StartCapturingGestures();
        }
    
  2. Implémentez un gestionnaire qui sera appelé lorsqu’un mouvement tap se produit.

        /// <summary>
        /// Respond to Tap Input.
        /// </summary>
        private void TapHandler(TappedEventArgs obj)
        {
            // Only allow capturing, if not currently processing a request.
            if(currentlyCapturing == false)
            {
                currentlyCapturing = true;
    
                // increment taps count, used to name images when saving
                tapsCount++;
    
                // Create a label in world space using the ResultsLabel class
                ResultsLabel.instance.CreateLabel();
    
                // Begins the image capture and analysis procedure
                ExecuteImageCaptureAndAnalysis();
            }
        }
    

La méthode TapHandler() incrémente le nombre d’appuis capturés à partir de l’utilisateur et utilise la position de curseur actuelle pour déterminer où positionner une nouvelle étiquette.

Cette méthode appelle ensuite la méthode ExecuteImageCaptureAndAnalysis() pour commencer les fonctionnalités principales de cette application.

  1. Une fois qu’une image a été capturée et stockée, les gestionnaires suivants sont appelés. Si le processus réussit, le résultat est passé à VisionManager (que vous n’êtes pas encore à créer) pour l’analyse.

        /// <summary>
        /// Register the full execution of the Photo Capture. If successful, it will begin 
        /// the Image Analysis process.
        /// </summary>
        void OnCapturedPhotoToDisk(PhotoCapture.PhotoCaptureResult result)
        {
            // Call StopPhotoMode once the image has successfully captured
            photoCaptureObject.StopPhotoModeAsync(OnStoppedPhotoMode);
        }
    
        void OnStoppedPhotoMode(PhotoCapture.PhotoCaptureResult result)
        {
            // Dispose from the object in memory and request the image analysis 
            // to the VisionManager class
            photoCaptureObject.Dispose();
            photoCaptureObject = null;
            StartCoroutine(VisionManager.instance.AnalyseLastImageCaptured()); 
        }
    
  2. Ajoutez ensuite la méthode utilisée par l’application pour démarrer le processus de capture d’image et stocker l’image.

        /// <summary>    
        /// Begin process of Image Capturing and send To Azure     
        /// Computer Vision service.   
        /// </summary>    
        private void ExecuteImageCaptureAndAnalysis()  
        {    
            // Set the camera resolution to be the highest possible    
            Resolution cameraResolution = PhotoCapture.SupportedResolutions.OrderByDescending((res) => res.width * res.height).First();    
    
            Texture2D targetTexture = new Texture2D(cameraResolution.width, cameraResolution.height);
    
            // Begin capture process, set the image format    
            PhotoCapture.CreateAsync(false, delegate (PhotoCapture captureObject)    
            {    
                photoCaptureObject = captureObject;    
                CameraParameters camParameters = new CameraParameters();    
                camParameters.hologramOpacity = 0.0f;    
                camParameters.cameraResolutionWidth = targetTexture.width;    
                camParameters.cameraResolutionHeight = targetTexture.height;    
                camParameters.pixelFormat = CapturePixelFormat.BGRA32;
    
                // Capture the image from the camera and save it in the App internal folder    
                captureObject.StartPhotoModeAsync(camParameters, delegate (PhotoCapture.PhotoCaptureResult result)
                {    
                    string filename = string.Format(@"CapturedImage{0}.jpg", tapsCount);
    
                    string filePath = Path.Combine(Application.persistentDataPath, filename);
    
                    VisionManager.instance.imagePath = filePath;
    
                    photoCaptureObject.TakePhotoAsync(filePath, PhotoCaptureFileOutputFormat.JPG, OnCapturedPhotoToDisk);
    
                    currentlyCapturing = false;
                });   
            });    
        }
    

Avertissement

À ce stade, vous remarquerez une erreur qui s’affiche dans le panneau console de l’éditeur Unity. Cela est dû au fait que le code fait référence à la classe VisionManager que vous allez créer dans le chapitre suivant.

Chapitre 7 : Appel à Azure et Analyse d’images

Le dernier script que vous devez créer est la classe VisionManager .

Cette classe est responsable des opérations suivantes :

  • Chargement de la dernière image capturée sous la forme d’un tableau d’octets.
  • Envoi du tableau d’octets à votre instance azure Vision par ordinateur API Service pour l’analyse.
  • Réception de la réponse en tant que chaîne JSON.
  • Désérialiser la réponse et transmettre les balises obtenues à la classe ResultsLabel .

Pour créer cette classe :

  1. Double-cliquez sur le dossier Scripts pour l’ouvrir.

  2. Cliquez avec le bouton droit dans le dossier Scripts , cliquez sur Créer un > script C#. Nommez le script VisionManager.

  3. Double-cliquez sur le nouveau script pour l’ouvrir avec Visual Studio.

  4. Mettez à jour les espaces de noms comme suit, en haut de la classe VisionManager :

        using System;
        using System.Collections;
        using System.Collections.Generic;
        using System.IO;
        using UnityEngine;
        using UnityEngine.Networking;
    
  5. En haut de votre script, dans la classe VisionManager (au-dessus de la méthode Start(), vous devez maintenant créer deux classes qui représentent la réponse JSON désérialisée à partir d’Azure :

        [System.Serializable]
        public class TagData
        {
            public string name;
            public float confidence;
        }
    
        [System.Serializable]
        public class AnalysedObject
        {
            public TagData[] tags;
            public string requestId;
            public object metadata;
        }
    

    Notes

    Les classes TagData et AnalyzerObject doivent avoir l’attribut [System.Serializable] ajouté avant que la déclaration puisse être désérialisée avec les bibliothèques Unity.

  6. Dans la classe VisionManager, vous devez ajouter les variables suivantes :

        public static VisionManager instance;
    
        // you must insert your service key here!    
        private string authorizationKey = "- Insert your key here -";    
        private const string ocpApimSubscriptionKeyHeader = "Ocp-Apim-Subscription-Key";
        private string visionAnalysisEndpoint = "https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags";   // This is where you need to update your endpoint, if you set your location to something other than west-us.
    
        internal byte[] imageBytes;
    
        internal string imagePath;
    

    Avertissement

    Veillez à insérer votre clé d’authentification dans la variable authorizationKey . Vous aurez noté votre clé d’authentification au début de ce cours, chapitre 1.

    Avertissement

    La variable visionAnalysisEndpoint peut différer de celle spécifiée dans cet exemple. L’ouest-us fait strictement référence aux instances de service créées pour la région USA Ouest. Mettez à jour cela avec l’URL de votre point de terminaison ; voici quelques exemples de ce qui peut ressembler à ceci :

    • Europe Ouest : https://westeurope.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags
    • Asie sud-est : https://southeastasia.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags
    • Australie Est : https://australiaeast.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags
  7. Le code pour Éveil doit maintenant être ajouté.

        private void Awake()
        {
            // allows this instance to behave like a singleton
            instance = this;
        }
    
  8. Ensuite, ajoutez la coroutine (avec la méthode de flux statique ci-dessous), qui obtient les résultats de l’analyse de l’image capturée par la classe ImageCapture .

        /// <summary>
        /// Call the Computer Vision Service to submit the image.
        /// </summary>
        public IEnumerator AnalyseLastImageCaptured()
        {
            WWWForm webForm = new WWWForm();
            using (UnityWebRequest unityWebRequest = UnityWebRequest.Post(visionAnalysisEndpoint, webForm))
            {
                // gets a byte array out of the saved image
                imageBytes = GetImageAsByteArray(imagePath);
                unityWebRequest.SetRequestHeader("Content-Type", "application/octet-stream");
                unityWebRequest.SetRequestHeader(ocpApimSubscriptionKeyHeader, authorizationKey);
    
                // the download handler will help receiving the analysis from Azure
                unityWebRequest.downloadHandler = new DownloadHandlerBuffer();
    
                // the upload handler will help uploading the byte array with the request
                unityWebRequest.uploadHandler = new UploadHandlerRaw(imageBytes);
                unityWebRequest.uploadHandler.contentType = "application/octet-stream";
    
                yield return unityWebRequest.SendWebRequest();
    
                long responseCode = unityWebRequest.responseCode;     
    
                try
                {
                    string jsonResponse = null;
                    jsonResponse = unityWebRequest.downloadHandler.text;
    
                    // The response will be in Json format
                    // therefore it needs to be deserialized into the classes AnalysedObject and TagData
                    AnalysedObject analysedObject = new AnalysedObject();
                    analysedObject = JsonUtility.FromJson<AnalysedObject>(jsonResponse);
    
                    if (analysedObject.tags == null)
                    {
                        Debug.Log("analysedObject.tagData is null");
                    }
                    else
                    {
                        Dictionary<string, float> tagsDictionary = new Dictionary<string, float>();
    
                        foreach (TagData td in analysedObject.tags)
                        {
                            TagData tag = td as TagData;
                            tagsDictionary.Add(tag.name, tag.confidence);                            
                        }
    
                        ResultsLabel.instance.SetTagsToLastLabel(tagsDictionary);
                    }
                }
                catch (Exception exception)
                {
                    Debug.Log("Json exception.Message: " + exception.Message);
                }
    
                yield return null;
            }
        }
    
        /// <summary>
        /// Returns the contents of the specified file as a byte array.
        /// </summary>
        private static byte[] GetImageAsByteArray(string imageFilePath)
        {
            FileStream fileStream = new FileStream(imageFilePath, FileMode.Open, FileAccess.Read);
            BinaryReader binaryReader = new BinaryReader(fileStream);
            return binaryReader.ReadBytes((int)fileStream.Length);
        }  
    
  9. Veillez à enregistrer vos modifications dans Visual Studio avant de revenir à Unity.

  10. Dans l’Éditeur Unity, cliquez et faites glisser les classes VisionManager et ImageCapture du dossier Scripts vers l’objet Appareil photo principal dans le panneau Hiérarchie.

Chapitre 8 – Avant la construction

Pour effectuer un test approfondi de votre application, vous devez le charger sur votre HoloLens. Avant de procéder, assurez-vous que :

  • Tous les paramètres mentionnés dans le chapitre 2 sont correctement définis.
  • Tous les scripts sont attachés à l’objet Main Camera .
  • Tous les champs du Panneau d’inspecteur de caméra principal sont attribués correctement.
  • Veillez à insérer votre clé d’authentification dans la variable authorizationKey .
  • Vérifiez que vous avez également vérifié votre point de terminaison dans votre script VisionManager et qu’il s’aligne sur votre région (ce document utilise par défaut west-us ).

Chapitre 9 : Créer la solution UWP et charger l’application

Tout ce qui est nécessaire pour la section Unity de ce projet a maintenant été terminé. Il est donc temps de le générer à partir d’Unity.

  1. Accédez à Générer ParamètresFile > Build Paramètres... -

  2. Dans la fenêtre Build Paramètres, cliquez sur Générer.

    Building the app from Unity

  3. Si ce n’est pas déjà le cas, cochez Les projets Unity C#.

  4. Cliquez sur Générer. Unity lance une fenêtre Explorateur de fichiers, où vous devez créer, puis sélectionner un dossier dans lequel générer l’application. Créez ce dossier maintenant et nommez-le App. Ensuite, avec le dossier d’application sélectionné, appuyez sur Sélectionner un dossier.

  5. Unity commence à générer votre projet dans le dossier d’application .

  6. Une fois que Unity a terminé la génération (cela peut prendre un certain temps), il ouvre une fenêtre Explorateur de fichiers à l’emplacement de votre build (vérifiez votre barre des tâches, car il peut ne pas toujours apparaître au-dessus de vos fenêtres, mais vous informera de l’ajout d’une nouvelle fenêtre).

Chapitre 10 : Déployer sur HoloLens

Pour effectuer un déploiement sur HoloLens :

  1. Vous aurez besoin de l’adresse IP de votre HoloLens (pour le déploiement à distance) et de vous assurer que votre HoloLens est en mode développeur. Pour ce faire :

    1. Tout en portant votre HoloLens, ouvrez le Paramètres.
    2. Accédez à Network & Internet > Wi-Fi > Options avancées
    3. Notez l’adresse IPv4 .
    4. Ensuite, revenez à Paramètres, puis à Mettre à jour & la sécurité > pour les développeurs
    5. Définissez le mode développeur activé.
  2. Accédez à votre nouvelle build Unity (dossier d’application) et ouvrez le fichier solution avec Visual Studio.

  3. Dans la configuration de la solution, sélectionnez Déboguer.

  4. Dans la plateforme de solution, sélectionnez x86, Ordinateur distant.

    Deploy the solution from Visual Studio.

  5. Accédez au menu Générer, puis cliquez sur Déployer la solution pour charger une version test de l’application sur votre HoloLens.

  6. Votre application doit maintenant apparaître dans la liste des applications installées sur votre HoloLens, prêtes à être lancées !

Notes

Pour effectuer un déploiement sur un casque immersif, définissez la plateforme de solution sur Ordinateur local et définissez la configuration sur Déboguer, avec x86 comme plateforme. Ensuite, déployez sur l’ordinateur local, à l’aide du menu Générer, en sélectionnant Déployer la solution.

Votre application API Vision par ordinateur terminée

Félicitations, vous avez créé une application de réalité mixte qui tire parti de l’API Azure Vision par ordinateur pour reconnaître les objets réels et afficher la confiance de ce qui a été vu.

lab outcome

Exercices bonus

Exercice 1

Tout comme vous avez utilisé le paramètre Tags (comme indiqué dans le point de terminaison utilisé dans VisionManager), étendez l’application pour détecter d’autres informations ; examinez les autres paramètres que vous avez accès à HERE.

Exercice 2

Affichez les données Azure retournées, de manière plus conversationnelle et lisible, peut-être masquage des nombres. Comme si un bot peut parler à l’utilisateur.