Share
I denne serien lærer vi hvordan du bruker SpriteKit til å bygge 2D-spill for iOS. I dette innlegget fortsetter vi utforskningen av SpriteKit-noder, og lærer om en spesiell type node som heter "sprite" -an SKSpriteNode.
For å følge med denne opplæringen, bare last ned den medfølgende GitHub repo. Den har en mappe som heter Eksempelprosjektstarter. Åpne prosjektet i den mappen i Xcode, og du er klar til å gå!
en SKSpriteNode tegnes enten som et rektangel med en tekstur som er kartlagt på den, eller som et farget, ustrukturert rektangel. Opprette en SKSpriteNode med en tekstur som er kartlagt på den, er den vanligste, slik at du bringer spillets kunstverk til livs.
Legg til følgende i didMove (i :) metode innenfor GameScene.swift.
overstyr func didMove (for å se: SKView) la startGameLabel = SKLabelNode (tekst: "Start spillet") startGameLabel.name = "startgame" startGameLabel.position = CGPoint (x: size.width / 2, y: size.height / 2 ) addChild (startGameLabel) la redSprite = SKSpriteNode (farge: .red, størrelse: CGSize (bredde: 200, høyde: 200)) addChild (redSprite)
Her bruker vi praktisk intiailizer init (farge: størrelse :) som vil tegne en rektangulær sprite med farge og størrelse du passerer inn som parametere. Hvis du tester prosjektet nå, vil du se halvparten av det røde torget som vises.
Du lurer kanskje på hvorfor bare halvparten av sprite viser siden vi allerede har bestemt det SKNodes opprinnelse er på (0,0). Dette fordi SKSpriteNodes ramme og derfor er konsistensen sentrert på sin posisjon. For å endre denne oppførselen, kan du endre spriteens forankringspunkt eiendom, som bestemmer hvilket punkt rammen er plassert på. Diagrammet nedenfor viser hvordan forankringspunkt virker.
De forankringspunkt er spesifisert i enhetskoordinatsystemet, hvilke steder (0,0) nederst til venstre og (()1,1) øverst til høyre i rammen. Standard for SKSpriteNodes er (0.5,0.5).
Gå videre og endre forankringspunkt eiendom til (0,0) og legg merke til forskjellen det gjør.
overstyr func didMove (for å se: SKView) la startGameLabel = SKLabelNode (tekst: "Start spillet") startGameLabel.name = "startgame" startGameLabel.position = CGPoint (x: size.width / 2, y: size.height / 2 ) addChild (startGameLabel) la redSprite = SKSpriteNode (farge: .red, størrelse: CGSize (bredde: 200, høyde: 200)) redSprite.anchorPoint = CGPoint (x: 0, y: 0) addChild (redSprite)
Nå, hvis du tester, vil du se at sprite er foret opp perfekt med bunnen til venstre på scenen.
La oss nå flytte den til toppen av scenen ved å endre posisjonens egenskap. Erstatt din didMove (i :) fungere med følgende:
overstyr func didMove (for å se: SKView) la startGameLabel = SKLabelNode (tekst: "Start spillet") startGameLabel.name = "startgame" startGameLabel.position = CGPoint (x: size.width / 2, y: size.height / 2 ) addChild (startGameLabel) la redSprite = SKSpriteNode (farge: .red, størrelse: CGSize (bredde: 200, høyde: 200)) redSprite.anchorPoint = CGPoint (x: 0, y: 0) redSprite.position = CGPoint (x: size.width / 2 - 100, y: size.height - 210) addChild (redSprite)
Legg merke til hvordan vi måtte trekke fra begge x og y verdier for å sentrere sprite. Hvis vi hadde forlatt forankringspunkt ved standard da ville det allerede vært sentrert på x akser. Det er viktig å huske at når du bytter ankerpunkt, må du kanskje gjøre noen justeringer i posisjoneringen.
Den røde boksen er god for praksis med posisjonering, men du vil vanligvis teksturere sprite med kunstverk for spillet ditt.
La oss lage en strukturert SKSpriteNode. Legg til følgende kode nederst på siden didMove (i :) metode.
overstyr func didMove (for å se: SKView) ... la spilleren = SKSpriteNode (imageNamed: "player") player.position = CGPoint (x: size.width / 2, y: 300) addChild (spiller)
Her bruker vi bekvemmelighetsinitiatoren init (imageNamed :), som tar som en parameter navnet på et bilde uten utvidelsen. Dette er den enkleste måten å lage en teksturert sprite som det skaper tekstur for deg fra bildet du sender inn.
Den andre måten å lage en strukturert SKSpriteNode er å skape en SKTexture på forhånd, og bruk en av intializers som tar en tekstur som en parameter.
La oss lage et par flere SKSpriteNodes og endre noen av sine eiendommer. Igjen, legg disse til bunnen av din didMove (i :) funksjon.
overstyr func didMove (for å se: SKView) ... la enemy1 = SKSpriteNode (imageNamed: "enemy1") enemy1.position = CGPoint (x: 100, y: 300) enemy1.xScale = 2 addChild (fiende1) la enemy2 = SKSpriteNode imageNamed: "enemy2") enemy2.position = CGPoint (x: size.width - 100, y: 300) enemy2.zRotation = 3,14 * 90/180 addChild (fiende2)
Her oppretter vi to SKSpriteNodes, enemy1 og enemy2. Vi satte XScale på enemy1 til 2 og endre zRotation på enemy2 å rotere den av 90 grader. (De zRotation Egenskapen tar det verdier i radianer, og en positiv verdi indikerer rotasjon mot urviseren.)
Vi har eksperimentert med å endre noen egenskaper på en sprite. Ta en titt på dokumentasjonen for SKNodes og SKSpriteNodes og prøv å endre noen av de andre egenskapene for å se effektene de har.
Sprite noder er gode for grunnleggende rektangler og teksturer, men noen ganger vil en mer komplisert form være nødvendig. De SKShapeNode har du dekket de tilfellene. Vi tar en titt på formnoder neste.
En annen nyttig node er SKShapeNode. Denne noden gir en form som er definert av en Core Graphics-bane. SKShapeNodes er nyttige for innhold som ikke lett kan realiseres med en SKSpriteNode. Denne klassen er mer minneintensiv og har lavere ytelse enn å bruke en SKSpriteNode, så du bør prøve å bruke det sparsomt.
Å tilordne en form til SKShapeNode, du kan sette en CGPath til knutepunktet sti eiendom. Det er imidlertid noen få initiativer som tilbyr forhåndsdefinerte former som rektangler, sirkler og ellipser. La oss lage en sirkel ved hjelp av bekvemmelighetsinitialiseringen init (circleOfRadius :).
Deretter legger du til følgende i bunnen av didMove (i :) metode.
overstyr func didMove (for å vise: SKView) ... la sirkel = SKShapeNode (circleOfRadius: 50) circle.strokeColor = SKColor.green circle.fillColor = SKColor.blue circle.lineWidth = 8 circle.position = CGPoint (x: size.width / 2, y: 400) addChild (sirkel)
Vi endrer noen egenskaper på formoden, plasserer den og legger den til scenen. Det er veldig enkelt å bruke forhåndsdefinerte forminitiatorer. Men skaper et kompleks CGPath manuelt tar en betydelig mengde tid og er ikke for svak av hjertet som det vanligvis involverer noen komplisert matte.
Heldigvis finnes det et verktøy som lar deg tegne former visuelt og eksportere dem CGPath som Swift-kode. Sjekk ut PaintCode hvis du vil lære mer.
Sprite Noder og Shape Noder vil dekke de fleste tilfeller, men noen ganger kan du ønske å vise video i appene dine. De SKVideoNode, som vi vil ta en titt på neste, har du dekket.
Den siste noden vi skal ta en titt på er SKVideoNode. Som navnet antyder, lar denne noden deg spille video i spillene dine.
Det er noen forskjellige måter å opprette en SKVideoNode. En bruker en forekomst av en AVPlayer, en annen bruker bare navnet på en videofil som er lagret i apppakken, og den tredje måten er å bruke en URL.
En ting å huske på er at videoen er størrelse Eiendommen vil i utgangspunktet være den samme som størrelsen på målvideoen. Du kan endre dette størrelse eiendom, skjønt, og videoen vil bli strukket til den nye størrelsen.
En annen ting å være klar over er at SKVideoNode tilbud spille() og pause() bare metoder. Hvis du vil ha mer kontroll over videoene dine, vil du initialisere en SKVideoNode med en eksisterende AVPlayer og bruk det til å kontrollere videoene dine.
La oss bruke den enkleste metoden for å lage en SKVideoNode. Legg til følgende nederst på siden didMove (i :) metode.
overstyr func didMove (for å se: SKView) ... la video = SKVideoNode (filnavn: "video.mov") video.position = CGPoint (x: size.width / 2, y: 600) addChild (video) video.play )
Her brukte vi intiailisatoren init (fileNamed :) å lage en video. Du sender i videoens navn sammen med utvidelsen. Jeg har ikke tatt med en video sammen med prosjektets kildekode, men hvis du vil se dette arbeidet, kan du legge til en video med tittelen "video.mov"til prosjektet ditt.
Dette fullfører studien på noder. Etter å ha lest dette innlegget og den forrige, bør du ha en god forståelse av SKNodes og deres underklasser. I neste del av denne serien vil vi se på SKActions og bruke fysikk i våre spill. Takk for at du leser, og jeg vil se deg der!
I mellomtiden kan du sjekke ut noen av våre andre flotte kurs og opplæringsprogrammer for å lage iOS-apper med Swift og SpriteKit.
Se også våre SpriteKit kurs! Disse vil ta deg gjennom alle trinnene for å bygge ditt første SpriteKit-spill for iOS, selv om du aldri har kodet med SpriteKit før.
Accentsconagua