Naredimo aplikacijo za razširjeno resničnost za MEMES !: 8 korakov

2024 Avtor: John Day | [email protected]. Nazadnje spremenjeno: 2024-01-30 12:07

V tem navodilu bomo izdelali aplikacijo za razširjeno resničnost za Android in IOS v Unity3D, ki uporablja Googlov API za iskanje memov. V Unityju bomo uporabili Vuforijino zaznavanje talne ravnine, tako da bo ta mobilna aplikacija delovala za večino uporabnikov Android in IOS. Uporaba Vuforie nam bo omogočila tudi, da bodo slike zasidrane na enem mestu, tako da se lahko sprehodimo po tem polju slik in predmeti ostanejo tam, kjer so.

Preizkusili bomo tudi novi IBM Watson API, da bomo lahko ta iskanja izvajali z glasom in uporabili njihovo obdelavo v naravnem jeziku.

Slaba novica torej ni, da noben od teh API -jev ni popolnoma brezplačen, dobra pa je, da lahko oba poskusita. Googlov API za iskanje po meri vam omogoča 100 brezplačnih iskanj na dan, IBM Watson API pa prvi mesec brezplačno.

Skratka, ta aplikacija bo naš govor dobila iz mikrofona v Unityju in jo poslala na strežnike IBM Watson, ki nam bodo vrnili besedilo. Nato bomo vzeli to besedilo in ga poslali Googlovim strežnikom, ki nam bodo vrnili seznam URL -jev slik v obliki JSON.

1. korak: Nastavite IBM Watson SDK v Unity

Za zagon Watson API -ja morate najprej pridobiti poverilnice z njihovega spletnega mesta. Pojdite na Console.bluemix.net, ustvarite in ustvarite račun ter se prijavite. Pojdite v svoj IBM -ov račun in se pomaknite do organizacij za livarstvo v oblaku in ustvarite nov prostor. Zdaj pojdite na nadzorno ploščo in kliknite za brskanje po storitvah, dodajte govor v besedilno storitev, ker bomo to uporabljali. Izberite svojo regijo, organizacijo in prostor ter ustvarite projekt. Zdaj boste na dnu videli poverilnice za API.

Prenesite Unity, če ga še nimate, in uvozite SDK IBM Watson iz shrambe sredstev v Unityju. To lahko preizkusimo tako, da ustvarimo prazen objekt igre in ga pokličemo IBM Watson ter dodamo primer pretočnega skripta. Ta skript je že nastavljen za snemanje zvoka iz enote in pošiljanje v strežnike Watson za obdelavo.

Zaenkrat bomo uporabili ta primer skripta, ker imamo še veliko dela, morda pa se bomo naslednjič lahko poglobili v stvari Watsona, ker bi rad naredil nekaj z Vision API -jem.

Korak: Preizkusite IBM Watson Text to Speech

Ta skript išče besedilni objekt uporabniškega vmesnika, zato ustvarimo nov gumb uporabniškega vmesnika, ki nam bo dal besedilo, ki ga potrebujemo, gumb bomo uporabili kasneje. Nastavite platno za merjenje velikosti zaslona in nekoliko spremenite velikost gumba. Sidrite ga spodaj levo. Besedilo povlecite v prazno režo. Odprite skript in omogočite dodajanje poverilnic IBM Watson, poiščite, kje se uporablja besedilo "resultsField", in ga nastavite samo na "alt.transcript", ker bomo to besedilo uporabili za iskanje v Googlu. Zdaj, preden lahko to preizkusimo, moramo dinamično prilagoditi velikost besedila, tako da bo vse, kar rečemo, ustrezalo okvirju. Vrnite se na besedilo in ga nastavite tako, da se najbolje prilega. Vnesite nekaj besedila, da ga preizkusite. Ko bomo kliknili na predvajanje, bodo naše besede prepisane v besedilo iz API -ja Watson Text to Speech.

3. korak: Nastavite Googlov API za iskanje po meri

Naslednji del, ki ga moramo narediti, je, da nastavimo Googlov API za iskanje po meri za uporabo v Unityju. Na visoki ravni bomo od Unity zahtevali HTTP do Googlovih strežnikov, kar nam bo vrnilo odgovor v obliki JSON.

Zato pojdite na stran za nastavitev API -ja JSON za iskanje po meri, kliknite, da dobite ključ API -ja in ustvarite novo aplikacijo. Naj bo to odprto. Zdaj lahko gremo na nadzorno ploščo. Vnesite kar koli za spletna mesta za iskanje, poimenujte ga kakor koli in kliknite ustvari.

