Kom ons maak 'n Augmented Reality -app vir MEMES !: 8 stappe

2024 Outeur: John Day | [email protected]. Laas verander: 2024-01-30 07:27

In hierdie Instructable gaan ons 'n augmented reality -app vir Android en IOS maak in Unity3D wat die Google API gebruik om na memes te soek. Ons gebruik Vuforia se grondvliegdeteksie in Unity, sodat hierdie mobiele app vir die meeste Android- en IOS -gebruikers sal werk. Deur die gebruik van Vuforia kan ons ook die foto's op een plek veranker sodat ons deur hierdie prentjie kan loop en die voorwerpe bly waar hulle is.

Ons gaan ook die nuwe IBM Watson API toets, sodat ons hierdie soektogte met ons stem kan doen en hul natuurlike taalverwerking kan benut.

Die slegte nuus is dat geen van hierdie API's heeltemal gratis is nie, maar die goeie nuus is dat hulle albei gratis kan probeer. Die Google Custom Search API gee u 100 gratis soektogte per dag, en die IBM Watson API gee u die eerste maand gratis.

In kort, hierdie app kry ons toespraak van die mikrofoon in Unity, stuur dit na die IBM Watson -bedieners, wat die teks aan ons sal teruggee. Ons neem dan die teks en stuur dit na die Google -bedieners wat 'n lys met prent -URL's in JSON -vorm aan ons sal stuur.

Stap 1: Stel die IBM Watson SDK in Unity op

Om die Watson API aan die gang te kry, moet u eers u geloofsbriewe van hul webwerf af kry. Gaan na Console.bluemix.net, skep en maak 'n rekening, en meld aan. Gaan na u IBM -rekening en navigeer na wolkgietery -organisasies en skep 'n nuwe ruimte. Gaan nou na u paneelbord en klik om na dienste te blaai, voeg die toespraak by die teksdiens, want dit is wat ons gaan gebruik. Kies u streek, organisasie en ruimte en skep die projek. Nou sien u u API -geloofsbriewe onderaan.

Laai Unity af as u dit nog nie het nie en voer die IBM Watson SDK uit die batebestuur in Unity in. Ons kan dit toets deur 'n leë spelvoorwerp te skep en dit IBM Watson te noem en die voorbeeld -streaming script by te voeg. Hierdie script is reeds ingestel om klank uit eenheid op te neem en na die Watson -bedieners te stuur vir verwerking.

Op die oomblik gaan ons hierdie voorbeeldskrif net gebruik, want ons het nog baie meer om te doen, maar miskien kan ons die volgende keer dieper in die Watson -dinge ingaan, want ek wil graag iets doen met die Vision API.

Stap 2: Toets IBM Watson -teks na spraak

Hierdie skrif is op soek na 'n UI -teksvoorwerp, sodat ons 'n nuwe UI -knoppie kan skep; dit gee ons die nodige teks; ons sal die knoppie later gebruik. Stel die doek op skaal met die skermgrootte en verander die grootte van die knoppie 'n bietjie. Anker dit links onder. Sleep die teks na die leë gleuf. Maak die script oop en laat ons ons IBM Watson -geloofsbriewe byvoeg, vind waar die 'resultField' -teks gebruik word en stel dit op' alt.transcript ', want ons gaan hierdie teks gebruik om op Google te soek. Nou voordat ons dit kan toets, moet ons die teksgrootte self dinamies maak, sodat alles wat ons sê, in die boks pas. Gaan terug na die teks en stel dit die beste by. Tik teks in om dit te toets. As ons nou op play klik, word ons woorde oorgeskryf na teks van die Watson Text to Speech API.

Stap 3: Stel die Google Custom Search API op

Die volgende stuk wat ons moet doen, is om die aangepaste soek -API vir Google op te stel om in Unity te gebruik. Op 'n hoë vlak sal ons 'n HTTP -versoek van Unity aan die Google -bedieners rig, wat ons 'n antwoord in JSON -formaat sal gee.

Gaan dus na die opstelbladsy van die Google Custom Search JSON API, klik om 'n API -sleutel te kry en 'n nuwe app te skep. Hou dit oop. Nou kan ons na die bedieningspaneel gaan. Voeg alles in vir die webwerwe om te soek, noem dit wat ook al, en klik op skep.

