Introducere în Vuforia privind unitatea pentru crearea de aplicații de realitate augmentate

Ce veți crea

Acest tutorial se va referi la modul de implementare a aplicației de bază realitate augmentată cu Vuforia SDK pe unitate. De-a lungul tutorialului, veți învăța cum să generați o scenă compatibilă cu Vuforia și cum să implementați diferite scripturi, inclusiv de urmărire a radiațiilor, pentru a putea interacționa cu obiectul din scenă.

Crearea unui cont de dezvoltator

Înainte de a începe, trebuie să vă înregistrați pentru un cont de dezvoltator Vuforia. Accesați portalul Vuforia Developer pentru a vă crea un cont.

După ce vă creați contul, este timpul să descărcați pachetul Unity de la Vuforia. Accesați pagina de descărcare și descărcați pachetul specific pentru Unity.

Crearea unui obiectiv de imagine

O țintă imagine este necesară pentru ca camera aparatului să recunoască o referință și să o urmărească. Orientarea și dimensiunea reală a imaginii țintă afectează în mod direct aceleași atribute ale imaginilor suprapuse.

Orice imagine poate fi atribuită ca țintă. Cu toate acestea, caracteristicile imaginii țintă determină în mod eficient cât de bine este urmărită țintă. În acest tutorial, vom folosi un instrument online pentru a genera imagini țintă bogate în funcții. Generează o țintă imagine utilizând instrumentul online Generator de marcatori augmentate și salvează imaginea pe computer.

Pregătirea scenei unității

Pachetul Vuforia

Creați un nou proiect de unitate 3D și apoi faceți dublu clic pe pachetul Unity pe care l-ați descărcat pentru Vuforia. Aceasta va solicita următoarea fereastră. Clic Toate pentru a selecta tot conținutul pachetului, apoi apăsați Import. Aceasta va importa toate instrumentele necesare pentru aplicația AR.

Tinta de imagine

Următorul pas este să importați fișierele țintă imagine. Pentru a obține fișierele țintă imagine, trebuie să folosim pagina dezvoltatorului Vuforia.

Accesați Portalul pentru dezvoltatori Vuforia și apoi conectați-vă la contul dvs. Sub Dezvolta , veți vedea Managerul țintă. Mai întâi trebuie să adăugați o bază de date. Utilizați butonul desemnat și adăugați o bază de date. 

Denumiți baza de date după cum doriți și selectați Dispozitiv ca tip.

Acum suntem gata să adăugăm o țintă în această bază de date. Faceți clic pe Adaugă țintă , urmând să apară următoarea fereastră. Tipul trebuie selectat ca Imagine unică în cazul nostru. Selectați ținta de imagine pe care am generat-o utilizând instrumentul online. Dacă aveți probleme la încărcarea fișierului, încercați să îl convertiți în format de fișier .jpg și să îl încărcați din nou.

Lățimea este un parametru crucial. Acest lucru ar trebui să se potrivească cu dimensiunea reală a imaginii țintă pe care o veți tipări eventual pe hârtie. Am stabilit lățimea la 40. Nu există o unitate, deoarece se potrivește cu unitatea scenei tale.

După ce adăugați ținta în baza de date, Vuforia vă evaluează ținta. Cu ajutorul generatorului de imagine țintă pe care l-am utilizat, caracteristicile sunt ridicate și, prin urmare, devine 5 stele, ceea ce înseamnă că este ușor pentru Vuforia să recunoască și să urmărească această țintă.

Acum trebuie să descărcați această bază de date. Pentru a face acest lucru, apăsați pe Descărcați baza de date și selectați Editor unitate ca platformă de dezvoltare.

Odată ce ați descărcat baza de date, faceți dublu clic pe ea și importați tot conținutul în scena Unity pe care lucrăm.

Obiectul ARCamera

Începem prin adăugarea obiectului ARCamera de la Vuforia la scena noastră. Pentru a face acest lucru, urmați pur și simplu Active> Vuforia> Prefabricate și adăugați obiectul ARCamera prin glisarea și plasarea pe scena.

Selectați obiectul ARCamera și sub Inspector , veți vedea Cheie de licență pentru aplicații secțiune. Această cheie de licență va fi obținută de pe portalul de dezvoltatori Vuforia.