Kliknite nadzorno ploščo in omogočite nekaj sprememb: želimo predvsem iskati meme in vklopiti iskanje slik. Pod spletnimi mesti za iskanje preklopite na celoten splet. Če želite shraniti vse, kliknite posodobitev.

Zdaj poiščite google api explorer in pojdite na API za iskanje po meri. Tako bomo lahko oblikovali odgovor JSON, ki ga dobimo od Googla. Zato za poizvedbo zaenkrat vnesite karkoli, prilepite ID iskalnika, vnesite 1 za filter, da ne dobimo dvojnikov, vnesite 10 pod številko, ker je to največje število rezultatov, ki jih lahko vrnemo naenkrat, vnesite sliko za vrsto iskanja, ker je to vse, kar želimo vrniti. Za začetek vnesite 1 in na koncu pod polji vnesite "items/link", ker za vsak vrnjeni element želimo le slikovno povezavo. Sedaj, ko kliknete na izvedbo, boste videli, da dobimo 10 lepih povezav do slik.

Zdaj moramo te slike spraviti v Unity.

4. korak: Nastavite Vuforia v Unity

Začnimo delovati Vuforia, da bomo lahko uporabili njihovo zaznavanje talne ravnine. Shranite svoj trenutni prizor in pojdite na nastavitve gradnje. Preklopite svojo platformo na Android ali IOS in če imate v sistemu IOS nekaj za identifikator svežnja, dodajte opis uporabe kamere in mikrofona. Pri nastavitvah XR preverite, ali je podprta razširjena resničnost Vuforia.

Zdaj v prizoru izbrišite glavno kamero in dodajte Vuforia ARCamera. Pojdite na razdelek konfiguracije in spremenite način sledenja v položaj. Počistite vse baze podatkov, ker jih ne potrebujemo.

Zdaj dodajte iskalnik ravnin in preglasiti moramo njegovo privzeto vedenje, ker želimo stopnjo zemeljske ravnine uvesti le enkrat, zato poiščimo skript Deploy Stage enkrat na spletnem mestu Vuforia. Prinesite ta skript v Unity in ga postavite na iskalnik letala, pri čemer odstranite stari skript, ki je bil tam. Spremenite način v interaktivni in se prepričajte, da je funkcija "OnInteractiveHitTest" poklicana na tem dogodku Unity. Ko smo tukaj, nastavimo gumb, ki smo ga naredili prej, na aktiven, ko najdemo osnovno ravnino, njegovo privzeto stanje nastavimo na neaktiven. Zdaj v prizor postavite zemeljsko ravnino in jo spremenite v sredino, ker želimo, da vse slike lebdijo v zraku. Povlecite to zemeljsko ravnino v prazno režo iskalnika ravnin.

5. korak: Ustvarite montažno sliko

Preden začnemo sestavljati vse te dele, moramo ustvariti montažni objekt igre, ki ga lahko izdelamo vsakič, ko se slika naloži. Ustvarite torej prazen predmet igre pod stopnjo talne ravnine in ga pokličite "picPrefab". Ustvarite štirikolesnik kot otrok tega in ga povečajte za 2, zavrtite njegov y za 180 stopinj, tako da je vektor staršev naprej, ki je prikazan kot modra puščica, sprednji del štirikolesnika.

Ustvarite nov skript z imenom "PictureBehavior" in ga dodajte v naš picPrefab.

Zdaj povlecite to montažno sliko v mapo sredstev in na to bomo postavili vsako sliko.

Naš skript "PictureBehavior" bi moral izgledati tako:

z uporabo System. Collections;

