Introduksjon til Vuforia på enhet for å skape utvidede virkelighetsapplikasjoner

Hva du skal skape

Denne opplæringen skal dekke hvordan du implementerer et grunnleggende forstørret virkelighetsprogram med Vuforia SDK on Unity. Gjennom hele opplæringen skal du lære å generere en scene som er kompatibel med Vuforia, og hvordan du implementerer ulike skript, inkludert ray-tracing, for å kunne kommunisere med objektet innenfor scenen.

Opprette en utviklerkonto

Før du starter, må du registrere deg for en Vuforia-utvikler-konto. Gå til Vuforia Developer Portal for å opprette en konto.

Når du har opprettet din konto, er det på tide å laste ned Unity-pakken til Vuforia. Gå til nedlastingssiden og last ned den spesifikke pakken for Unity.

Opprette et bildemål

Et bildemål er nødvendig for at en enhetens kamera skal gjenkjenne en referanse og spore den. Orienteringen og den faktiske størrelsen på målbildet påvirker direkte de samme egenskapene til de overførte bildene.

Ethvert bilde kan tilordnes som et mål. Imidlertid bestemmer funksjonene i målbildet effektivt hvor godt målet er sporet. I denne opplæringen skal vi bruke et elektronisk verktøy for å generere funksjonsrike målbilder. Generer et billedmål ved hjelp av verktøyet Augmented Reality Marker Generator, og lagre bildet på datamaskinen.

Forbereder enhetsscenen

Vuforia-pakken

Opprett et nytt 3D-enhetsprosjekt, og dobbeltklikk deretter på Unity-pakken du lastet ned for Vuforia. Dette vil be om følgende vindu. Klikk Alle for å velge alt innholdet i pakken, og deretter trykke Importere. Dette kommer til å importere alle nødvendige verktøy for AR-applikasjonen.

Bildemål

Det neste trinnet er å importere bildemålfilene. For å skaffe bildemålfilene må vi bruke Vuforia-utvikler siden.

Gå til Vuforia Developer Portal og logg inn på kontoen din. Under Utvikle fanen, vil du se Målleder. Først må du legge til en database. Bruk den angitte knappen og legg til en database. 

Navngi databasen din, og velg Enhet som typen.

Nå er vi klare til å legge til et mål i denne databasen. Klikk på Legg til mål knappen, og det følgende vinduet vises. Typen skal velges som Enkelt bilde i vårt tilfelle. Velg bildet mål som vi genererte ved hjelp av online verktøyet. Hvis du har problemer med å laste opp filen, kan du prøve å konvertere den til .jpg-filformat og laste opp på nytt.

Bredde er en viktig parameter. Dette bør samsvare med den virkelige størrelsen på målbildet som du til slutt vil skrive ut på papir. Jeg satte bredden til 40. Det er ingen enhet siden den samsvarer med enheten på scenen din.

Når du legger til målet i databasen, beregner Vuforia målet ditt. Med målbildegeneratoren vi brukte, er funksjonene høye og derfor blir det 5 stjerner, noe som betyr at det er enkelt for Vuforia å gjenkjenne og spore dette målet.

Nå må du laste ned denne databasen. For å gjøre det, trykk på Last ned database knappen og velg Enhetsredaktør som utviklingsplattform.

Når du har lastet ned databasen, dobbeltklikker du på den og importerer alt innholdet til Unity-scenen vi jobber med.

ARCamera Object

Vi starter med å legge til ARCamera-objektet til Vuforia til vår scene. For å gjøre det, følg bare Eiendeler> Vuforia> Prefabs katalog og legg til ARCamera-objektet ved å dra og slippe til scenen.

Velg ARCamera-objektet og under Inspektør fanen, vil du se App lisensnøkkel seksjon. Denne lisensnøkkelen vil bli hentet fra Vuforia-utviklerportalen.

Logg inn på din Vuforia-konto på Developer Portal og under Utvikle fanen finner du Lisensleder seksjon. Klikk på Legg til lisensnøkkel knapp. På den følgende siden, velg Utvikling som prosjekttype og definer et søknadsnavn for prosjektet ditt. Dette navnet er ikke avgjørende, og du kan endre det senere hvis du ønsker det.

Truffet neste, og bekreft deretter lisensnøkkelen på neste side.

Velg lisensen du nettopp har opprettet. Det vil avsløre lisensnøkkelen som vi må kopiere og lime inn i ARCamera-objektet. Kopier denne lisensen og lim deretter inn den i App lisensnøkkel delen under ARCamera-innstillingene.

Under Database Load Behavior, Undersøk Last inn ARdemo Database alternativ. Når du sjekker det, kalles et annet alternativ Aktiver vil vises rett under det. Sjekk også dette alternativet.

De ARdemo del av Last inn ARdemo Database alternativet avhenger av hvordan du navngitt databasen din.

Bildemålobjekt

Det andre objektet vi trenger i vår scene er Bildemål gjenstand.

