Accentsconagua
Share
Până acum, este posibil să fi folosit o aplicație de realitate augmentată pe iPhone-ul dvs., cu obiecte virtuale care par a fi realiste și se amestecă bine cu caracteristicile mediului. În această serie, veți învăța cum să implementați acest lucru în propria aplicație iOS cu detectarea luminii ambientale și detectarea planului orizontal pentru a vă îmbunătăți aplicația de realitate augmentată. Acest tutorial se va concentra pe afișarea planurilor orizontale și a punctelor caracteristice în ARKit.
Adesea, atunci când utilizați realitatea augmentată, doriți să plasați obiectul virtual pe o suprafață plană, cum ar fi o masă, un birou sau chiar pământul. Pentru a face acest lucru cu exactitate, este important să puteți detecta aceste obiecte înainte de a începe. După detectarea avionului, obiectul va folosi o serie de puncte pentru ancorarea obiectului virtual la acesta și obiectul va rămâne acolo, chiar dacă vă mutați dispozitivul în jur.
Pentru acest tutorial, veți avea nevoie de cunoștințe de bază despre Swift, Xcode și ARKit. Dacă nu ați folosit ARKit în trecut, vă recomandăm să citiți tutorialul meu anterior, care vizează în special să ajute începătorii să-și facă prima cerere de realitate augmentată:
Înainte de a începe, asigurați-vă că aveți cea mai recentă versiune de Xcode instalată pe Mac. Acest lucru este foarte important deoarece ARKit va fi disponibil numai pe Xcode 9 sau mai nou. Puteți verifica versiunea dvs. deschizând Xcode și mergând la Xcode > Despre Xcode în bara de instrumente superioară.
Dacă versiunea dvs. de Xcode este mai veche decât Xcode 9, puteți să accesați Mac App Store și să o actualizați gratuit. Dacă nu aveți deja Xcode, puteți să îl descărcați și să îl instalați gratuit.
După ce vă asigurați că aveți versiunea corectă a Xcode, va trebui să faceți un nou proiect Xcode.
Du-te și deschideți Xcode și faceți clic pe Creați un nou proiect Xcode.
Este posibil să fii obișnuit să faci o aplicație cu vizualizare unică,dar pentru acest tutorial, va trebui să alegeți un Aplicație realitate augmentată.Apoi apasa Următor →.
Puteți numi proiectul dvs. tot ce vă place, dar voi fi numit pe mine Planul de detecție. Veți observa, de asemenea, că există o opțiune în partea de jos unde puteți selecta dintre SceneKit, SpriteKit și Metal.
Acestea sunt toate cadrele de jocuri ale Apple și, în scopul tutorialului, vom folosi SceneKit pentru că vom folosi obiecte 3D.
Continuați și selectați SceneKit dacă nu este deja selectat. Ecranul dvs. ar trebui să arate astfel:
Deoarece simulatorul Xcode nu are o cameră foto, va trebui să conectați iPhone-ul. Din păcate, dacă nu aveți un iPhone, va trebui să împrumutați unul pentru a putea urma împreună cu acest tutorial (și pentru orice alte aplicații legate de cameră). Dacă aveți deja un iPhone conectat la Xcode, puteți trece la următorul pas.
O caracteristică nouă în Xcode 9 este că puteți depana aplicația wireless pe un dispozitiv, deci să ne ocupăm de acest lucru:
În bara de meniu de sus, alegeți Fereastră > Dispozitive și simulatoare. În fereastra care apare, asigurați-vă că Dispozitive este selectat în partea de sus.
Acum conectați dispozitivul utilizând un cablu de trăsnet. Acest lucru ar trebui să facă aparatul să apară în panoul din stânga al ferestrei Dispozitive și simulatoare fereastră. Pur și simplu faceți clic pe dispozitivul dvs. și verificați Conectați-vă prin rețea cutie.
Acum veți putea să debugați fără fir pe acest iPhone pentru toate aplicațiile viitoare.
Acum configurația dvs. este completă. Ar trebui să aveți o aplicație ARKit de lucru și o puteți testa pe iPhone pe care tocmai l-ați conectat. În colțul din stânga sus al Xcode, lângă Alerga și Stop butoane, selectați-vă dispozitiv din meniul derulant al simulatorului. Am ales Vardhan's iPhone, dar trebuie să selectați dispozitivul dvs. specific.
Acum ați terminat proiectul de pornire și ar trebui să vedeți o navă spațială virtuală care apare în lumea dvs. odată ce faceți clic Alerga. Iată cum ar trebui să arate:
Înainte de a începe să programați această aplicație, este important să înțelegeți modul în care ARK detectează de fapt aceste avioane. În acest tutorial, vom explora două concepte principale: puncte caracteristice și planuri orizontale. Pe scurt, realitatea augmentată pe iPhone funcționează cu un proces numit Vizometru inerțial vizual (VIO), care ia datele de pe camerele dvs. și senzorii interni pentru a obține o înțelegere 3D a unei scene.
Deci, ce anume este un punct caracteristic? Fiecare imagine, firește, ar avea propriile caracteristici unice. De exemplu, într-o floare, ar exista forme unice, sau pe un covor, pot exista texturi distinctive.
Aceste puncte reprezintă caracteristici notabile detectate în imaginea aparatului foto. Pozițiile lor în spațiul global de coordonate 3D sunt extrapolate ca parte a analizei imaginii pe care ARKit o realizează pentru a urmări cu precizie poziția, orientarea și mișcarea dispozitivului. Luate împreună, aceste puncte se corelează în mod liber cu contururile obiectelor din lumea reală în vederea camerei. - Măr
După cum explică documentația Apple, punctele caracteristice vă ajută dispozitivul (și ARKit) să înțeleagă profunzimea și "realismul" lumii dvs., făcând realitatea augmentată mult mai precisă. Acestea sunt, de asemenea, folosite pentru a vă ajuta să oferiți obiectelor virtuale un loc de ancorare, ajutându-le să înțeleagă unde să rămână în cazul în care vă mutați dispozitivul.
Similar cu punctele caracteristice, planurile orizontale ajută aplicația dvs. să își dea seama de împrejurimile sale. Nu este surprinzător faptul că punctele caracteristice și planurile orizontale sunt foarte strâns legate prin faptul că aceste planuri nu au putut fi detectate fără puncte caracteristice.
Folosind senzorii încorporați ai iPhone-ului, inclusiv camera (desigur) și o combinație a acestor puncte de caracteristică, ARKit poate detecta diverse planuri în scenă. Aceste calcule și estimări se efectuează în fiecare cadru, iar mai multe planuri pot fi detectate simultan.
Când executați o sesiune AR de urmărire mondială a cărei opțiune planDetecție este activată, sesiunea adaugă în mod automat la lista de ancore un obiect ARPlaneAnchor pentru fiecare suprafață plană pe care ARKit o detectează cu camera foto orientată spre spate. Fiecare ancoră plană oferă informații despre poziția și forma estimată a suprafeței. - Măr
Grozav! Acum aveți o aplicație ARKit. Scopul tău pentru această aplicație este să poți detecta un plan orizontal și să îl vizualizezi cu puncte de caracteristică (puncte virtuale care sunt plasate pe scene în ARKit).
Acum aveți o înțelegere solidă a punctelor de caracter și a planurilor orizontale și sunteți gata să începeți să le programați într-o aplicație. Dacă doriți mai mult fundal pe puncte de caracter și planuri orizontale, aș recomanda citirea documentației Apple.
Dacă vă deschideți ViewController.swift fișier, veți observa că Apple are deja un cod de pornire deja setat pentru dvs. (ceea ce face o navă spațială). Nu vom acoperi ceea ce înseamnă tot în acest tutorial, dar dacă doriți să aveți o explicație line-by-line, nu ezitați să verificați celălalt tutorial al meu pe ARKit.
Din moment ce o mulțime de cod este un cod de boilerplate, îl vom păstra, dar în ceea ce privește nava spațială, haideți să ieșim din cale eliminând codul care se ocupă de plasarea sa. În tine ViewController.swift dosar, în cadrul dvs. viewDidLoad () metodă, elimina următoarele linii de cod:
lasati scena = SCNScene (denumita: "art.scnassets / ship.scn")! sceneView.scene = scenă
Proiectul dvs. Xcode este acum gata să înceapă lucrul. Primul nostru pas este să adăugăm puncte vizibile. Este posibil să nu le faceți vizibile pentru aplicațiile de producție, dar este o caracteristică minunată pentru depanarea aplicațiilor de realitate augmentate.
Acest pas este destul de simplu și se poate face într-o singură linie. În tine viewDidLoad () adăugați următoarea linie de cod:
sceneView.debugOptions = [ARSCNDebugOptions.showFeaturePoints]
Acest cod configurează opțiunile de depanare folosind o serie de opțiuni. Puteți să activați alte funcții prin adăugarea lor la acest tablou, dar pentru moment, trebuie doar să afișăm punctele noastre de caracteristică. Iată cum ar trebui să arate când rulezi aplicația:
După cum puteți vedea, toate funcțiile detectate sunt vizibile. Dacă nu le vedeți, încercați să mutați iPhone-ul în jur și ar trebui să vedeți că apar puncte galbene. O parte din motivul pentru care nu apar imediat este că ARKit încă detectează scena.
Acum suntem pregătiți să detectăm avionul. Dacă te uiți la tine viewWillAppear () , veți vedea următoarele două linii de cod. Să facem un moment pentru a afla ce înseamnă ei, deoarece vor fi relevanți pentru detectarea avionului:
lasă configurația = ARWorldTrackingConfiguration () sceneView.session.run (configurație)
Aici, o instanță a ARWorldTrackingConfiguration clasa este făcută. Această clasă este responsabilă pentru poziționarea dispozitivului. După aceea, executăm configurația pe curentul nostru sceneView sesiune. Dacă sunteți interesat să aflați mai multe despre acest lucru, puteți vizita Documentația Apple despre acest lucru. Pentru moment, totuși, sunteți gata să continuați la pasul următor.
Acum, hai să permitem detectarea avionului ARWorldTrackingConfiguration. Sub linia care creează configurația, va trebui să introduceți următoarea linie:
configuration.planeDetection = .horizontal
Excelent! Acum, detectarea planului orizontal este activată, dar nu o putem vedea pentru că se întâmplă sub capotă, ceea ce înseamnă că iPhone știe unde este avionul, dar nu putem vedea ce gândește.
Înainte de a începe să vizualizăm avioanele detectate, va trebui să aflăm când și unde sunt detectate avioanele. Acest lucru se poate face cu ușurință printr-o metodă delegată care ne este furnizată de Apple.
Începeți prin a declara o metodă pentru ARSCNViewDelegate, și după cum veți vedea, ViewController clasa este deja conformă cu acest delegat în codul de pornire. Inserați următoarea metodă de delegație în dvs. ViewController clasă:
func renderer (_ renderer: SCNSceneRenderer, nodul didAdd: SCNNode, pentru ancora: ARAnchor) // Codul merge aici
Aceasta se numește atunci când este nouă ARAnchors se adaugă cu un nod corespunzător, care, în acest caz, ar fi planurile noastre orizontale.
Spune delegatului că un nod SceneKit corespunzător unei noi ancore AR a fost adăugat la scenă. - Apple
Cu toate acestea, pentru majoritatea aplicațiilor, doriți ca utilizatorul să poată spune unde apreciază că aplicația dvs. vede pe planurile orizontale, așa că vom învăța cum să afișăm aceste planuri utilizatorilor folosind nodul și ancora furnizate de delegat metoda pe care am apelat-o mai devreme.
Prima noastră întrebare este: este ARAnchor într-adevăr un avion, sau este ceva ce nu vrem? Putem verifica acest lucru folosind turnarea de tip și legarea opțională. Puneți această linie de cod în metoda dvs. delegat:
dacă lăsați ancora = ancora ca? ARPlaneAnchor // Codul dvs. merge aici
S-ar putea să fi observat că ancoră parametrul are tipul ARAnchor. Dacă vrem să știm dacă această ancora este un avion, putem încerca să-l exprimăm ca un avion ARPlaneAnchor. Dacă reușim asta, știm că a fost detectat un avion.
În interiorul instrucțiunii de legare opțională, să adăugăm codul pentru a crea un SCNPlane cu dimensiunile ancorei pe care am primit-o de la metoda delegatului. Scrieți următoarele două linii de cod:
lăsați plane = SCNPlane (lățime: CGFloat (anchor.extent.x), înălțime: CGFloat (anchor.extent.z)) plane.materials.first? .diffuse.contents = UICcolor.red.withAlphaComponent (0.5)
Prima linie aici creează o structură bidimensională SCNPlane care ia doi parametri în constructorul său: o lățime și o înălțime. Veți vedea că intrăm anchor.extent.x și anchor.extent.z, care, după cum sugerează numele lor, reprezintă lățimea și înălțimea planelor detectate. Veți observa că am omis valoarea y a ancorei și asta pentru că avioanele pe care le detectăm sunt bidimensionale, iar axele x și z rulează în planuri pe care le identificăm.
Următoarea linie de cod aplică o nuanță roșie translucidă la aceste planuri detectate și puteți vedea prin aceste planuri, deoarece valoarea alfa este setată la 0,5. Desigur, puteți folosi toate culorile sau aparențele pe care le doriți, atâta timp cât veți putea să le vedeți.
Nu am terminat încă; tot trebuie să creăm nodul pe care să îl adăugăm la viziunea noastră. Deși avionul nostru este un obiect bidimensional, trebuie să îl reprezentăm în 3D cu o coordonate x, y și z. Aceste coordonate vor fi relativ la nodul părinte al ancorei plane detectate și nu la sceneView. Introduceți următoarele linii de cod:
permiteți planeNode = SCNNode (geometrie: plan) planeNode.position = SCNVector3 (CGFloat (anchor.center.x), CGFloat (anchor.center.y), CGFloat (anchor.center.z)) planeNode.eulerAngles.x = -. pi / 2 node.addChildNode (planNode)
Mai întâi creăm o SCNNode cu geometria planului pe care am creat-o în pasul anterior. Aceasta se face prin trecerea geometriei ca parametru al lui SCNNodeconstructorul.
Apoi, poziționăm nodul plan în direct în centrul ancorei plane folosind a SCNVector3 reprezentarea coordonatelor x, y și z în plan tridimensional.
De asemenea, în linia următoare, veți vedea că X valoarea noastră Unghiurile lui Euler este setat la -π / 2. Proprietatea Unghiurile lui Euler reprezintă pitchul, răsucirea și rotirea SCNNode. Conform documentației Apple, valoarea x reprezintă pasul (sau rotația în jurul axei x) și dorim ca a noastră să fie plat față de plan (nu se lipesc în poziție verticală).
Ulterior, nodul nou creat este adăugat ca un nod copil al nodului planificat detectat pentru a fi vizibil pentru utilizatorul din aceeași locație.
Buna treaba! Ar trebui acum să vedeți planuri orizontale (și, bineînțeles, punctele de caracteristică) atunci când executați aplicația pe iPhone. Dacă nu, asigurați-vă că vă mutați telefonul încet pentru ca acesta să scaneze suprafața și încercați să măriți alfa culorii pe care am setat-o mai devreme. Iată ce arată a mea:
Acum știți cum să detectați suprafețe plane, cum ar fi mese sau mese, și le afișați utilizatorilor ca planuri orizontale. În plus, ați putut vedea modul în care ARKit văd lumea cu puncte de caracter. În timp ce sunteți aici, asigurați-vă că ați verificat câteva dintre celelalte cursuri și tutoriale ale noastre ARKit aici pe Envato Tuts+!
