8. diel - Ďalšie časticové efekty vo SpriteKit

V minulej lekcii, Dokončenie kolízií vo SpriteKit , sme sprevádzkovali kolízie pri strieľaní. Hra už obstojne funguje, ale stále je to také suché, nemyslíte? Skvelá príležitosť pridať si časticové efekty explózie a lasera.

Efekt explózie

Začneme efektom explózie.

Vytvorenie efektu

Vytvoríme teda nový súbor pomenovaný Explosion.sks a ako šablónu vyberieme opäť oheň.

Najdôležitejšie je tu nastavenie pre Emitter, kde zvolíme Birthrate 900 a Maximum 300. Tým zabezpečíme, že sa veľmi rýchlo zobrazí 300 častíc a ďalšie už nebudú vytvorené. Designer v Xcode prehráva preview stále dookola, pri použití ale uvidíme iba jeden výbuch.

Ďalej som nastavil Lifetime na 0.4, aby častice rýchlo zmizli. Position Range 10 pre X a Y. Nastavenie Angle na 0 ° a Range na 360 ° zaistí rovnomernú explózii do všetkých smerov. Speed som nastavil na 200 a Range na 50. Acceleration na 0 pre X a Y.

Potom som ešte upravil Color Ramp pre úpravu farby. Kliknutím na slider pridáte druhý kontrolný bod a klikom na neho môžete upraviť farbu. Zvolil som svetle oranžovú a kontrolný bod posunul, viď obrázok nižšie:

Myslím, že výsledok nevyzerá vôbec zle :

V skutočnej hre by to samozrejme chcelo viac variantov explózie. Takže by ste mohli prvý výsledok skopírovať a mierne upraviť parametre, aby nepriatelia nebouchali tak repetitívne.

Spustenie efektu

Upravíme metódu missileHit(), kde najskôr nastavíme name oboch objektov na nil a vytvoríme explózii. Tú nastavíme na bod kontaktu:

missile.name = nil
enemy.name = nil
if let explosion = SKEmitterNode(fileNamed: "Explosion") {
    explosion.position = point
    explosion.zPosition = 5
    addChild(explosion)
}

Mená nastavujeme na nil ako poistku, aby náhodou nedošlo k rozpoznaniu druhého kontaktu medzi objektmi, s ktorými ešte pracujeme.

Pre odobratie nepriateľa môžeme ešte vytvoriť krátku SKAction s animáciou, aby okamžite nezmizol:

let fadeOut = SKAction.fadeIn(withDuration: 0.2)
let sequence = SKAction.sequence([fadeOut, SKAction.removeFromParent()])
enemy.run(sequence)

Samozrejme nezabudnite odstrániť pôvodný volanie enemy.removeFromParent().

Možno si všimnete drobné chybičky a síce, že môžeme zneškodniť nepriateľa, ktorý má už pripravenú laserovú strelu. Potom to vyzerá, že sa objavila z prázdna. To vyriešime neskôr.

Efekt zásahu laserom

Zásah raketou máme, teraz je čas na zásah hráča. Na záver lekcie teda pripravíme ďalšie časticový efekt a vyriešime kolízii lasera a hráča. Neskôr hráči pridáme životy, teraz bude zatiaľ nesmrteľný.

Vytvorenie efektu

Laser by mal skôr spôsobiť menšie dym ako plnohodnotnú explózii. Pridáme si teda nový súbor s časticami a ako šablónu vyberieme Smoke. Birthrate som nastavil na 900 a Maximum na 10. Ďalej Lifetime Štart na 0.5 a Range na 0.1. Position Range 5 pre X a 10 pre Y. Ďalej Angle Štart na 90 ° a Range 180 °, takže dôjde k pokrytie smeru, odkiaľ bude hráč zasiahnutý laserom. Speed Štart nastavíme na 40 a Range na 0. A konečne Alpha Start 0.2 a Range 0.1.

A výsledok:

Ako vždy môžete experimentovať a vytvoriť si vlastný efekt alebo pokojne niekoľko a striedať je náhodne.

Opäť platí, že opakovanie je vidieť iba v náhľade.

Pridanie efektu

Pridanie efektu po zasiahnutí hráča je skoro rovnaké ako u rakiet a nepriateľov. Pripravíme si metódu pre reakciu na zasiahnutie hráča:

func laserHitPlayer(_ laser: SKNode, at point: CGPoint) {
}

Pre objekt hráčov máme referenciu priamo v GameScene, takže parameter nie je potreba. Teraz stačí v didBegin() detekovať kolízii lasera a hráča:

if nodeA.name == "laser" || nodeB.name == "laser" {
    if nodeA.name == "player" {
        laserHitPlayer(nodeB, at: contact.contactPoint)
    } else {
        laserHitPlayer(nodeA, at: contact.contactPoint)
    }
}

Na koniec predchádzajúcej podmienky pre rakety som pridal return, aby zbytočne metóda neskúšala vyhodnotiť druhú podmienku, keď sme kolízii už spracovali.

A nakoniec zostáva doplniť metódu laserHitPlayer(). Najskôr vymažeme meno a pridáme efekt dymu:

laser.name = nil
if let laserHit = SKEmitterNode(fileNamed: "LaserHit") {
    laserHit.position = point
    laserHit.zPosition = 5
    addChild(laserHit)
}

Efekt pohltenie strely lodí

Bolo by pekné nejako zapracovať s objektom laserové strely. Môžeme skúsiť vytvoriť efekt, že je celá strela vplyvom nárazu "pohltená" loď hráča. To znie celkom komplexne. Pomocou SKAction môžeme zmeniť škálu (rozmer) buď celkovo alebo na osi X či Y. Keď zmeníme škálu Y na 0, môžeme tým dosiahnuť efekt, kedy bude animácií laserová strela zmenšená, ako by reagovala na zásah. Lenže bude zmenšená do svojho stredu. Môžeme si ale pomôcť druhú SKAction, ktorá zmenšujúca sa strelu posunie po osi Y a tým navodí dojem, že sa zmenšuje presne v bode, kde trafila loď hráčov

Pretože je na strele už jedna aktívny SKAction pre jej pohyb, tak najskôr odstránime všetky akcie a potom pomocou guard přetypujeme objekt na SKSpriteNode. Budeme totiž potrebovať získať výšku:

laser.removeAllActions()
guard let laser = laser as? SKSpriteNode else { return }

Teraz už stačí "len" poskladať SKAction do sekvencie:

let shrink = SKAction.scaleY(to: 0, duration: 0.2)
let move = SKAction.moveBy(x: 0, y: -laser.size.height / 2, duration: 0.2)
let fadeOut = SKAction.fadeOut(withDuration: 0.1)
let group = SKAction.group([shrink, move])
let sequence = SKAction.sequence([group, fadeOut, SKAction.removeFromParent()])

laser.run(sequence)

Môžeme zakomentovat nastavenie timeru playerFireTimer a pozrieť sa, ako zásah laserom bude vyzerať:

Aktuálne hra vyzerá takto:

V budúcej lekcii, Pridanie Parallax efektu a životov hráča vo SpriteKit , už budeme dolaďovať drobnosti. Pridáme hráči životy a ukážeme si paralax efekt.

 

Mal si s čímkoľvek problém? Stiahni si vzorovú aplikáciu nižšie a porovnaj ju so svojím projektom, chybu tak ľahko nájdeš.