Under Eiendeler> Vuforia> Prefabs katalog, finner du også "ImageTarget" -objektet. Legg dette objektet til din scene og velg det for å avsløre alternativene.

Under Image Target Behavior delen, vil du se database alternativ. Velg databasen din fra rullegardinmenyen og velg det spesifikke bildemålet du vil tilordne til billedmålobjektet fra rullegardinmenyen "Image Target". Hvis du har flere bildemål for en database, vil de alle bli oppført her.

Bredde- og høydeparametrene blir automatisk innstilt avhengig av verdien du tildelte når du oppretter bildemålene i Vuforias utviklerportal.

Forbedre grafikk

Det neste trinnet er å lage grafikken og knytte dem til bildemålet. Du kan enten lage et GameObject eller du kan importere din egen 3D-modell til Unity og bruke den. I denne opplæringen skal vi bruke enkle 3D-kubeobjekter for enkelhets skyld.

Legg til et kubeobjekt på scenen som vist i figuren nedenfor.

Angi sine x, y og z parametere for Scale alternativ under Forvandle til 40, slik at den samsvarer med størrelsen på bildet målet vi genererte.

Hvis du angir en annen breddeverdi for bildemålet ditt når du genererer det i utviklerportalen, bruker du verdien du valgte for å matche full størrelse på bildemålet.

Det siste skrittet for å få vår AR-app å jobbe er å sette kubeobjektet som barnet til bildemålet. For å gjøre det, bare dra kubeobjektet og slipp det på bildetTarget-objektet under hierarki-menyen.

Den endelige tilstanden til scenen skal være som følger:

Nå treffer du Spille knappen for å kjøre din søknad. Det vil bruke webkameraet ditt. Du kan enten få målbildet skrevet ut eller åpne det fra telefonen, slik at Vuforia kan oppdage det gjennom webkameraet ditt. Jeg gjorde sistnevnte og åpnet målbildet fra telefonen min. 

Her er det faktiske skjermbildet av visningen av webkameraet. Du kan se at kubeobjektet dekker hele målbildet, siden vi matchet skaleringsfaktorverdiene både for 3D-objektet og målbildet.

Interaksjonsskript

Så langt har vi utviklet en grunnleggende AR-applikasjon som gjenkjenner og sporer vårt målbilde og viser den utpekte 3D-grafikken. Men for en komplett AR-applikasjon, må vi også kunne samhandle med objektene, forlenge virkeligheten.

For dette formålet må vi kunne oppdage hvor vi klikket - eller berørt, i tilfelle av en mobil enhet. Vi gjør dette ved å implementere en ray-tracer.

Først opprett en mappe med navnet "skript" under Eiendeler å holde alt organisert. Vi skal lagre skriptfilene våre i denne mappen. Deretter oppretter du en C # Script-fil i denne mappen. Gi det navnet "rayTracer". Navngivning er viktig på grunn av at følgende kode skal matche dette bestemte filnavnet. Hvis du foretrekker å bruke et annet navn for skriptfilen din, bør du også endre den angitte koden tilsvarende.

Ray-Tracer Script

Kopier og lim inn følgende kode i C # Script-filen du nettopp har opprettet og kalt "rayTracer".

bruker UnityEngine; bruker System.Collections; bruker System.Collections.Generic; offentlig klasse rayTracer: MonoBehaviour privat liste touchList = ny liste(); privat GameObject [] touchPrev; privat RaycastHit hit; ugyldig oppdatering () #if UNITY_EDITOR if (Input.GetMouseButton (0) || Input.GetMouseButtonDown (0) || Input.GetMouseButtonUp (0)) touchPrev = nytt GameObject [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); hvis (Physics.Raycast (ray, ut hit)) GameObject recipient = hit.transform.gameObject; touchList.Add (mottaker); hvis (Input.GetMouseButtonDown (0)) recipient.SendMessage ("touchBegan", hit.point, SendMessageOptions.DontRequireReceiver);  hvis (Input.GetMouseButtonUp (0)) recipient.SendMessage ("touchEnded", hit.point, SendMessageOptions.DontRequireReceiver);  hvis (Input.GetMouseButton (0)) recipient.SendMessage ("touchStay", hit.point, SendMessageOptions.DontRequireReceiver);  foreach (GameObject g i touchPrev) if (! touchList.Contains (g)) g.SendMessage ("touchExit", hit.point, SendMessageOptions.DontRequireReceiver);  #endif hvis (Input.touchCount> 0) touchPrev = nytt GameObject [touchList.Count]; touchList.CopyTo (touchPrev); touchList.Clear (); Foreach (Touch berør i Input.touches) Ray ray = Camera.main.ScreenPointToRay (touch.position); hvis (Physics.Raycast (ray, ut hit)) GameObject recipient = hit.transform.gameObject; touchList.Add (mottaker); hvis (touch.phase == TouchPhase.Began) recipient.SendMessage ("touchBegan", hit.point, SendMessageOptions.DontRequireReceiver);  hvis (touch.phase == TouchPhase.Ended) recipient.SendMessage ("touchEnded", hit.point, SendMessageOptions.DontRequireReceiver);  hvis (touch.phase == TouchPhase.Stationary || touch.phase == TouchPhase.Moved) recipient.SendMessage ("touchStay", hit.point, SendMessageOptions.DontRequireReceiver);  hvis (touch.phase == TouchPhase.Canceled) recipient.SendMessage ("touchExit", hit.point, SendMessageOptions.DontRequireReceiver);  foreach (GameObject g i touchPrev) if (! touchList.Contains (g)) g.SendMessage ("touchExit", hit.point, SendMessageOptions.DontRequireReceiver);  