Conectați-vă la contul dvs. Vuforia de pe Portalul pentru dezvoltatori și sub Dezvolta tab, veți găsi Manager de licență secțiune. Apasă pe Adăugați cheia de licență buton. În pagina următoare, selectați Dezvoltare ca tip de proiect și să definiți un nume de aplicație pentru proiectul dvs. Acest nume nu este esențial și poți să-l modifici mai târziu dacă dorești.

Lovit Următor →, apoi confirmați cheia de licență pe pagina următoare.

Selectați licența pe care tocmai ați creat-o. Acesta va dezvălui cheia de licență pe care trebuie să o copiem și să o lipim în obiectul ARCamera. Copiați această licență și inserați-o în Cheie de licență pentru aplicații secțiunea din setările ARCamera.

Sub Baza de încărcare a bazei de date, verifică Încărcați baza de date ARdemo opțiune. Odată ce ați verificat, o altă opțiune a sunat Activati va apărea chiar sub ea. Verificați și această opțiune.

ARdemo parte a Încărcați baza de date ARdemo opțiunea depinde de modul în care ați denumit baza de date.

Obiectul țintă pentru imagine

Cel de-al doilea obiect de care avem nevoie în scena noastră este Tinta de imagine obiect.

Sub Active> Vuforia> Prefabricate director, veți găsi, de asemenea, obiectul "ImageTarget". Adăugați acest obiect în scenă și selectați-l pentru a dezvălui opțiunile.

Sub Imagine țintă Comportament secțiune, veți vedea Bază de date opțiune. Selectați baza de date din meniul derulant și selectați ținta specifică de imagine pe care doriți să o atribuiți obiectului destinație imagine din meniul derulant al opțiunii "Image Target". Dacă aveți mai multe ținte de imagine pentru o bază de date, toate acestea vor fi listate aici.

Parametrii de lățime și înălțime vor fi setați automat, în funcție de valoarea pe care ați atribuit-o atunci când creați obiectivele de imagine în portalul dezvoltatorului Vuforia.

Augmentarea graficii

Următorul pas este să creați grafica și să le legați de ținta imaginii. Puteți crea fie un GameObject, fie puteți importa propriul dvs. model 3D în Unity și îl puteți folosi. În acest tutorial vom folosi un simplu obiect 3D cub de dragul simplității.

Adăugați un obiect cub la scena, după cum se arată în figura următoare.

Setați parametrii x, y și z pentru Scară opțiune sub Transforma la 40, astfel încât să corespundă mărimii țintei de imagine pe care am generat-o.

Dacă setați o altă valoare a lățimii pentru ținta imagine atunci când o generați în portalul dezvoltatorului, utilizați valoarea pe care ați selectat-o ​​pentru a se potrivi cu dimensiunea completă a destinației imaginii.

Ultimul pas pentru a obține aplicația noastră AR este de a seta obiectul cub ca copil al țintei de imagine. Pentru a face acest lucru, trageți pur și simplu obiectul cub și plasați-l pe obiectul imageTarget sub meniul ierarhiei.

Starea finală a scenei ar trebui să fie după cum urmează:

Acum, apăsați pe Joaca pentru a rula aplicația. Va folosi camera web. Fie obțineți imaginea țintă imprimată, fie deschideți-o din telefon, astfel încât Vuforia să o poată detecta prin camera web. Am făcut-o pe urmă și mi-a deschis imaginea țintă de pe telefonul meu. 

Iată fotografia reală a vizualizării camerei web. Puteți vedea că obiectul cub acoperă întreaga imagine țintă, deoarece am corelat valorile factorului de scalare atât pentru obiectul 3D, cât și pentru imaginea țintă.

Scripturi de interacțiune

Până acum, am dezvoltat o aplicație AR de bază care recunoaște și urmărește imaginea țintă și afișează grafica 3D desemnată. Cu toate acestea, pentru o aplicație AR completă, trebuie să fim capabili să interacționăm cu obiectele, mărind realitatea.

