Faire une application de réalité augmentée tueur: 7 étapes

Faire une application de réalité augmentée tueur: 7 étapes

Table des matières:

Anonim

Ce tutoriel va vous montrer comment utiliser les API dans Unity afin de rendre vos applications de réalité augmentée plus intelligentes. Tout va être orienté vers les débutants. Nous utiliserons le moteur de jeu vidéo Unity 3D, car cela nous permettra de créer des applications multiplateformes qui fonctionneront sur IOS ou Android. Le plug-in Vuforia nous permettra d'accéder au flux de caméras et la classe WWW d'Unity nous permettra de communiquer avec les API via le protocole http. C'est le même mécanisme que celui utilisé pour accéder aux sites Web de votre navigateur.

Je pense que l’application la plus meurtrière de la réalité augmentée n’est pas le jeu, mais l’utilisation de la RA comme outil pour améliorer votre perception actuelle de la réalité. Pour ce faire, vous devez créer des applications connectées qui exploitent la puissance d’Internet.

En ce qui concerne les logiciels, vous aurez besoin d’Unity 3D:

et le kit de développement logiciel Vuforia:

Provisions:

Étape 1: Classe WWW d'Unity

La classe WWW de Unity est donc la première étape de cette opération car elle vous permet de faire des requêtes via http à un serveur. Lorsque vous visitez un site Web, vous écrivez une URL dans votre navigateur et envoyez une requête http au serveur situé à cette adresse.Le serveur Web vous renvoie le code HTML que votre navigateur utilise pour afficher la page Web.

Étape 2: Permet de faire une demande

Pour illustrer cela, adressons une demande à www.unity.com.

Commencez un nouveau projet d'unité, créez un script C # appelé test et faites-le glisser sur votre caméra principale.

Tout d’abord, créez une requête appelée énumérateur, nous souhaitons utiliser des objets www dans une coroutine afin de ne pas interrompre l’ensemble du programme pendant le traitement de la situation. Ensuite, assurons-nous que ce code sera exécuté en démarrant la coroutine dans la fonction de démarrage.

À l’intérieur de la coroutine, permet de créer une chaîne et de la définir comme adresse Web vers Unity.

Créez un nouvel objet www et transmettez l'URL.

Yield return www (afin que nous ne continuions pas tant que cette opération n’est pas terminée).

Créez une chaîne appelée html et définissez-la en tant que www.text, chaîne de texte renvoyée à partir de notre demande.

Lorsque nous imprimerons ceci, nous verrons qu'il s'agit du code HTML du site unity.com.

Étape 3: Introduction à la Web Scraping.

Maintenant, sans entrer dans les api, nous pourrions analyser ces données pour extraire des informations utiles de sites Web à utiliser dans notre application. Ceci s'appelle le raclage de Web. Disons par exemple que nous voulons extraire le titre de la page Web.

Nous savons par le langage HTML standard que le titre sera entre deux balises de titre.

Un titre de début et une balise de titre de fin: C'est le titre de la page Web

Sachez simplement qu'il existe des moyens plus efficaces et plus propres de le faire, mais pour gagner du temps, manipulons simplement la chaîne pour extraire ce que nous voulons.

À l'heure actuelle, nous avons une chaîne séparée par des caractères individuels. Ainsi, lorsque nous imprimons html 2, nous obtenons le troisième caractère (car les index commencent à 0). Permet à la place de créer une liste de chaînes et de la scinder par le caractère de nouvelle ligne. Maintenant, lorsque nous imprimons htmlList 2, nous obtenons la troisième ligne de texte.

Pour trouver la ligne contenant «title», nous pouvons parcourir chaque ligne de texte à l'aide d'une boucle for.

Nous pouvons trouver la ligne souhaitée en vérifiant si la ligne actuelle contient le mot titre. Une fois que nous avons trouvé cette ligne, nous pouvons remplacer la première balise de titre par une chaîne vide, puis remplacer la deuxième balise de titre par une chaîne vide. Permet d’imprimer le résultat et nous pourrons alors faire une pause ici car nous n’avons pas besoin d’aller plus loin. Le résultat contiendra maintenant le titre de la page Web. Si vous souhaitez une méthode plus performante, mais légèrement plus compliquée, consultez les expressions régulières ou REGEX.

