Tehdään lisätyn todellisuuden sovellus MEMESille!: 8 vaihetta

2024 Kirjoittaja: John Day | [email protected]. Viimeksi muokattu: 2024-01-30 09:03

Tässä Instructable -ohjelmassa aiomme tehdä lisätyn todellisuuden sovelluksen Androidille ja IOS: lle Unity3D: ssä, joka käyttää Google -sovellusliittymää meemien etsimiseen. Käytämme Vuforian maatasotunnistusta Unityssä, joten tämä mobiilisovellus toimii useimmille Android- ja IOS -käyttäjille. Vuforian avulla voimme myös ankkuroida kuvat yhteen paikkaan, jotta voimme kävellä tämän kuvakentän läpi ja esineet pysyvät paikoillaan.

Testaamme myös uutta IBM Watson -sovellusliittymää, jotta voimme tehdä nämä haut äänellämme ja hyödyntää niiden luonnollista kielikäsittelyä.

Joten huonot uutiset eivät ole kumpikaan näistä sovellusliittymistä täysin ilmaisia, mutta hyvä uutinen on, että molemmat voivat vapaasti kokeilla. Googlen mukautetun haun sovellusliittymä tarjoaa sinulle 100 ilmaista hakua päivässä, ja IBM Watson -sovellusliittymä antaa sinulle ensimmäisen kuukauden maksutta.

Lyhyesti sanottuna tämä sovellus saa puheemme Unityn mikrofonista, lähetä se IBM Watson -palvelimille, jotka palauttavat meille tekstin. Otamme tämän tekstin ja lähetämme sen Googlen palvelimille, jotka palauttavat meille luettelon kuvan URL -osoitteista JSON -muodossa.

Vaihe 1: Asenna IBM Watson SDK Unityssä

Jotta saat Watson -sovellusliittymän käyttöön, sinun on ensin hankittava kirjautumistietosi heidän sivustoltaan. Siirry osoitteeseen Console.bluemix.net, luo ja luo tili ja kirjaudu sisään. Siirry IBM -tiliisi ja siirry pilvivalimo -organisaatioihin ja luo uusi tila. Siirry nyt hallintapaneeliin ja selaa palveluita napsauttamalla, lisää puhe tekstipalveluun, koska sitä aiomme käyttää. Valitse alue, organisaatio ja tila ja luo projekti. Nyt näet sovellusliittymän kirjautumistiedot alareunassa.

Lataa Unity, jos sinulla ei vielä ole sitä, ja tuo IBM Watson SDK Unityn resurssikaupasta. Voimme testata tämän luomalla tyhjän peliobjektin ja kutsumalla sitä IBM Watsoniksi ja lisäämällä esimerkin suoratoistoskriptistä. Tämä skripti on jo asetettu tallentamaan ääntä yhtenäisyydestä ja lähettämään sen Watsonin palvelimille käsiteltäväksi.

Käytämme toistaiseksi vain tätä esimerkkiskriptiä, koska meillä on paljon enemmän tehtävää, mutta ehkä seuraavalla kerralla voimme mennä syvemmälle Watsonin juttuihin, koska haluaisin tehdä jotain Vision API: n kanssa.

Vaihe 2: Testaa IBM Watson Text to Speech

Tämä skripti etsii käyttöliittymätekstiobjektia, joten voit luoda uuden käyttöliittymäpainikkeen, jolloin saat tarvitsemamme tekstin. Käytämme painiketta myöhemmin. Aseta kangas skaalaamaan näytön koon mukaan ja muuta painikkeen kokoa hieman. Kiinnitä se vasempaan alakulmaan. Vedä teksti tyhjään paikkaan. Avaa skripti ja anna meidän lisätä IBM Watson -tunnuksemme, etsi, missä "resultsField" -tekstiä käytetään, ja aseta se vain "alt.transcript", koska aiomme käyttää tätä tekstiä Google -haussa. Ennen kuin voimme testata tätä, meidän on tehtävä tekstin koko dynaamisesti, jotta sanomamme mahtuvat laatikon sisälle. Palaa tekstiin ja aseta se parhaiten sopivaksi. Kirjoita teksti ja kokeile sitä. Kun napsautamme toistoa, sanamme transkriboidaan tekstiksi Watsonin tekstistä puheeksi -sovellusliittymästä.

Vaihe 3: Määritä Googlen täsmähaun sovellusliittymä

Seuraava asia, joka meidän on tehtävä, on saada Googlen mukautetun haun api käyttöön Unityssä. Teemme korkealla tasolla Unityn HTTP -pyynnön Googlen palvelimille, joka palauttaa meille vastauksen JSON -muodossa.