În acest scop, trebuie să fim capabili să detectăm unde am făcut clic sau am atins, în cazul unui dispozitiv mobil. Vom face acest lucru prin implementarea unui detector de raze.

Mai întâi, creați un dosar denumit "scripts" în secțiunea bunuri pentru a păstra totul organizat. Vom păstra fișierele de script în acest dosar. Apoi, creați un fișier C # Script în acest folder. Denumiți-o "rayTracer". Denumirea este importantă datorită faptului că următorul cod trebuie să se potrivească cu acest nume specific de fișier. Dacă preferați să utilizați un nume diferit pentru fișierul dvs. script, trebuie de asemenea să modificați codul furnizat în consecință.

Ray-Tracer Script

Copiați și inserați următorul cod în fișierul C # Script pe care tocmai l-ați creat și numit "rayTracer".

utilizând UnityEngine; utilizând System.Collections; folosind System.Collections.Generic; clasa publică rayTracer: MonoBehavior listă privată touchList = Listă nouă(); privat GameObject [] touchPrev; privat RaycastHit privat; void Actualizare () #if UNITY_EDITOR if (Input.GetMouseButton (0) || Input.GetMouseButtonDown (0) || Input.GetMouseButtonUp (0)) touchPrev = JocObject nou [touchList.Count]; touchList.CopyTo (touchPrev); touchList.Clear (); Ray ray = camera.main.ScreenPointToRay (Input.mousePosition); //Debug.DrawRay(ray.origin, ray.direction * 10000, Color.green, 10, false); dacă (Physics.Raycast (ray, out hit)) GameObject recipient = hit.transform.gameObject; touchList.Add (destinatar); dacă (Input.GetMouseButtonDown (0)) recipient.SendMessage ("touchBegan", hit.point, SendMessageOptions.DontRequireReceiver);  dacă (Input.GetMouseButtonUp (0)) recipient.SendMessage ("touchEnded", hit.point, SendMessageOptions.DontRequireReceiver);  dacă (Input.GetMouseButton (0)) recipient.SendMessage ("touchStay", hit.point, SendMessageOptions.DontRequireReceiver);  foreach (GameObject g in touchPrev) if (! touchList.Contains (g)) g.SendMessage ("touchExit", hit.point, SendMessageOptions.DontRequireReceiver);  #endif dacă (Input.touchCount> 0) touchPrev = new GameObject [touchList.Count]; touchList.CopyTo (touchPrev); touchList.Clear (); foreach (Touch touch în Input.touches) Ray ray = Camera.main.ScreenPointToRay (touch.position); dacă (Physics.Raycast (ray, out hit)) GameObject recipient = hit.transform.gameObject; touchList.Add (destinatar); dacă (touch.phase == TouchPhase.Began) recipient.SendMessage ("touchBegan", hit.point, SendMessageOptions.DontRequireReceiver);  dacă (touch.phase == TouchPhase.Ended) recipient.SendMessage ("touchEnded", hit.point, SendMessageOptions.DontRequireReceiver);  dacă (touch.phase == TouchPhase.Stationary || touch.phase == TouchPhase.Moved) recipient.SendMessage ("touchStay", hit.point, SendMessageOptions.DontRequireReceiver);  dacă (touch.phase == TouchPhase.Canceled) recipient.SendMessage ("touchExit", hit.point, SendMessageOptions.DontRequireReceiver);  foreach (GameObject g in touchPrev) if (! touchList.Contains (g)) g.SendMessage ("touchExit", hit.point, SendMessageOptions.DontRequireReceiver);  

Acest script detectează ambele clicuri de mouse dacă lucrați la editorul Unity și atingeți intrări dacă ați implementat aplicația pe un dispozitiv mobil cu un ecran tactil.

Odată ce ați creat scriptul rayTracer, trebuie să-l activați atribuindu-l unui dintre obiectele din scenă. Am selectat obiectul ARCamera și am adăugat scripturile rayTracer ca o componentă utilizând Adăugați componenta buton sub Inspector fila.

Obiect Material

Acum vom aloca un material obiectului nostru Cube și vom schimba culoarea materialului după interacțiunea cu cubul.

Sub bunuri, creați un material și numiți-l după cum doriți.

