SpriteKit este motorul de jocuri 2D al Apple - un motor de randare construit pe partea de sus a OpenGL. Acesta a fost introdus cu iOS 7, iar fiecare lansare ulterioară a adus mari adăugări în cadrul. Cu ajutorul spritelor texturate, un motor de fizică încorporat și cel foarte puternic SKAction
clasa, puteți construi foarte rapid jocuri funcționale 2D.
SpriteKit are built-in editori pentru scene și particule, un nod de cameră de la lansarea iOS9 și suport încorporat pentru tilesets de la lansarea iOS 10. Cu aceste noi adăugiri, SpriteKit devine rapid o putere pentru crearea de jocuri 2D.
Pentru a urmări împreună cu acest tutorial, trebuie doar să descărcați reparațiile GitHub însoțitoare. Are un dosar numit ExempluProiect de pornire. Deschideți proiectul în acel folder în Xcode și sunteți gata să plecați!
Nodurile reprezintă blocurile fundamentale ale SpriteKit și SKNode
este clasa de bază a tuturor nodurilor. Toate activele de pe ecran vor fi una SKNode
sau o subclasă a acestuia. SKNode
însă nu oferă niciun conținut vizual. Toate conținuturile vizuale sunt desenate utilizând unul din mai multe predefinite SKNode
subclase. SKNode
s și subclasele sale împărtășesc câteva proprietăți pe care le puteți modifica. Unele dintre cele mai importante sunt după cum urmează.
poziţie
(CGPoint
): poziția nodului în cadrul sistemului de coordonate al părinteluiXScale
(CGFloat
): măsoară lățimea unui nod cu ajutorul unui multiplicatoryScale
(CGFloat
): se calculează înălțimea unui nod printr-un multiplicatoralfa
(CGFloat
): transparența noduluizRotation
(CGFloat
): rotația Euler în jurul axei z (în radiani)Unul dintre cele mai importante SKNode
s este SKScene
. Acesta este nodul rădăcină la care sunt adăugate toate celelalte noduri. De la sine, SKScene
nu furnizează elemente vizuale, dar afișează nodurile care sunt adăugate la ele.
SKScenes
sunt nodurile rădăcină la care sunt adăugate toate celelalte noduri. Scena animă și redă conținutul din nodurile copilului său. Pentru a afișa o scenă, o adăugați într-o scenă SKView
(care este o subclasă de UIView
și, prin urmare, are multe din aceleași proprietăți ca UIView
).
În cadrul proiectului Starter SpriteKit, scena inițială se afișează când se încarcă proiectul. Deocamdată, acesta este doar un ecran neagră necompletat. Se afișează când GameViewController
invocă presentScene (_ :)
pe instanța de vizualizare, trecând în scenă ca parametru:
override functie viewDidLoad () super.viewDidLoad () let scena = GameScene (dimensiune: CGSize (latime: 768, inaltime: 1024)) skView = self.view as! SKView skView.showsFPS = falsă skView.showsNodeCount = falsă skView.ignoresSiblingOrder = falsă scena.scaleMode = .aspectFill skView.presentScene (scena) // Prezentarea Scenei
Nu vă faceți griji cu privire la celelalte opțiuni pentru moment; Le voi explica mai târziu în această serie.
Multe jocuri au mai mult de un ecran sau o scenă, așa că vom crea o nouă scenă de la zero și apoi o vom arăta din scena noastră inițială.
Selectați Fişier > Nou > Fişier din meniul Xcode și alegeți Cocoa Touch Class.
Asigura-te Clasă este setat sa NewScene și asta Subclasa de este setat sa SKScene
. presa Următor → și apoi Crea, asigurându-vă că obiectivul principal este verificat. Mai jos este codul pentru NewScene.swift.
import Import UIKit Clasa SpriteKit NewScene: SKScene
Acum avem două scene în proiectul nostru și niciunul nu are conținut vizual. Să adăugăm un SKLabelNode
(ca toate nodurile, aceasta este o subclasă de SKNode
). SKLabelNode
are un singur scop de a afișa o etichetă de text.
Etichete noduri, implementate în SKLabelNode
clasa, sunt folosite pentru a afișa textul în joc. Aveți posibilitatea să utilizați fonturi personalizate, dacă doriți, însă pentru scopurile noastre vom rămâne la valoarea implicită, care afișează text alb și este setată la Helvetica Neue Ultra Light, 32 de puncte.
Adăugați următoarele în interiorul didMove (la :)
metoda în cadrul GameScene.swift. Această metodă este chemată imediat după ce o scenă este prezentată de o vizualizare. În general, acesta este locul în care vă instalați oricare dintre activitățile jocului dvs. și le adăugați la scenă.
override func didMove (pentru a vedea: SKView) lăsați startGameLabel = SKLabelNode (text: "Start Game")
Aici creăm un SKLabelNode
utilizând inițializatorul de confort init (text :)
, care ia ca parametru un șir de text.
Doar inițializarea nodurilor nu le va afișa în scenă. Pentru a vedea nodurile, trebuie să invocați addChild (_ :)
metoda pe nodul de primire, trecând SKNode
pe care doriți să o adăugați ca parametru.
Adăugați următoarele în cadrul didMove (la :)
metodă.
suprascrie func didMove (pentru a vizualiza: SKView) lăsați startGameLabel = SKLabelNode (text: "Start Game") addChild (startGameLabel)
addChild (_ :)
metoda nu este exclusivă SKScene
s, dar este o metodă de SKNode
. Aceasta vă permite să construiți o ierarhie complexă de noduri - cunoscută sub numele de "arbore nod". De exemplu, să presupunem că aveți un personaj de joc și că doriți să mutați separat brațele și picioarele. Ai putea crea un SKNode
instanță și apoi adăugați fiecare parte individuală ca fiind un copil al acesteia SKNode
(nodul conținut este cunoscut ca nodul părinte). Acest lucru vă va oferi avantajul de a fi capabil să mutați caracterul ca o unitate întreagă prin mutarea părintelui SKNode
, dar, de asemenea, vă permit să mutați fiecare parte individuală în mod individual.
O altă metodă importantă pentru adăugarea nodurilor este insertChild (_: la :)
, care introduce un copil într-o poziție specifică în lista de copii a nodului receptor. Când adăugați un copil la un nod, nodul menține o listă ordonată de copii la care se face referire prin citirea nodului copii
proprietate. Este important să adăugați noduri multiple la un nod părinte pentru a lua în considerare acest lucru, deoarece ordinea în care adăugați nodurile afectează unele aspecte ale procesării scenelor, inclusiv testarea hit-urilor și randarea.
Pentru a elimina un nod, invocați removeFromParent ()
pe nodul pe care doriți să îl eliminați.
Acum, că am acoperit adăugarea și eliminarea nodurilor, ne putem mișca înapoi în proiectul de exemplu. Dacă vă amintiți, tocmai tocmai am adăugat SKLabelNode
la GameScene
. Dacă încercați acum, veți vedea doar jumătate din text în stânga jos a ecranului.
De ce este doar jumătate din textul afișat? Acum ar fi un moment bun pentru a vorbi despre sistemul de coordonate și poziționare al SpriteKit.
Implicit, sistemul de coordonate al SpriteKit plasează (0,0) în partea stângă jos a ecranului. De asemenea, în mod implicit, SpriteKit plasează nodurile astfel încât să fie poziționate la (0,0). Totuși, deși ... de ce vedem doar jumătate din text? Acest lucru se datorează faptului că, în mod prestabilit, eticheta de text este centrat orizontal pe originea nodului de etichetă, care este (0,0). Mai jos este o imagine care arată cum funcționează sistemul de coordonate al unui nod.
Originea nodurilor se află la (0,0), iar o coordonată pozitivă x se mișcă spre dreapta și o coordonată pozitivă y urcă pe ecran. Ține minte că o SKScene este un nod și, prin urmare, originea sa este de asemenea (0,0).
Acum, că am învățat sistemul de coordonate al SpriteKit și cum localizează nodurile, putem muta SKLabelNode
într-o poziție diferită, astfel încât să putem vedea întregul text. Adăugați următoarele la didMove (la :)
metoda în cadrul GameScene.swift.
suprascrie func didMove (pentru a vizualiza: SKView) lasa startGameLabel = SKLabelNode (text: "Start Game") startGameLabel.position = CGPoint (x: size.width / 2, y: size.height / 2) addChild (startGameLabel)
Aici poziționăm eticheta în centrul scenei. poziţie
proprietatea este de tip CGPoint
, care are valori x și y care reprezintă un singur punct în interiorul scenei.
Dacă încercați acum, ar trebui să vedeți că eticheta a fost poziționată în centrul scenei.
În prezent, NewScene
este doar o scena goala. Să adăugăm, de asemenea, o etichetă și apoi să învățăm cum să comutați între scene. Iată o provocare: înainte de a citi mai departe, încercați să adăugați o etichetă NewScene
asta spune, "Întoarce-teSoluția mea este mai jos.
Primul lucru pe care trebuie să-l facem este să adăugăm didMove (la :)
metodă. Adăugați următoarele la NewScene.swift.
clasa NewScene: SKScene override func didMove (pentru vizualizare: SKView)
Apoi, trebuie să adăugăm eticheta. Adăugați următoarele în cadrul didMove (la :)
metoda pe care ați adăugat-o mai sus.
suprascrie func didMove (pentru a vizualiza: SKView) let goBackLabel = SKLabelNode (text: "Înapoi") goBackLabel.position = CGPoint (x: size.width / 2, y: size.height / 2) addChild (goBackLabel)
Aceasta adaugă o etichetă la NewScene
cu textul "Întoarce-te"Apoi vom implementa funcționalitatea sugerată de această etichetă - vom răspunde la evenimentele de atingere prin trecerea scenelor.
Aproape toate jocurile mobile vor fi interacționate cu ajutorul atingerii. În acest pas, veți învăța cum să răspundeți la evenimentele touch din cadrul jocului.
Pentru a înregistra driverele de evenimente touch în cadrul jocului, trebuie să implementați vizualizarea touchesBegan (_: cu :)
metodă. Adăugați următoarele la GameScene.swift:
suprascrie funcțiileBegan (atinge: Set, cu eveniment: UIEvent?) print ("YOU TOUCHED")
Dacă doriți să testați acest lucru acum, veți vedea TU ATINGEȚI tipărite pe consola când atingeți pe ecran. Totuși, de obicei, avem nevoie să aflăm când a fost atins un anumit nod. Pentru a face acest lucru, avem nevoie de o modalitate de a găsi și de a identifica nodurile. Vom învăța cum să realizăm acest lucru, apoi vom reveni și vom termina touchesBegan (_: cu :)
metodă.
Pentru a putea identifica un nod, folosiți nodurile Nume
proprietatea și căutarea arborelui nod pentru un nod cu acest nume. Nodul e Nume
proprietatea are un șir alfanumeric fără nici o semne de punctuație.
Există câteva metode pentru a căuta un nod prin intermediul acestuia Nume
proprietate. Dacă aveți deja o referință la nod, puteți să o verificați Nume
proprietate direct, ceea ce vom face în touchesBegan (_: cu :)
metodă. Cu toate acestea, este important să știm cum să căutăm arborele nod pentru un anumit nod după nume sau să căutăm un grup de noduri cu același nume.
childNode (withName :)
metoda caută copiii unui nod pentru numele specific transmis ca parametru.
enumerateChildNodes (withName: folosind :)
metoda caută copiii unui nod și cheamă blocul o dată pentru fiecare nod de potrivire pe care îl găsește. Utilizați această metodă atunci când doriți să găsiți toate nodurile care au același nume.
subscript (_ :)
metoda returnează o serie de noduri care se potrivesc cu parametrul nume.
De asemenea, puteți căuta noduri utilizând o sintaxă de căutare avansată, care vă permite să căutați întreg arborele de scene sau să căutați un model, nu un nume exact, de exemplu. Această capacitate de căutare avansată este dincolo de scopul acestui tutorial. Cu toate acestea, dacă doriți să aflați mai multe, puteți citi despre în SKNode
programare.
Acum, că știm cum să căutăm noduri în copacul nodului, să oferim etichetelor noastre un nume.
Adăugați următoarele în cadrul didMove (la :)
metoda în cadrul GameScene.swift.
suprascrie func didMove (pentru a vizualiza: SKView) lăsați startGameLabel = SKLabelNode (text: "Start Game") startGameLabel.name = "startgame" startGameLabel.position = CGPoint (x: size.width / 2; ) addChild (startGameLabel)
Aici, am stabilit startGameLabel
numele de proprietate la incepe jocul
.
De asemenea, trebuie să setăm numele etichetei înăuntru NewScene
. Adăugați următoarele cu didMove (la :)
metoda în cadrul NewScene.swift.
suprascrie func didMove (pentru a vizualiza: SKView) let goBackLabel = SKLabelNode (text: "Înapoi") goBackLabel.name = "goback" goBackLabel.position = CGPoint (x: size.width / 2, y: size.height / 2 ) addChild (goBackLabel)
Am setat Nume
proprietate la întoarce-te
.
Adăugați următoarele în cadrul touchesBegan (_: cu :)
metoda în cadrul GameScene.swift.
suprascrie funcțiileBegan (atinge: Set, cu eveniment: UIEvent?) paza permite atingere = atinge prima data inca return permite touchLocation = touch.location (in: self) let touchedNode = self.atPoint (touchLocation) permiteți newScene = NewScene (dimensiune: dimensiune) newScene.scaleMode = scaleMode lăsați doorClose = SKTransition.doorsCloseVertical (withDuration: 2.0) view? .presentScene (newScene, transition: doorsClose)
multiTouchEnabled
proprietatea vederii scenei este setată la fals
în mod implicit, ceea ce înseamnă că vizualizarea primește doar prima atingere a unei secvențe multitouch. Cu această proprietate dezactivată, puteți prelua atingerea utilizând primul
proprietatea calculată a seturilor de atingeri, deoarece există un singur obiect în set.
Putem obține touchLocation
în scena din Locație
proprietatea atingerii. Apoi ne putem da seama care nod a fost atins prin invocarea atPoint (_ :)
și trecerea în touchLocation
.
Verificăm dacă touchedNode
proprietatea de nume este egală cu "incepe jocul"
, și dacă este, știm că utilizatorul a atins eticheta. Apoi creăm un exemplu de NewScene
și setați-o scalemode
proprietatea să fie aceeași cu cea a scenei actuale - aceasta asigură faptul că scena funcționează la fel în diferite dispozitive. În cele din urmă, vom crea un SKTransition
și invocați presentScene (_: tranziție :)
care va prezenta scena împreună cu tranziția.
SKTransition
clasa are multe metode de clasă pe care le puteți invoca pentru a arăta tranziții diferite între scene în loc să arătați imediat scena. Acest lucru oferă un pic de "bomboane ochi" pentru utilizatorul final, și face să arate o nouă scenă par mai puțin abrupte. Pentru a vedea toate tipurile de tranziție disponibile, verificați SKTransition
clasă în ghidul de referință.
Nu o să pun în aplicare touchesBegan (_: cu :)
metoda în NewScene
. De ce nu încercați să faceți acest lucru pe cont propriu și să treceți la etichetă GameScene
folosind un alt tip de tranziție? Codul se va asemăna foarte mult cu ceea ce avem deasemenea, doar amintim că am numit-o SKLabelNode
"întoarce-te"
.
Am învățat un pic bun despre nodurile utilizate până în prezent folosind scene și ați văzut cum să utilizați un nod de etichete ca exemplu generic pentru a afla unele dintre caracteristicile nodurilor. Am studiat sistemele lor de coordonate, cum le putem localiza în arborele nodului, cum să le poziționăm și cum să răspundem evenimentelor touch.
Există mai multe alte tipuri de noduri disponibile și le vom arunca o privire în următorul tutorial - începând cu SKSpriteNode
!
Pentru a afla mai multe despre cum să începeți cu SpriteKit, ar trebui să verificați și postul lui Davis Allie aici pe Envato Tuts+.
De asemenea, verificați cursurile noastre SpriteKit! Acestea vă vor duce prin toți pașii de construire a primului joc SpriteKit pentru iOS, chiar dacă nu ați codat niciodată cu SpriteKit înainte.