Dette skriptet registrerer begge museklikkene hvis du jobber med Unity-editoren og berører innganger hvis du har distribuert programmet på en mobilenhet med en berøringsskjerm.

Når du har opprettet RayTracer-skriptet ditt, må du aktivere det ved å tilordne det til et av objektene i scenen. Jeg valgte ARCamera-objektet og lagt til rayTracer-skriptene som en komponent ved å bruke Legg til komponent knappen under Inspektør tab.

Objektmateriale

Nå skal vi tildele et materiale til vårt kubeobjekt og endre fargene på materialet ved samspill med terningen.

Under Eiendeler, lage et materiale og navn det som du ønsker.

Tilordne dette materialet ved å dra og slippe over kubeobjektet.

Interaksjonsskript

Opprett et nytt C # -skript under skriptmappen og oppgi navnet "interaksjon".

Kopier følgende C # -koden til skriptfilen "interaksjon" og legg deretter til denne skriptfilen i kubeobjektet som en komponent, akkurat som vi gjorde med "rayTracer" -skriptfilen. Denne gangen bør det imidlertid være en komponent av kubeobjektet - dette er viktig for å kunne kun samhandle med kubeobjektet.

bruker UnityEngine; bruker System.Collections; offentlig klasse interaksjon: MonoBehaviour offentlig statisk Farge defaultColor; offentlig statisk farge valgtColor; offentlig statisk materiale matte; void Start () mat = GetComponent ().materiale; mat.SetFloat ("_ Mode", 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 = ny Color32 (255, 255, 255, 255); selectedColor = new Color32 (255, 0, 0, 255); mat.color = defaultColor;  void touchBegan () mat.color = selectedColor;  void touchEnded () mat.color = defaultColor;  void touchStay () mat.color = selectedColor;  void touchExit () mat.color = defaultColor; 

I dette "interaksjonsskriptet" refererer vi til materialet i kubeobjektet som "mat".

Vi opprettet to forskjellige materielle objekter som heter defaultColor og selectedColor. defaultColor er valgt for å være hvit, som RGBA parametrene indikerer, som er (255, 255, 255, 255).

Vi initialiserer kubeobjektets farge som defaultColor av følgende linje:

mat.color = defaultColor;

Vi har fire forskjellige funksjoner for fire forskjellige stater:

  • touchBegan () kalles for øyeblikket du berørte objektet.
  • touchEnded () kalles når du slipper fingeren ut.
  • touchStay () kalles rett etter at du har rørt objektet - følger denne funksjonen touchBegan (). Så, hvis du tilordner forskjellige farger til materialet ditt i disse funksjonene, er det lite sannsynlig at du ser fargen som er tildelt i touchStay () funksjon, siden det er det aller første øyeblikk, blir berøringen gjenkjent.
  • touchExit () kalles når du drar fingeren ut av kubeobjektets overflate, i stedet for å slippe fingeren, som kaller touchEnded () fungere som forklart ovenfor.

I vår kode, når vi berører kubeobjektet, tildeler vi selectedColor ha innvendinger mat.color, som er fargen på kubeobjektets materiale.

Ved å tildele selectedColor innen touchStay () funksjon, sørger vi for at fargene på kubeobjektet blir lik selectedColor så lenge vi holder fingeren på kubeobjektet. Hvis vi slipper fingeren eller trekker den ut av kubeobjektet, tilordner vi  defaultColor til materialets fargeparameter ved å ringe touchEnded () eller touchExit () Fungerer i samsvar med handlingen vi tok.

Kjør prosjektet og klikk på kubobjektet når målbildet er gjenkjent og kubobjektet har dukket opp. Den skal bli rød og hvit igjen når du slipper ditt klikk eller flytter det ut av kubeobjektets overflate.

Du kan eksperimentere med forskjellige farger for de fire ulike handlingene for å forstå dem grundig.

Konklusjon

I denne opplæringen har vi gjennomgått en introduksjon til Vuforia SDK for Unity sammen med utviklerportalen, og vi har sett hvordan du genererer et målbilde og en passende lisensnøkkel. 

På toppen av det genererte vi tilpassede skriptfiler for å kunne samhandle med utvidet grafikk. Denne opplæringen er bare en introduksjon som gjør at du kan begynne å bruke Vuforia med Unity og lage dine egne AR-applikasjoner.