Acum, atribuiți acest material prin tragerea și plasarea peste obiectul cub.

Script de interacțiune

Creați un nou C # Script în directorul de scripturi și denumiți-l "interacțiune".

Copiați următorul cod C # în fișierul de script "Interacțiune" și apoi adăugați acest fișier script în obiectul cub ca o componentă, la fel cum am făcut și cu fișierul script "rayTracer". Cu toate acestea, de data aceasta ar trebui să fie o componentă a obiectului cub - aceasta este importantă pentru a putea interacționa numai cu obiectul cub.

utilizând UnityEngine; utilizând System.Collections; public de clasă interacțiune: MonoBehavior public static Culoare defaultColor; static public Culoare selectatColor; materiale statice publice; void Start () mat = GetComponent ().material; mat.SetFloat ("Modul", 2); mat.SetInt ("_ SrcBlend", (int) UnityEngine.Rendering.BlendMode.SrcAlpha); mat.SetInt ("_ DstBlend", (int) UnityEngine.Rendering.BlendMode.OneMinusSrcAlpha); mat.SetInt ("_ Zwrite", 0); mat.DisableKeyword ( "_ ALPHATEST_ON"); mat.EnableKeyword ( "_ ALPHABLEND_ON"); mat.DisableKeyword ( "_ ALPHAPREMULTIPLY_ON"); mat.renderQueue = 3000; defaultColor = nou Color32 (255, 255, 255, 255); selectatColor = Color32 nou (255, 0, 0, 255); mat.color = defaultColor;  void touchBegan () mat.color = selectatColor;  void touchEnded () mat.color = defaultColor;  void touchStay () mat.color = selectatColor;  void atingExit () mat.color = defaultColor; 

În acest script de "interacțiune", ne referim la materialul obiectului cub ca "mat".

Am creat două obiecte materiale diferite numite defaultColor și selectedColor. defaultColor este selectat ca fiind alb, așa cum indică parametrii RGBA, care sunt (255, 255, 255, 255).

Initializam culoarea materialului cubului obiectului ca defaultColor de următorul rând:

mat.color = defaultColor;

Avem patru funcții diferite pentru patru stări diferite:

  • touchBegan () este numit în momentul în care ați atins obiectul.
  • touchEnded () este apelat când eliberați degetul.
  • touchStay () se numește imediat după ce ați atins obiectul - această funcție urmează touchBegan (). Deci, dacă atribuiți culori diferite materialului dvs. în aceste funcții, este puțin probabil să vedeți culoarea atribuită în touchStay () , deoarece este prima clipă în care atingerea este recunoscută.
  • touchExit () este apelat atunci când glisați degetul pe suprafața obiectului cubului, în loc să eliberați degetul, care îl sună touchEnded () cum este explicat mai sus.

În codul nostru, când atingem obiectul cub, îi atribuim selectedColor obiecte pentru mat.color, care este culoarea materialului cubului obiectului.

Prin atribuirea funcției selectedColor în cadrul touchStay () , asiguram ca culoarea obiectului cub va fi egala cu selectedColor atâta timp cât ținem degetul pe obiectul cubului. Dacă ne eliberăm degetul sau îl scoatem din obiectul cub, îi atribuim  defaultColor la parametrul de culoare al materialului prin apelarea touchEnded () sau touchExit () funcționează în conformitate cu acțiunea pe care am luat-o.

Acum executați proiectul și faceți clic pe obiectul cub după ce imaginea țintă este recunoscută și apare obiectul cub. Ar trebui să se întoarcă roșu și alb atunci când eliberați clicul sau mutați-l din suprafața obiectului cubului.

Puteți experimenta diferite culori pentru cele patru acțiuni diferite pentru a le înțelege temeinic.

Concluzie

În acest tutorial, am parcurs o prezentare a SDU-ului pentru unitate Vuforia împreună cu portalul pentru dezvoltatori și am văzut cum să generăm o imagine țintă și o cheie de licență corespunzătoare. 

În plus, am generat fișiere de script personalizate pentru a putea interacționa cu grafica augmentată. Acest tutorial este doar o introducere care vă permite să începeți să utilizați Vuforia cu Unity și să creați propriile aplicații AR.