Share
Până de curând, Realitatea Augmented a fost una dintre acele idei "futuriste" care au fost portretizate în utopiile science-fiction. Dar a sosit timpul când construirea unei aplicații AR a devenit o realitate și puteți avea una în buzunar.
În acest tutorial, veți învăța cum să aduceți Marte, cea mai apropiată planetă pe Pământ, în camera voastră.
Î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ă creați un nou proiect Xcode.
Du-te și deschideți Xcode și faceți clic pe Creați un nou proiect Xcode.
S-ar putea să fii obișnuit să faci a Vizualizare individuală, dar pentru acest tutorial, va trebui să alegeți un Aplicație realitate augmentată apoi faceți clic pe Următor →.
Puteți numi proiectul dvs. tot ce vă place, dar voi fi numit pe mine ARPlanets. 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:
Bine, în sfârșit, suntem gata să facem mai adânc și să scriem un cod. Aveți deja o aplicație ARKit de lucru, așa că să construim și să facem ceva rău.
Dacă te uiți la dosarul numit art.scnassets, veți observa că acesta conține deja două lucruri: nodul navei spațiale și textura sa. În acest exemplu, Apple a creat un obiect spațiu gol și practic a folosit o suprapunere de imagine pentru a-și forma culorile și formele.
În mod similar, vom crea propria sferă și vom suprapune o imagine a suprafeței planetei Marte pentru a crea o reprezentare exactă a planetei Marte.
Șablonul ARKit din Xcode vine cu o grămadă de cod pre-scris pentru a face nava spațială să apară, deci hai să luăm ceva timp pentru a explora ceea ce înseamnă totul și de ce funcționează.
În partea de sus a fișierului, veți vedea următoarele:
import import import UIKit SceneKit import ARKit
În vârf, UIKit este importată și avem nevoie de ea, deoarece vizualizarea principală va fi a UIViewController. Rețineți când ați selectat SceneKit în configurarea proiectului? Este importat chiar împreună cu ARKit jos. Acestea sunt toate bibliotecile utilizate de acest fișier.
Mai jos, veți vedea o declarație de clasă și următoarea linie de cod:
@IBOutlet var sceneView: ARSCNView!
Nu trebuie să mergem prea mult în profunzime aici, dar aceasta este o viziune augmented Reality SceneKit, care este legată printr-un @IBOutlet la panoul de distribuție. Aceasta este viziunea principală pentru tot ceea ce vom introduce în acest tutorial.
Mergând un pic mai departe, viewDidLoad () metoda ar trebui să arate astfel:
override func vizualizareDidLoad () super.viewDidLoad () // 1 sceneView.delegate = auto // 2 sceneView.showsStatistics = adevărat // 3 let scena = SCNScene (numit: "art.scnassets / ship.scn")! // 4 sceneView.scene = scena
Iată ce face acest cod:
Accentsconagua
sceneView care a fost legat de storyboard? Îi atribuim delegatul nostru ViewController deoarece este conformă cu ARSCNViewDelegate protocol.ship.scn (redarea 3D) din dosarul numit art.scnassets. În această linie, o SCNScene, care este o ierarhie a nodurilor (în acest caz, nava spațială și camera ei) este creată.sceneView, care este conectat la storyboard cu un @IBOutlet.Nu am acoperit fiecare linie în ViewController.swift fișier, dar ceea ce ne-am referit este important pentru dvs. să știți pentru a urma împreună cu tutorialul și pentru a vă crea propriile aplicații ARKit în viitor.
De când vom face o planetă în locul unei nave spațiale în aplicația noastră ARKit, va trebui să o eliminați.
Mai întâi, eliminați următoarele două fișiere din art.scnassets pliant: ship.scn și texture.png. Nu vom mai avea nevoie de acestea.
Apoi, întoarce-te la tine ViewController.swift fișier și localizați următoarea linie de cod:
// Creați o nouă scenă pentru a permite scena = SCNScene (numită: "art.scnassets / ship.scn")!
Deoarece nu mai avem ship.scn fișierul, această linie de cod va cauza prăbușirea aplicației noastre, mai ales pentru că semnul exclamării de la sfârșitul acestei linii îl forțează. Deoarece nu vom folosi a .NCS fișier pentru nava noastră, nu este nevoie să inițializeze SCNScene cu un șir.
Pur și simplu înlocuiți această linie de cod cu următoarele:
// Creați o nouă scenă pentru a permite scena = SCNScene ()
Dacă rulați acum aplicația, veți vedea realitatea, dar nu va fi mărită. Cu alte cuvinte, nava spațială va dispărea.
Mai jos viewDidLoad (), creați o declarație a funcției după cum urmează:
// Crează funcția planetă Marte createMars () // Do stuff
Nu pare puțin inutil să creați ceva și să nu îl returnați? În funcție, va trebui să ne întoarcem SCNNode. În timp ce suntem la ea, să luăm de asemenea un parametru pentru poziția planetei.
După ce ați făcut aceste modificări, metoda dvs. ar trebui să apară astfel:
// Creeaza functia planeta Marte createMars (la pozitia: SCNVector3) -> SCNNode // Do stuff
Din moment ce Marte este sferic, să creăm o sferă care să fie forma de bază a planetei Marte. Puteți alege să faceți acest lucru direct în viewDidLoad () dar vom folosi funcția pe care am declarat-o mai sus.
În interiorul funcției dvs., introduceți următorul cod:
// 1 ani sferă = SCNSphere (rază: 0,4) // 2 nod nod = SCNNode (geometrie: sferă) // 3 nod.localizare = poziție // 4 nod retur
Iată ce face acest cod:
SCNSphere cu o rază de 0.4. SCNNode care pot fi returnate la site-ul de apeluri funcționale.createMars () , folosim aici parametrul pentru a seta poziția SCNNode pe care am creat-o pe linia anterioară.SCNNode la funcția respectivă.Până acum, am creat o sferă, dar pentru ao face să apară deloc, trebuie să o adăugăm la scena noastră actuală. Pentru a face acest lucru, adăugați aceste trei linii de cod la dvs. viewDidLoad () metodă:
// 1a pozitie = SCNVector3 (0, 0, -3) // 2 ani mars = createMars (la: pozitie) // 3 scene.rootNode.addChildNode (mars)
Acesta este ceea ce face codul:
SCNVector3 (care este o reprezentare tridimensională a unui punct în spațiu) care urmează să fie transmisă în createMars () funcție pe care am creat-o mai devreme.createMars () și trecând în poziția de la variabila precedentă. Apoi, atribuim nodul care returnează această funcție unei variabile numite Marte.Marte la scena care a fost furnizată în proba de proiect de la Apple.Wow! Am făcut deja destule progrese. Dacă rulați aplicația acum, ar trebui să puteți vedea că există o sferă albă undeva în lumea voastră. Dacă încercați să o vizualizați din alte unghiuri, va arăta doar ca un cerc, dar asta pentru că nu avem încă texturi sau umbre. Asa ar trebui sa arate:
Acum că avem o sferă în loc, trebuie să adăugăm o textură astfel încât să pară planeta reală, Marte. Tocmai am căutat o fotografie a suprafeței lui Marte și o voi folosi, dar puteți folosi orice fotografie doriți (dacă doriți să amestecați lucrurile, puteți chiar utiliza texturile altor planete).
Pentru a utiliza imaginea pe care tocmai ați primit-o, va trebui să o plasați în două dosare: art.xcassets și art.scnassets. Un alt lucru de reținut: dacă doriți să puteți copia și lipi acest cod în proiectul dvs., va trebui să denumiți imaginea mars_texture.png, și trebuie să fie un PNGfişier.
Adăugați următorul cod înainte de întoarcere linie în funcție createMars ():
materialul = SCNMaterial () material.diffuse.contents = #imageLiteral (resourceName: "mars_texture.png") sphere.firstMaterial = material
În primul rând, creăm un SCNMaterial pe care SceneKit le poate folosi mai târziu pentru a înfășura sfera și îi atribuim unei constante numite material. Apoi, împărțim imaginea selectată și reassignăm conținutul implicit SCNMaterial. Cu alte cuvinte, material constantă conține acum această imagine pentru a fi utilizată ca o SCNMaterial. În cele din urmă, împachetăm sfera cu SCNMaterial pe care am făcut-o anterior.
Acum ați terminat și dacă rulați aplicația, veți putea să-l vedeți pe Marte în camera dvs.! Puteți chiar să vă plimbați și să o vedeți din diferite unghiuri. Iată cum ar trebui să arate:
Acum, puteți vedea cât de ușor este să implementați Realitatea Augmented în aplicația dvs. Poți să-ți faci imaginația sălbatică cu ea și chiar să faci jocuri complete. Dacă aveți mai multe abilități tehnice de redare tridimensionale, puteți integra și acest lucru cu abilitățile dumneavoastră.
Sper că acest tutorial a fost informativ și vă bucurați de el!
