Share
Dies ist die zweite Ausgabe in unserem Corona SDK Retro Racing-Lernprogramm. Im heutigen Tutorial ergänzen wir unsere Benutzeroberfläche und die Spielinteraktion. Weiter lesen!
Bitte lesen Sie Teil 1 der Serie, um dieses Tutorial vollständig zu verstehen und vorzubereiten.
Diese Funktion fügt die erforderlichen Hörer dem hinzu TitleView Tasten.
Accentsconagua
Funktion startButtonListeners (action) if (action == 'add') dann playBtn: addEventListener ('tap', showGameView) creditsBtn: addEventListener ('tap', showCredits) else playBtn: removeEventListener ('tap', showGameView) creditsBtn: removeEventListener 'tap', showCredits) end end Der Bildschirm "Credits" wird angezeigt, wenn der Benutzer die Schaltfläche "About" antippt. EIN Zapfhahn Listener wird der Credits-Ansicht hinzugefügt, um sie zu entfernen.
Funktion showCredits: tap (e) playBtn.isVisible = false creditsBtn.isVisible = false creditsView = display.newImage ('credits.png', 0, display.contentHeight) lastY = titleBg.y Übergang.to (titleBg, time = 300) , y = (display.contentHeight * 0.5) - (titleBg.height + 50)) Übergang.nach (creditsView, time = 300, y = (display.contentHeight * 0.5) + 35, onComplete = function () creditsView: addEventListener ('tap', hideCredits) end) end Wenn der Credits-Bildschirm getippt wird, wird er von der Bühne getweent und entfernt.
function hideCredits: tap (e) transition.to (creditsView, time = 300, y = display.contentHeight + 25), onComplete = function () creditsBtn.isVisible = true playBtn.isVisible = true creditsView: removeEventListener ('tap', hideCredits) ) display.remove (creditsView) creditsView = nil end) transition.to (titleBg, time = 300, y = lastY); Ende Wenn der Start Wenn Sie auf die Schaltfläche tippen, wird die Titelansicht getweent und entfernt, um die Spielansicht anzuzeigen. Diese Ansicht hat viele Aspekte, daher teilen wir sie in den nächsten Schritten auf.
Funktion showGameView: tap (e) transition.to (titleView, time = 300, x = -titleView.height, onComplete = function () startButtonListeners ('rmv') display.remove (titleView) titleView = nil end) Dieser Code platziert das Hintergrundbild des Spiels in der Bühne.
-- Spielhintergrund display.remove (bg) gameBg = display.newImage ('gameBg.png') Als Nächstes fügen wir das Fahrzeugbild hinzu und platzieren es in der Mitte der Bühne.
-- Car car = display.newImage ('car.png', 90, 412) Dieser Teil erstellt die Autobahnlinien. Dieses Bild wird zweimal hinzugefügt, um eine Schleife zu erstellen. Einer ist auf dem Bildschirm sichtbar, während der andere im oberen Teil der Bühne wartet.
-- Highway lines1 = display.newImage ('lines.png', 0, -18) lines2 = display.newImage ('lines.png', 0, -558) lines1: setReferencePoint (display.TopLeftReferencePoint) lines2: setReferencePoint (display.TopLeftReferencePoint) ) hindernisse = display.newGroup () Jetzt platzieren wir drei Textfelder, um Score, Level und Speed anzuzeigen.
-- TextFields score = display.newText ('0', 272, 38, native.systemFont, 17) score: setTextColor (0) level = display.newText ('1', 272, 108, native.systemFont, 17) level: setTextColor (0) speed = display.newText ('1', 272, 178, native.systemFont, 17) Geschwindigkeit: setTextColor (0) Zwei Tasten werden hinzugefügt, um als Steuerelemente für das Auto zu dienen: links und rechts.
-- Richtungstasten leftBtn = display.newImage ('button.png', -2, 420) leftBtn.name = 'l' rightBtn = display.newImage ('button.png', 260, 420) rightBtn.name = 'r' Jetzt fügen wir das Auto zur Physik-Engine hinzu, auf diese Weise können wir Kollisionen melden.
-- Physik physics.addKörper (Auto, 'dynamisches') SpielListeners ('Hinzufügen') Diese Funktion fügt die erforderlichen Listener hinzu, um die Spielelogik zu starten.
Dies ist ein wichtiger Teil, wenn Sie versuchen, das Spiel anzupassen. Das moveTimer steuert die Geschwindigkeit des Spiels. Standardmäßig sind es 100 Millisekunden für Ebene 1, Ebene 2 kann also 200 sein und so weiter.
Die Dauer des Spiels hängt von der Anzahl der Hindernisse ab, die im Level dargestellt werden. Dies ist definiert durch die oTimer. Modifiziere den fünfzehn Wert, um kürzere oder größere Ebenen zu erstellen.
Funktion gameListeners (action) if (action == 'add') dann leftBtn: addEventListener ('tap', moveCar) rightBtn: addEventListener ('tap', moveCar) moveTimer = timer.performWithDelay (100, Update, 0) - Ebene speed oTimer = timer.performWithDelay (1400, addObstacle, 15) - Autolaufzeit auto: addEventListener ('collision', onCollision), sonst leftBtn: removeEventListener ('tap', moveCar) rightBtn: removeEventListener ('tap', moveCar). cancel (moveTimer) moveTimer = nil timer.cancel (oTimer) oTimer = nil car: removeEventListener ('collision', onCollision) Ende Diese Funktion steuert das Auto. Es testet den gedrückten Knopf und fährt das Auto in die gewählte Position, falls verfügbar.
Funktion moveCar (e) wenn (e.target.name == 'l' und car.x ~ = 62), dann car.x = car.x - 54 elseif (e.target.name == 'r' und car. x ~ = 170) dann car.x = car.x + 54 end end
Hindernisse werden durch einen Timer hinzugefügt, der auf einer zufällig berechneten Position basiert, die links, in der Mitte oder rechts sein kann. Diese Funktion erzeugt ein Hindernis, gibt ihr Physik und wird dann zu einem hinzugefügt Gruppe um seine Bewegung und Entfernung zu erleichtern.
Funktion addObstacle (e) local rx = positionsTabelle [math.floor (math.random () * 3) + 1] local o = display.newImage ('obstacle.png', rx, -52) physics.addBody (o, ' static ') o.isSensor = wahre Hindernisse: Einfügen (o) gestartet = wahres Ende Die Aktualisierungsfunktion wird von einem Timer ausgeführt, um den Stein für Stein-Effekt zu erzeugen. Der nächste Code schleift die Autobahnlinien.
Funktionsaktualisierung (e) - Autobahnlinien1.y = Linien1.y + 16 Zeilen2.y = Linien2.y + 16 verschieben - Autobahnposition zurücksetzen, wenn (Linien1.y> = 522) dann Linien1.y = -558 elseif ( lines2.y> = 522) dann lines2.y = -558 enden
Diese Linien bewegen die Hindernisse und entfernen die nicht mehr sichtbaren. Die Punktzahl erhöht sich jedes Mal, wenn das Auto kein Hindernis trifft.
für i = 1, hindacles.numChildren do - Bewegt Hindernisse, wenn (Hindernisse [i] ~ = null), dann Hindernisse [i] .y = Hindernisse [i] .y + 16 Ende - Entfernen Sie Hindernisse außerhalb der Bühne, wenn (Hindernisse [i ] ~ = nil und Hindernisse [i] .y> = display.contentHeight + 26) dann display.remove (Hindernisse [i]) score.text = tostring (tonumber (score.text) + 50) end end
Hier überprüfen wir, ob alle definierten Hindernisse bereits außerhalb der Bühne liegen, und rufen ein Sieg Alarm wenn wahr.
-- Überprüfen Sie, ob der Level vollständig ist, wenn (gestartet und obstacles.numChildren == 0) und dann alert () beendet wird
Die Kollisionsfunktion prüft, ob das Auto von einem Hindernis getroffen wird, und ruft a an verlieren Alarm wenn wahr.
function onCollision (e) alert ('lose') Ende Funktionswarnung (msg) gameListeners ('rmv') if (msg == 'lose') dann alert = display.newImage ('alert.png', 52, 229.5), sonst alert = display.newImage ('complete.png', 18, 229.5) Ende Übergang.von (Warnung, time = 300, xScale = 0,5, yScale = 0,5) physics.stop () Ende Um das Spiel zu starten, muss die Main Funktion muss aufgerufen werden. Mit dem obigen Code machen wir das hier:
Main()
Die Default.png-Datei ist ein Bild, das gleich beim Start der Anwendung angezeigt wird, während iOS die Grunddaten lädt, um den Hauptbildschirm anzuzeigen. Fügen Sie dieses Bild Ihrem Projektquellordner hinzu.
Mit den zuvor erstellten Grafiken können Sie nun ein schönes und gut aussehendes Symbol erstellen. Die Symbolgröße für
Das Nicht-Retina-iPhone-Symbol ist 57x57px, aber die Retina-Version ist 114x114px, und der iTunes Store erfordert eine 512x512px-Version. Ich schlage vor, zuerst die 512x512-Version zu erstellen und dann für die anderen Größen zu skalieren.
Es muss nicht die abgerundeten Ecken oder die transparente Blendung haben, iTunes und das iPhone erledigen das für Sie.
Es ist Zeit für den letzten Test. Öffnen Sie den Corona Simulator, navigieren Sie zu Ihrem Projektordner und klicken Sie auf Öffnen. Wenn alles wie erwartet funktioniert, sind Sie bereit für den letzten Schritt!
Im Corona Simulator gehe zu Datei> Erstellen und wählen Sie Ihr Zielgerät. Füllen Sie die erforderlichen Daten aus und klicken Sie auf bauen. Warten Sie einige Sekunden, bis Ihre App für den Gerätetest und / oder die Übermittlung zur Verteilung bereit ist!
Experimentieren Sie mit dem Endergebnis und versuchen Sie, Ihre benutzerdefinierte Version des Spiels zu erstellen!
Ich hoffe, dass Ihnen diese Tutorial-Serie gefallen hat und sie hilfreich war. Danke fürs Lesen!