Klik op die bedieningspaneel en maak 'n paar wysigings: ons wil hoofsaaklik na memes soek en beeldsoek aanskakel. Onder webwerwe om te soek, skakel dit oor na die hele web. Klik op update om alles te stoor.

Soek nou die Google Api Explorer en gaan na die pasgemaakte soek -API. Dit sal ons toelaat om die JSON -antwoord wat ons van Google ontvang, te formateer. Plaas dus nou enigiets vir die navraag, plak u soekenjin -ID in, sit 1 in vir die filter sodat ons nie duplikate kry nie, sit 10 onder nommer in, want dit is die maksimum aantal resultate wat ons op 'n slag kan teruggee, sit 'n prentjie in vir soektipe, want dit is al wat ons wil teruggee. Plaas 1 in die begin, en laastens onder die velde 'items/skakel' in, want vir elke item wat teruggestuur word, wil ons slegs die prentskakel hê. As u nou op uitvoer klik, sal u sien dat ons 10 mooi beeldskakels teruggee.

Nou moet ons hierdie foto's in Unity kry.

Stap 4: Stel Vuforia in eenheid op

Laat Vuforia werk sodat ons hul grondvlakopsporing kan benut. Stoor u huidige toneel en gaan na die bou -instellings. Skakel u platform oor na Android of IOS, en as u op IOS iets in die bundel -identifiseerder sit, voeg 'n beskrywing van die kamera en die mikrofoon by. Kyk onder XR -instellings dat Vuforia augmented reality ondersteun word.

Skrap nou die hoofkamera in die toneel en voeg 'n Vuforia ARCamera by. Gaan na die konfigurasie -afdeling en verander die opsporingsmodus na posisioneel. Ontmerk alle databasisse omdat ons dit nie nodig het nie.

Voeg nou 'n vliegtuigzoeker by en ons moet die standaardgedrag daarvan oorskry, want ons wil die grondvlakfase net een keer implementeer, sodat ons die script Implement Stage once op die Vuforia -webwerf kan vind. Bring die skrif na Unity en plaas dit op die vliegtuigzoeker en verwyder die ou skrif wat daar was. Verander die modus na interaktief en maak seker dat die "OnInteractiveHitTest" -funksie by die Unity -gebeurtenis aangeskakel word. Terwyl ons hier is, laat ons die knoppie wat ons vroeër gemaak het, aktief wees sodra ons die grondvlak gevind het, stel die standaardtoestand in as onaktief. Plaas nou 'n grondvliegtuig in die toneel en verander dit in die middel van die lug, want ons wil hê dat alle foto's in die lug dryf. Sleep hierdie grondvlak na die leë gleuf op die vliegtuigzoeker.

Stap 5: Skep 'n prentvoorvoegsel

Voordat ons al hierdie stukke aanmekaar sit, moet ons 'n voorafvervaardigde spelvoorwerp skep wat ons kan installeer elke keer as 'n prent gelaai word. Skep dus 'n leë spelvoorwerp onder die grondvlak en noem dit 'picPrefab'. Skep 'n vierwiel as 'n kind daarvan en skaal dit met 2, draai sy y met 180 grade sodat die ouers vorentoe -vektor wat as 'n blou pyl getoon word, die voorkant van die vierkant is.

Skep 'n nuwe skrif genaamd "PictureBehavior" en voeg dit by ons picPrefab.

Sleep nou hierdie voorafvervaardigde foto na u map met bates, en dit is waarop ons elke prentjie gaan sit.

Ons 'PictureBehavior' -skrif moet so lyk:

met behulp van System. Collections;

