In dieser Tutorial-Serie erfahren Sie, wie Sie ein Retro-Rennspiel erstellen. Das Ziel des Spiels ist es, die Ziellinie zu erreichen, ohne ein Hindernis zu treffen. Weiter lesen!
Mit vorgenerierten Grafiken werden wir ein unterhaltsames Spiel mit Lua und den Corona SDK-APIs programmieren.
Der Spieler kann ein Rennauto steuern, um Hindernisse zu vermeiden. Sie können die Parameter im Code ändern, um das Spiel anzupassen.
Als erstes müssen wir die Plattform auswählen, auf der wir unsere App ausführen möchten. Auf diese Weise können wir die Größe der Bilder auswählen, die wir verwenden werden.
Die iOS-Plattform hat folgende Eigenschaften:
Da Android eine offene Plattform ist, gibt es viele verschiedene Geräte und Auflösungen. Einige der häufigsten Bildschirmmerkmale sind:
In diesem Tutorial konzentrieren wir uns auf die iOS-Plattform mit grafischem Design, die speziell für die Verteilung auf ein iPhone / iPod touch entwickelt wurde. Der hier vorgestellte Code sollte jedoch auch für die Android-Entwicklung mit Corona SDK gelten.
Es wird eine einfache und benutzerfreundliche Oberfläche verwendet, die mehrere Formen, Schaltflächen, Bitmaps und mehr umfasst.
Die für dieses Lernprogramm erforderlichen Schnittstellen-Grafikressourcen finden Sie im beigefügten Download.
Je nach ausgewähltem Gerät müssen Sie möglicherweise die Grafiken in der empfohlenen PPI-Datei exportieren. Sie können dies in Ihrem bevorzugten Bildeditor tun.
Ich habe die Größe anpassen… Funktion in der Vorschau-App unter Mac OS X.
Vergessen Sie nicht, den Bildern einen beschreibenden Namen zu geben und sie in Ihrem Projektordner zu speichern.
Eine externe Datei wird verwendet, um die Anwendung für den Vollbildschirm zwischen Geräten zu aktivieren config.lua Datei. Diese Datei zeigt die ursprüngliche Bildschirmgröße und die Methode zum Skalieren des Inhalts für den Fall, dass die App mit einer anderen Bildschirmauflösung ausgeführt wird.
application = content = width = 320, height = 480, scale = "letterbox",
Lassen Sie uns die Anwendung schreiben!
Öffnen Sie Ihren bevorzugten Lua-Editor (jeder Text-Editor wird funktionieren, aber Sie haben keine Syntax-Hervorhebung). Denken Sie daran, die Datei als zu speichern main.lua in Ihrem Projektordner.
Wir werden unseren Code so strukturieren, als wäre er eine Klasse. Wenn Sie ActionScript oder Java kennen, sollten Sie die Struktur kennen.
Notwendige Klassenvariablen und Konstanten Deklarieren von Funktionen Klassenmethoden der Klasse "Hauptfunktion" (andere Funktionen) rufen Hauptfunktion auf
display.setStatusBar (display.HiddenStatusBar)
Dieser Code verbirgt die Statusleiste. Die Statusleiste ist die Leiste oben auf dem Gerätebildschirm, auf der die Uhrzeit, das Signal und andere Anzeigen angezeigt werden.
Wir werden die Physik-Bibliothek verwenden, um Kollisionen zu behandeln. Verwenden Sie diesen Code zum Importieren:
lokale Physik = Physik.start () Physik.setGravity (0,0)
Eine einfache Grafik wird als Hintergrund für die Anwendungsschnittstelle verwendet. Die nächste Codezeile speichert es.
-- Grafik - [Hintergrund] local bg = display.newImage ('bg.png')
Dies ist die Titelansicht. Dies ist der erste interaktive Bildschirm, der in unserem Spiel erscheint. Diese Variablen speichern ihre Komponenten.
-- [Titelansicht] local titleBg local playBtn local creditsBtn local titleView
In dieser Ansicht werden die Credits und das Urheberrecht des Spiels angezeigt. Diese Variable wird zum Speichern verwendet.
-- [CreditsView] lokale CreditsView
Dieses Bild wird über unseren vorherigen Hintergrund platziert. Dies wird der Spielhintergrund sein.
-- Spielhintergrund lokales gameBg
Die Autografik. Dieser wird auf der Bühne unten in der Mitte platziert.
-- Auto lokales Auto
Die Autobahnlinien werden verwendet, um die sich bewegende Straße darzustellen.
-- Autobahnen Linien lokale Linien1 lokale Linien2
Sie müssen diese vermeiden, um das Level zu passieren.
-- Hindernisse lokale Hindernisse
Wird verwendet, um die aktuellen Spielinformationen wie Score, Level und Geschwindigkeit anzuzeigen.
-- TextFields Lokalgeschwindigkeit auf lokaler Ebene
Dies ist die Warnung, die angezeigt wird, wenn das Spiel beendet ist. Es wird das Level beenden und das Spiel beenden.
-- Warnung lokaler AlertView
Dies sind die Variablen, die wir verwenden werden. Lesen Sie die Kommentare im Code, um mehr darüber zu erfahren.
-- Variablen local lastY - Wird verwendet, um zwischen den Credits zu wechseln. Local moveTimer - Dieser Timer behandelt die Objekte, die lokal bewegt werden. LocalBtn local rightBtn local oTimer - Hinderniszeitgeber lokale PositionenTable = 36, 90, 144 --verfügbare x-Positionen für lokal gestartete Hindernisse --wahr, wenn das erste Hindernis erstellt wurde
Alle Funktionen als deklarieren lokal am Anfang.
-- Funktionen local Main = local startButtonListeners = local showCredits = local hideCredits = local showGameView = lokale gameListeners = local moveCar = local addObstacle = lokales Update = lokales onCollision = local alert =
Als Nächstes erstellen wir die Funktion, mit der die gesamte Spiellogik initialisiert wird:
Funktion Main () - Code… Ende
Jetzt platzieren wir das TitleView in der Bühne und rufen eine Funktion auf, die das hinzufügen wird Zapfhahn Zuhörer auf die Tasten.
function Main () titleBg = display.newImage ('titleBg.png', 70, 50) playBtn = display.newImage ('playBtn.png', 119, 222) creditsBtn = display.newImage ('creditsBtn.png', 85, 282) titleView = display.newGroup (titleBg, playBtn, creditsBtn) startButtonListeners ('add') end
In diesem Teil der Serie haben Sie die Benutzeroberfläche und die Grundeinstellungen des Spiels kennen gelernt. Im nächsten und letzten Teil der Serie werden die Stufenerstellung, die Kollisionserkennung und die abschließenden Schritte vor dem Release wie App-Tests, das Erstellen eines Startbildschirms, das Hinzufügen eines Symbols und das Erstellen der App ausgeführt!
Lesen Sie den zweiten Teil dieser Serie