z uporabo System. Collections. Generic; z uporabo UnityEngine; PictureBehavior javnega razreda: MonoBehaviour {public Renderer quadRenderer; zasebni Vector3 zaželena pozicija; void Start () {// poglejte kamero transform. LookAt (Camera.main.transform); Vector3 desireAngle = nov Vector3 (0, transform.localEulerAngles.y, 0); transform.rotation = Quaternion. Euler (želeni kot); // sila v zrak želenaPosition = transform.localPosition; transform.localPosition += nov Vector3 (0, 20, 0); } void Update () {transform.localPosition = Vector3. Lerp (transform.localPosition, desirePosition, Time.deltaTime * 4f); } public void LoadImage (URL niza) {StartCoroutine (LoadImageFromURL (url)); } IEnumerator LoadImageFromURL (URL niza) {WWW www = nov WWW (url); donos donosa www; quadRenderer.material.mainTexture = www.texture; }}

6. korak: Ustvarite skript za Googlov API

Zdaj pa povlecimo sklic na upodabljalnik štirikotnikov iz našega "picPrefab".

Na voljo sta nam le še dva skripta, zato ustvarimo skript C#, imenovan GoogleService.cs in PictureFactroy.cs.

Znotraj »GoogleService« prilepite to kodo, ki poda našo zahtevo:

z uporabo System. Collections;

z uporabo System. Collections. Generic; z uporabo UnityEngine; z uporabo UnityEngine. UI; javni razred GoogleService: MonoBehaviour {public PictureFactory pictureFactory; javno besedilo buttonText; private const string API_KEY = "VSTAVI API KLJUČ TUKAJ !!!!!"; public void GetPictures () {StartCoroutine (PictureRoutine ()); } IEnumerator PictureRoutine () {buttonText.transform.parent.gameObject. SetActive (false); niz poizvedba = buttonText.text; poizvedba = WWW. EscapeURL (poizvedba + "memi"); // izbrišemo stare slike pictureFactory. DeleteOldPictures (); // shranimo vektor kamere naprej, da se lahko premikamo med postavitvijo predmetov Vector3 cameraForward = Camera.main.transform.forward; // naenkrat lahko dobimo le 10 rezultatov, zato moramo ponoviti in shraniti svoj napredek pri spreminjanju začetne številke po vsakih 10 int rowNum = 1; za (int i = 1; i <= 60; i + = 10) {string url = "https://www.googleapis.com/customsearch/v1?q=" + poizvedba + "& cx = 011535004225295624669%3Afeb1gwic6bs & filter = 1 & num = 10 & searchType = image & start = " + i +" & fields = items%2Flink & key = " + API_KEY; WWW www = nov WWW (url); donos donosa www; pictureFactory. CreateImages (ParseResponse (www.text), rowNum, cameraForward); rowNum ++; } yield return new WaitForSeconds (5f); buttonText.transform.parent.gameObject. SetActive (true); } List ParseResponse (besedilo niza) {List urlList = nov List (); string urls = text. Split ('\ n'); foreach (vrstica niza v URL-jih) {if (line. Contains ("link")) {string url = line. Substring (12, line. Length-13); // Zdi se, da Googlovo filtriranje po png ali jpg ne deluje, zato to storimo tukaj: if (url. Contains (".jpg") || url. Contains (".png")) {urlList. Add (url); }}} return urlList; }}

7. korak: Ustvarite našo tovarno slik

Znotraj PictureFactory.cs je ta koda ustvarjena za ustvarjanje vseh naših slik in nalaganje njihovih tekstur iz URL -ja.

z uporabo System. Collections;

z uporabo System. Collections. Generic; z uporabo UnityEngine; PictureFactory javnega razreda: MonoBehaviour {public GameObject picPrefab; javna storitev GoogleService googleService; public void DeleteOldPictures () {if (transform.childCount> 0) {foreach (Transform child in this.transform) {Destroy (child.gameObject); }}} public void CreateImages (ListurlList, int resultNum, Vector3 camForward) {int picNum = 1; Vector3 center = Camera.main.transform.position; foreach (niz niza v urlList) {Vector3 pos = GetPosition (picNum, resultNum, camForward); GameObject pic = Instantiate (picPrefab, pos, Quaternion.identity, this.transform); pic. GetComponent (). LoadImage (url); picNum ++; }} Vector3 GetPosition (int picNum, int rowNum, Vector3 camForward) {Vector3 pos = Vector3.zero; if (picNum <= 5) {pos = camForward + nov Vector3 (picNum * -3, 0, rowNum * 3.5f); } else {pos = camForward + new Vector3 ((picNum % 5) * 3, 0, rowNum * 3.5f); } return pos; }}

8. korak: Končali smo

Ustvarite prazen predmet igre, imenovan GoogleService, in vanj vnesite skript »GoogleSerivice«.

Povlecite skript "PictureFactory" na oder talne ravnine, ker bodo vse naše slike nastale kot otroci tega predmeta igre.

Povlecite ustrezne reference v inšpektorju, naredite enako za Googlovo storitev.

Zadnja stvar, ki jo moramo storiti, je, da se pokliče funkcija »GetPictures«. Pojdimo torej na dogodek »onClick« našega gumba in ga pokličimo od tam.

Zdaj lahko kliknemo na play in to preizkusimo. Omogočite stopnjo talne ravnine in gumb. Izgovorite besedo in kliknite gumb za iskanje po tem besedilu!

Zdaj, če želite to aplikacijo namestiti v telefon, jo priključite in pojdite na Datoteka-> Nastavitve zgradbe. Zgradi in teči!

Sporočite mi v komentarjih, če imate kakršna koli vprašanja!