met behulp van System. Collections. Generic; gebruik UnityEngine; openbare klas PictureBehavior: MonoBehaviour {public Renderer quadRenderer; private Vector3 gewenstePosisie; void Start () {// kyk na kamera transform. LookAt (Camera.main.transform); Vector3 wantedAngle = nuwe Vector3 (0, transform.localEulerAngles.y, 0); transform.rotation = Quaternion. Euler (gewenste hoek); // dwing in die lug gewenstePosisie = transform.localPosition; transform.localPosition += nuwe Vector3 (0, 20, 0); } ongeldige opdatering () {transform.localPosition = Vector3. Lerp (transform.localPosition, winsposisie, Time.deltaTime * 4f); } openbare leemte LoadImage (string url) {StartCoroutine (LoadImageFromURL (url)); } IEnumerator LoadImageFromURL (string url) {WWW www = nuwe WWW (url); opbrengs opbrengs www; quadRenderer.material.mainTexture = www.texture; }}

Stap 6: Skep 'n script vir die Google API

Laat ons nou die verwysing na die quad -renderer vanaf ons 'picPrefab' intrek.

Ons het nog net twee skrifte om te maak, dus laat ons 'n C# -skripsie genaamd GoogleService.cs en PictureFactroy.cs skep.

Plak hierdie kode in ons "GoogleService" wat ons versoek rig:

met behulp van System. Collections;

met behulp van System. Collections. Generic; gebruik UnityEngine; gebruik UnityEngine. UI; publieke klas GoogleService: MonoBehaviour {openbare PictureFactory pictureFactory; openbare teks buttonText; private const string API_KEY = "PUT API SLEUTEL HIER !!!!!"; openbare leemte GetPictures () {StartCoroutine (PictureRoutine ()); } IEnumerator PictureRoutine () {buttonText.transform.parent.gameObject. SetActive (vals); string navraag = buttonText.text; navraag = WWW. EscapeURL (navraag + "memes"); // verwyder ou beelde pictureFactory. DeleteOldPictures (); // stoor kamera vorentoe vektor sodat ons kan rondbeweeg terwyl voorwerpe geplaas word Vector3 cameraForward = Camera.main.transform.forward; // ons kan slegs 10 resultate op 'n slag kry, sodat ons moet deurloop en ons vordering moet stoor deur die beginnommer te verander na elke 10 int ryNum = 1; vir (int i = 1; i <= 60; i + = 10) {string url = "https://www.googleapis.com/customsearch/v1?q=" + navraag + "& cx = 011535004225295624669%3Afeb1gwic6bs & filter = 1 & num = 10 & searchType = image & start = " + i +" & fields = items%2Flink & key = " + API_KEY; WWW www = nuwe WWW (url); opbrengs opbrengs www; pictureFactory. CreateImages (ParseResponse (www.text), rowNum, cameraForward); rowNum ++; } opbrengs opbrengs nuwe WaitForSeconds (5f); buttonText.transform.parent.gameObject. SetActive (waar); } Lys ParseResponse (string text) {List urlList = new List (); string urls = text. Split ('\ n'); foreach (string line in urls) {if (line. Contains ("link")) {string url = line. Substring (12, line. Length-13); // filter deur png of jpg blyk nie van Google af te werk nie, so ons doen dit hier: if (url. Contains (".jpg") || url. Contains (".png")) {urlList. Add (url); }}} stuur urlList terug; }}

Stap 7: Skep ons prentfabriek

Binne PictureFactory.cs sit hierdie kode om al ons foto's te skep en laai hul teksture vanaf 'n URL.

met behulp van System. Collections;

met behulp van System. Collections. Generic; gebruik UnityEngine; openbare klas PictureFactory: MonoBehaviour {public GameObject picPrefab; openbare GoogleService googleService; public void DeleteOldPictures () {if (transform.childCount> 0) {foreach (Transform kind in this.transform) {Destroy (child.gameObject); }}} public void CreateImages (ListurlList, int resultNum, Vector3 camForward) {int picNum = 1; Vector3 sentrum = Camera.main.transform.position; foreach (string url in 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; as (picNum <= 5) {pos = camForward + nuwe Vector3 (picNum * -3, 0, rowNum * 3.5f); } anders {pos = camForward + nuwe Vector3 ((picNum % 5) * 3, 0, rowNum * 3.5f); } terugkeer pos; }}

Stap 8: Ons is klaar

Skep 'n leë spelvoorwerp genaamd GoogleService en plaas die "GoogleSerivice" -skrip daarop.

Sleep die "PictureFactory" -skrif na die grondvlak, want al ons foto's word as kinders van hierdie spelvoorwerp gemaak.

Sleep die toepaslike verwysings in die inspekteur in, doen dieselfde met die Google -diens.

Die laaste ding wat ons moet doen, is om seker te maak dat ons 'GetPictures' -funksie gebel word. Kom ons gaan na die "onClick" -gebeurtenis van ons knoppie en bel dit van daar af.

Nou kan ons op speel klik en dit toets. Maak seker dat u die grondvlakstadium en die knoppie aktiveer. Sê 'n woord en klik op die knoppie om die teks te soek!

Om hierdie app op u telefoon te kry, koppel dit aan en gaan na File-> Build Settings. Raak bou en hardloop!

Laat weet my in die kommentaar as u enige vrae het!