Siirry siis Googlen täsmähaun JSON -sovellusliittymän asetussivulle, hae sovellusliittymäavain ja luo uusi sovellus napsauttamalla. Pidä tämä auki. Nyt voimme siirtyä ohjauspaneeliin. Kirjoita mitä tahansa sivustoille haettavaksi, nimeä se millä tahansa ja napsauta Luo.

Napsauta ohjauspaneelia ja anna tehdä joitain muutoksia: haluamme etsiä lähinnä meemejä ja ottaa kuvahaun käyttöön. Vaihda se koko verkkoon haettavien sivustojen alla. Tallenna kaikki napsauttamalla päivitys.

Etsi nyt google api explorer ja siirry täsmähaun sovellusliittymään. Näin voimme muotoilla Googlelta saamamme JSON -vastauksen. Joten kirjoita mitä tahansa kyselyä varten toistaiseksi, liitä hakukoneesi tunnus, laita 1 suodattimeen, jotta emme saa kaksoiskappaleita. Laita 10 numeron alle, koska se on enimmäismäärä tuloksia, joita voimme palauttaa kerrallaan, laita kuva hakutyyppiksi, koska se on kaikki mitä haluamme palauttaa. Kirjoita aluksi 1 ja lopuksi kenttien alle "items/link", koska haluamme jokaiselle palautetulle tuotteelle vain kuvalinkin. Nyt kun valitset suorita, näet, että saamme takaisin 10 mukavaa kuvalinkkiä.

Nyt meidän on saatava nämä kuvat Unityyn.

Vaihe 4: Aseta Vuforia Unityyn

Saadaan Vuforia toimimaan, jotta voimme hyödyntää heidän maatasotunnistustaan. Tallenna nykyinen kohtauksesi ja siirry rakennusasetuksiin. Vaihda käyttöympäristösi Android- tai IOS -järjestelmään ja jos käytät IOS -laitettasi jotain niputunnisteeseen, lisää kameran ja mikrofonin käyttökuvaus. Tarkista XR -asetuksissa Vuforian lisätyn todellisuuden tuki.

Poista kohtauksesta nyt pääkamera ja lisää Vuforia ARCamera. Siirry määritysosioon ja vaihda seurantatila paikannustilaan. Poista kaikkien tietokantojen valinta, koska emme tarvitse niitä.

Lisää nyt koneen etsin ja meidän on ohitettava sen oletuskäyttäytyminen, koska haluamme ottaa maatasoaseman käyttöön vain kerran, joten voimme löytää Deploy Stage -kirjoituksen Vuforian verkkosivustolta. Tuo skripti Unityyn ja laita se koneen etsimään poistamalla vanha komentosarja, joka siellä oli. Vaihda tila vuorovaikutteiseksi ja varmista, että "OnInteractiveHitTest" -toiminto kutsutaan Unity -tapahtumaan. Kun olemme täällä, asetetaan aiemmin tekemämme painike aktiiviseksi, kun olemme löytäneet maatason, aseta sen oletustila ei -aktiiviseksi. Laita nyt maataso kohtaukseen ja vaihda se keskelle ilmaa, koska haluamme, että kaikki kuvat kelluvat ilmassa. Vedä tämä maataso koneen etsimen tyhjään paikkaan.

Vaihe 5: Luo esivalmistelut

Ennen kuin aloitamme kaikkien näiden osien yhdistämisen, meidän on luotava esivalmistettu peliobjekti, jonka voimme havainnollistaa aina, kun kuva ladataan. Luo siis tyhjä peliobjekti maatason alle ja kutsu sitä "picPrefab". Luo quad sen lapsena ja skaalaa sitä 2: lla, kierrä sen y: tä 180 astetta niin, että vanhempien eteenpäin suuntaava vektori, joka näkyy sinisenä nuolena, on nelosen etuosa.

Luo uusi komentosarja nimeltä "PictureBehavior" ja lisää se picPrefab -ohjelmaan.

Vedä nyt tämä kuva -esivalmiste omaisuutesi kansioon, ja tähän aiomme laittaa jokaisen kuvan.

"PictureBehavior" -skriptimme pitäisi näyttää tältä:

System. Collectionsin avulla;