Étape 4: API

Voyons maintenant comment effectuer une demande d'API réelle. Nous allons utiliser l'API Google Custom Search. Nous avons d’abord besoin d’une clé unique. Alors, recherchez google clé de recherche personnalisée api et allez sur le premier lien. Créez un compte si vous n'en avez pas déjà et créez une application. Activez l'API de recherche personnalisée pour cette application et copiez la clé dans votre presse-papiers.

Vous pouvez effectuer 100 recherches par jour gratuitement avec cette API particulière.

Étape 5: Bonjour, je suis JSON, ravi de vous rencontrer.

Revenez à Unity et commençons par supprimer tout jusqu'à ce que nous définissions notre chaîne html. Permet de renommer ce "json" car nous allons récupérer un objet JSON. Permet simplement de copier notre clé API n'importe où pour le moment.

Retournez sur google et cliquez sur "Using Rest." Si vous regardez autour de vous, vous constaterez que l'API nécessite 3 paramètres, la clé de l'API, un identifiant de moteur de recherche personnalisé et une requête de recherche. Copiez l'exemple de requête et collez-le dans la chaîne d'URL dans Unity.

Déplacez votre clé de licence à l'emplacement approprié dans l'URL et, comme nous n'allons pas créer de moteur de recherche personnalisé, changez le paramètre cx en cref et faites-en une chaîne vide.

Créez une variable de chaîne privée appelée query et définissez-la égale à celle que vous souhaitez rechercher. Retournez à l'URL et supprimez tout ce qui suit "q =" et concaténez la chaîne avec la variable de requête que nous venons de définir. Maintenant, lorsque nous imprimerons la réponse, nous aurons tous les résultats Google organisés en objets JSON ordonnés.

Étape 6: Maintenant quoi?

Génial, nous avons maintenant plus de charabia.

Eh bien, vous pouvez extraire ce que vous voulez en utilisant une bibliothèque appelée LitJSON.

github.com/lbv/litjson

Cela nous permettrait de traiter soigneusement toutes ces informations.

Pour une solution rapide, vous pouvez simplement l’analyser comme nous l’avons fait avec le code HTML du dernier exemple.

Maintenant, pour que cela soit visible dans la vue du jeu, cliquez avec le bouton droit de la souris dans la hiérarchie de Unity et créez un nouveau texte d'interface utilisateur.

Ajoutez cette directive using à votre script: "UnityEngine.UI;"

Créez maintenant une référence au texte de l'interface utilisateur en définissant un GameObject public yourTextObject;

Faites glisser le texte dans l'emplacement vide qui vient d'être créé dans l'inspecteur.

Maintenant, vous pouvez simplement le définir comme ceci:

yourTextObject.GetComponent().text = "Tout ce que vous voulez."

Étape 7: Allons plus loin …

J'ai réalisé ce didacticiel parce que j'ai beaucoup appris en essayant de trouver une solution de contournement au manque d'API de recherche d'images inversées gratuite. Google vous permet d'effectuer une recherche d'image inversée dans le navigateur, mais pas via http comme tous les autres services.

J'étais déterminé à faire en sorte que cela fonctionne, alors voici ce que j'ai fait:

Il s’avère que le résultat d’une requête adressée à la recherche d’images inverses google est redirigé à plusieurs reprises et est finalement rendu au format HTML via javascript. Donc, obtenir les données dont nous avons besoin n’est pas possible dans Unity à lui seul. La seule façon dont je pouvais penser à l'obtenir était de créer ma propre api de toutes sortes en php. Je pourrais transmettre l'URL de l'image que je souhaite rechercher dans Unity à un script php hébergé sur un serveur. Le script php suit les redirections de Google à l'aide de cURL et permet d'afficher le code HTML rendu en javascript à l'aide de Node.js, un environnement javascript côté serveur.

Si vous souhaitez en savoir plus à ce sujet, regardez la vidéo dans l'intro.

Merci de regarder et laissez-moi savoir si vous avez des questions!