Share
Willkommen zu Teil zwei der Wie man mit dem Corona SDK alles aufbläst Tutorial-Serie. In diesem Lernprogramm werden wir unsere Demo-App aus Teil I verbessern, indem der Benutzer die Möglichkeit hat, eine Bombengrafik mit einer zeitverzögerten Explosion auf dem Bildschirm zu platzieren. Wir werden den Explosionseffekt auch so modifizieren, dass Kisten tatsächlich explodieren und nicht vom Bildschirm wegfliegen.
In Teil I dieser Serie haben wir ein Gefühl dafür bekommen, wie Sie mit Coronas einfach zu verwendender Physics-Bibliothek eine dynamische Umgebung einrichten können. Die Umgebung umfasste statische Objekte, wie z. B. den Boden, und programmgesteuert erzeugte dynamische Objekte wie Kisten. Ein Benutzer-Berührungsereignis würde dann eine Sprengkraft erzeugen, die die Kisten fliegen lassen würde. Wenn Sie Teil I noch nicht gelesen haben, schlage ich vor, dass Sie dies tun, bevor Sie fortfahren. Der Leser sollte etwas Verständnis für die in Teil I erläuterten grundlegenden Konzepte der Physik haben, um Teil II verstehen zu können.
Beginnen wir mit einer kleinen Auffrischung, wie wir unsere physische Umgebung in Teil I einrichten.
Accentsconagua
local physics = erfordern ("physics") physics.start () physics.setScale (40) display.setStatusBar (display.HiddenStatusBar) - Der letzte Parameter "true" überschreibt Coronas automatische Skalierung großer Bilder. local background = display.newImage ("bricks.png", 0, 0, true) background.x = display.contentWidth / 2 background.y = display.contentHeight / 2 local floor = display.newImage ("floor.png", 0, 280, true) physics.addBody (Boden, "statisch", Reibung = 0,5) lokale Kisten = für i = 1, 5 tun für j = 1, 5 do Kisten [i] = display.newImage ("crate.png", 140 + (i * 50), 220 - (j * 50)) physics.addBody (Kisten [i], Dichte = 0,2, Reibung = 0,1, Sprungkraft = 0,5) Ende 
Alle Funktionen des obigen Codes werden in Teil I des Tutorials ausführlich erläutert. Prüfen Sie daher, ob etwas verwirrend erscheint.
Als ersten Schritt fügen wir unserer setBomb-Methode ein kleines grafisches Update hinzu. Anstelle eines Berührungsereignisses, das sofort die Explosion erzeugt, platzieren wir eine Bombe als eigenes Physikobjekt auf dem Bildschirm:
lokale Funktion setBomb (event) if (event.phase == "begann") dann local bomb = display.newImage ("bomb.png", event.x, event.y) physics.addBody (Bombe, density = 0.2, Reibung = 0,1, Bounce = 0,5) Ende Ende Hintergrund: addEventListener ("touch", setBomb) 
Wie zuvor fügen wir dem Hintergrund einen Ereignis-Listener hinzu, um auf Berührungsereignisse zu achten und die setBomb-Methode auszulösen, wenn eines auftritt. Innerhalb der Methode isolieren wir alle Aktivitäten für die Phase "Beginn" der Veranstaltung. Wenn wir diese Phase nicht isolieren, führt dies dazu, dass der Code mehrmals ausgeführt wird, da Berührungsereignisse viele Phasen haben.
Die setBomb-Methode, so wie sie jetzt steht, tut sehr wenig. Es lädt eine gut aussehende Bombengrafik und fügt sie dem Bildschirm als dynamisches Physikobjekt hinzu. Jetzt integrieren wir unsere Explosionsmethode wieder als lokale Funktion namens Blast in den Code:
local circle = "" lokale explosion = "" local function blast (event) circle = display.newCircle (Bombe.x, Bombe.y, 80) explosion = display.newImage ("explosion.png", Bombe.x, Bombe). y) circle: setFillColor (0,0,0, 0) physics.addBody (circle, "static", isSensor = true) circle.myName = "circle" circle.collision = onLocalCollision circle: addEventListener ("collision", Kreis) Endschlag () Das Kreisobjekt hier hilft uns, unseren Sprengungsradius zu berechnen. Wir fügen einen Kollisionsereignislistener hinzu, um zu ermitteln, welche der Kisten in die Explosionszone fällt. Zusätzlich fügen wir dem Bildschirm eine Explosionsgrafik an derselben Position wie die Bombengrafik hinzu, sobald die Explosion losgeht.
Wenn Sie den Code an dieser Stelle ausprobieren, werden Sie feststellen, dass alles sehr schnell geschieht und einige Artefaktgrafiken zurückbleiben. Um es spannender zu machen, ersetzen wir unseren Aufruf "blast ()" durch einen Timer, der die Explosion der Bombe um 3 Sekunden verzögert:
timer.performWithDelay (3000, Blast)
So einfach ist das! Die Timerklasse verfügt über eine Funktion namens performWithDelay () mit zwei Parametern: Die Anzahl der zu wartenden Millisekunden und die aufzurufende Methode. In diesem Fall entsprechen die 3.000 Millisekunden 3 Sekunden Verzögerung.
Da die Bombe nach einer Verzögerung von 3 Sekunden explodiert, müssen wir dieses Objekt vom Bildschirm entfernen, sobald die Explosion erfolgt. Dies ist sehr einfach möglich. Alle Objekte auf dem Bildschirm verfügen über eine praktische Funktion removeSelf (). Sobald sich ein Objekt vom Bildschirm entfernt, ist die Physik-Engine intelligent genug, um Müll zu sammeln und aus allen physikalischen Berechnungen zu entfernen. Wir können die folgende Zeile am Ende der Blast-Funktion hinzufügen:
Bombe: removeSelf ()
Zusätzlich zum Entfernen der Bombe werden wir unser Objekt "Kreisstrahlradius" sowie die Explosionsgrafik entfernen, die wir für den Effekt hinzugefügt haben. Da wir unserem Blastradiuskreis etwas Zeit geben müssen, um Kollisionen mit unseren Kisten zu erzeugen, werden wir ihn 1/10 einer Sekunde entfernen, nachdem wir die Blast-Funktion aufgerufen haben. Dies können Sie erreichen, indem Sie unseren zeitgesteuerten Blast-Funktionsaufruf durch folgenden Code ersetzen:
Lokale Funktion removeStuff (event) circle: removeSelf () explosion: removeSelf () end timer.performWithDelay (3000, Blast) timer.performWithDelay (3100, removeStuff)
Wie Sie sehen, rufen wir die Blast-Funktion nach einer Verzögerung von 3 Sekunden auf, wenn Sie den Bildschirm genauso berühren wie zuvor. Wir haben jetzt einen weiteren verzögerten Anruf hinzugefügt, der 3,1 Sekunden nach dem Berühren des Bildschirms ausgeführt wird, der die verbleibenden Objekte mit der Funktion removeSelf () bereinigt.
Die gesamte Funktion, die wir erstellt haben, sieht jetzt so aus:
lokale Funktion setBomb (event) if (event.phase == "begann") dann local bomb = display.newImage ("bomb.png", event.x, event.y) physics.addBody (Bombe, density = 0.2, Reibung = 0,1, Sprungkraft = 0,5) Lokaler Kreis = "" Lokale Explosion = "" Lokale Funktion Explosion (Ereignis) media.playEventSound (ExplosionSound) Kreis = Display.NewCircle (Bombe.x, Bombe.y, 80) Explosion = Anzeige .newImage ("explosion.png", Bombe.x, Bombe.y) Bombe: removeSelf () Kreis: setFillColor (0,0,0, 0) physics.addBody (Kreis, "statisch", isSensor = true) circle.myName = "circle" circle.collision = onLocalCollision circle: addEventListener ("collision", circle) Ende der lokalen Funktion removeStuff (event) circle: removeSelf () explosion: removeSelf () Ende timer.performWithDelay (3). performWithDelay (3100, removeStuff) end end background: addEventListener ("touch", setBomb) In Teil I unseres Tutorials sah unsere Kollisionserkennungsfunktion folgendermaßen aus:
lokale Funktion onLocalCollision (self, event) wenn (event.phase == "begin" und self.myName == "circle"), dann local forcex = event.other.x-self.x local forcey = event.other.y- selbst.y wenn (forcex < 0) then forcex = 0-(80 + forcex)-12 else forcex = 80 - forcex+12 end event.other:applyForce( forcex, forcey, self.x, self.y ) end end
Es hat einfach alle Kisten in unserem Explosionsradius gefunden und mit einer Kraft aus dem Epizentrum der Explosion gesprengt. Um die Dinge interessanter zu gestalten, fügen wir den Kisten eine Zerstörungsschwelle hinzu, die sie zum Explodieren bringt, wenn die auf sie ausgeübte Kraft hoch genug ist. Es kann so gemacht werden:
Wenn (math.abs (forcex)> 60 oder math.abs (forcey)> 60), dann ist local explosion = display.newImage ("explosion.png", event.other.x, event.other.y) event.other: removeSelf () lokale Funktion removeExplosion (Ereignis) explosion: removeSelf () end timer.performWithDelay (100, removeExplosion) end Wir müssen die Kraft, die wir auf jede der Kisten ausgeübt haben, beobachten, um festzustellen, ob sie in diesem Fall in einer willkürlichen Zahl höher als 60 ist. Wir verwenden die math.abs-Funktion, um den absoluten Wert der Kraft zu ermitteln. In unserem Beispiel können Kräfte abhängig von der Richtung der aufgebrachten Kraft positiv oder negativ sein. Wir machen uns in diesem Fall keine Sorgen um die Richtung, wir möchten nur wissen, ob die Kraft die Schwelle von 60 überschreitet. Fühlen Sie sich frei, mit dieser Schwellenzahl zu spielen, um zu ändern, wie schwach oder stark die Kisten sind.
In Teil I wurde unsere Explosionskraft so berechnet, dass sie um so geringer wird, je weiter eine Kiste vom Epizentrum der Explosion entfernt ist. Kisten, die näher am Epizentrum liegen, haben eine höhere Wahrscheinlichkeit, zerstört zu werden, und die anderen werden einfach vom Bildschirm wegfliegen. Wie zuvor bei unserer Timer-Klasse zeigen wir eine Explosionsgrafik in der früheren Position einer zerstörten Kiste an und entfernen sie dann 1/10 einer Sekunde später vom Bildschirm. Die endgültige Kollisionserkennungsmethode sieht folgendermaßen aus:
lokale Funktion onLocalCollision (self, event) wenn (event.phase == "begin" und self.myName == "circle"), dann local forcex = event.other.x-self.x local forcey = event.other.y- selbst.y wenn (forcex < 0) then forcex = 0-(80 + forcex)-12 else forcex = 80 - forcex+12 end event.other:applyForce( forcex, forcey, self.x, self.y ) if(math.abs(forcex) > 60 oder math.abs (forcey)> 60) dann local explosion = display.newImage ("explosion.png", event.other.x, event.other.y) event.other: removeSelf () lokale Funktion removeExplosion (event) explosion: removeSelf () end timer.performWithDelay (50, removeExplosion) Ende Ende 
Als letzten Schritt in unserem Tutorial werden wir einen Explosionseffekt abspielen, wenn unsere Bombe explodiert. Wie alles andere in Corona ist dies überraschend einfach. Wir fangen damit an, die Medienbibliothek ganz oben in unser Projekt aufzunehmen und unsere Sounddatei vorab zu laden:
lokale Medien = erfordern ("Medien") lokale explosionSound = media.newEventSound ("explosion.mp3") Um den Sound abzuspielen, fügen wir unserer blast () - Funktion in unserer setBomb () - Funktion die folgende Zeile hinzu:
lokale Funktion blast (Ereignis) media.playEventSound (explosionSound)? Ende
Wenn nun die Funktion blast () aufgerufen wird, wird die Funktion playEventSound aus der Medienbibliothek verwendet, um die Sounddatei "explosion.mp3" abzuspielen. Es könnte nicht einfacher sein, wenn wir es versuchen würden!
Und da haben wir es! Wir haben jetzt ein umfassenderes Beispiel dafür, wie einfach es ist, Explosionen in der Corona-Plattform zu erstellen. Fühlen Sie sich frei, die Reißverschlüsse für Teil I und II des Tutorials herunterzuladen und herumzuspielen!