käyttämällä System. Collections. Generic; käyttämällä UnityEngineä; public class PictureBehavior: MonoBehaviour {public Renderer quadRenderer; yksityinen Vector3 toivottu sijainti; void Start () {// katso kameran muunnosta. LookAt (Camera.main.transform); Vector3 toivottuAngle = new Vector3 (0, transform.localEulerAngles.y, 0); transform.rotation = Quaternion. Euler (toivottu kulma); // pakottaa ilmaan haluttuPosition = transform.localPosition; transform.localPosition += uusi Vector3 (0, 20, 0); } mitätön päivitys () {transform.localPosition = Vector3. Lerp (transform.localPosition, toivottu sijainti, aika.delta -aika * 4f); } public void LoadImage (merkkijonon URL -osoite) {StartCoroutine (LoadImageFromURL (url)); } IEnumerator LoadImageFromURL (merkkijonon URL -osoite) {WWW www = uusi WWW (url); tuotto www; quadRenderer.material.mainTexture = www.tekstuuri; }}

Vaihe 6: Luo skripti Google -sovellusliittymälle

Vedetään nyt viittaus quad -renderöintiin "picPrefab" -palvelusta.

Meillä on vain kaksi skriptiä jäljellä, joten voimme luoda C# -skriptin nimeltä GoogleService.cs ja PictureFactroy.cs.

Liitä GoogleService -palveluun tämä koodi, joka tekee pyynnön:

System. Collectionsin avulla;

käyttämällä System. Collections. Generic; käyttämällä UnityEngineä; käyttämällä UnityEngine. UI; public class GoogleService: MonoBehaviour {public PictureFactory pictureFactory; julkinen Teksti -painikeTeksti; private const string API_KEY = "PUT API API TÄSTÄ !!!!!"; public void GetPictures () {StartCoroutine (PictureRoutine ()); } IEnumerator PictureRoutine () {buttonText.transform.parent.gameObject. SetActive (false); merkkijono kysely = buttonText.text; query = WWW. EscapeURL (kysely + "meemit"); // poista vanhat kuvat pictureFactory. DeleteOldPictures (); // tallenna kameran eteenpäinvektori, jotta voimme liikkua, kun kohteita sijoitetaan Vector3 cameraForward = Camera.main.transform.forward; // voimme saada vain 10 tulosta kerrallaan, joten meidän on kierrettävä läpi ja tallennettava edistymisemme muuttamalla aloitusnumeroa joka 10. int riviNum = 1; for (int i = 1; i <= 60; i + = 10) {string url = "https://www.googleapis.com/customsearch/v1?q=" + query + "& cx = 011535004225295624669%3Afeb1gwic6bs & filter = 1 & num = 10 & searchType = image & start = " + i +" & fields = items%2Flink & key = " + API_KEY; WWW www = uusi WWW (url); tuotto www; pictureFactory. CreateImages (ParseResponse (www.text), rowNum, cameraForward); rowNum ++; } tuotto uusi WaitForSeconds (5f); buttonText.transform.parent.gameObject. SetActive (tosi); } Lista ParseResponse (merkkijonoteksti) {List urlList = new List (); string urls = text. Split ('\ n'); foreach (merkkijono URL-osoitteissa) {if (line. Contains ("link")) {string url = line. Substring (12, line. Length-13); // png- tai jpg -suodatus ei näytä toimivan Googlesta, joten teemme sen täällä: if (url. Contains (".jpg") || url. Contains (".png")) {urlList. Add (url); }}} return urlList; }}

Vaihe 7: Luo kuvatehdas

Inside PictureFactory.cs laittaa tämän koodin luodaksemme kaikki kuvat ja lataa niiden tekstuurit URL -osoitteesta.

System. Collectionsin avulla;

käyttämällä System. Collections. Generic; käyttämällä UnityEngineä; julkinen luokka PictureFactory: MonoBehaviour {public GameObject picPrefab; julkinen 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 (merkkijonon URL -osoite urlListissa) {Vector3 pos = GetPosition (picNum, resultNum, camForward); GameObject pic = Välitön (picPrefab, pos, Quaternion.identity, this.transform); kuva. GetComponent (). LoadImage (url); picNum ++; }} Vector3 GetPosition (int picNum, int rowNum, Vector3 camForward) {Vector3 pos = Vector3.zero; if (picNum <= 5) {pos = camForward + new Vector3 (picNum * -3, 0, rowNum * 3.5f); } else {pos = camForward + new Vector3 ((picNum % 5) * 3, 0, rowNum * 3.5f); } paluu pos; }}

Vaihe 8: Olemme valmiita

Luo tyhjä peliobjekti nimeltä GoogleService ja aseta siihen GoogleSerivice -skripti.

Vedä "PictureFactory" -skripti maatasolle, koska kaikki kuvat luodaan tämän peliobjektin lapsina.

Vedä oikeat viittaukset tarkastajaan, tee sama Google -palvelulle.

Viimeinen asia, joka meidän on tehtävä, on varmistaa, että GetPictures -toiminto kutsutaan. Joten siirrymme painikkeen "onClick" -tapahtumaan ja soita sille sieltä.

Nyt voimme napsauttaa toistoa ja testata tätä. Varmista, että maataso ja painike ovat käytössä. Sano sana ja napsauta painiketta suorittaaksesi haun kyseisestä tekstistä!

Jos haluat saada tämän sovelluksen puhelimeesi, liitä se ja siirry kohtaan Tiedosto-> Rakennusasetukset. Osallistu rakentamiseen ja juoksuun!

Kerro minulle kommenteissa, jos sinulla on kysyttävää!