Share
Willkommen zu einer neuen Serie von Tutorials, in denen ich Ihnen in Construct 2 zeigen werde, wie Sie ein Match-3-Puzzlespiel von Grund auf neu erstellen. In diesem ersten Teil werden wir die Grundlagen für das Spiel legen und das grundlegende Puzzle-Raster erhalten auf dem Bildschirm.
Ein Match-3-Spiel ist ein Blockpuzzle, in dem Sie Blöcke im Spielbereich bewegen, um Gruppen von drei oder mehr zu erstellen, die ein gemeinsames Attribut (z. B. eine Farbe oder eine Form) gemeinsam haben. In den meisten 3-Gewinnt-Spielen erhält der Spieler auch Boni für das Übereinstimmen von mehr als drei Blöcken gleichzeitig.
Die meisten Match-3-Puzzlespiele sind von Natur aus wettbewerbsfähig, und das Ziel des Spielers besteht in der Regel darin, die höchste Punktzahl zu erreichen, bevor seine Zeit abläuft, oder eine andere Verlustbedingung ist erfüllt. Einige Beispiele für Match-3-Spiele sind Pokemon Puzzle League, Bejeweled und der jüngste Hit Candy Crush Saga.
Ich habe mich entschieden, das Match-3-Spiel, das wir machen werden, auf Pokemon Puzzle League zu stützen:
Wenn Sie es noch nie gespielt haben, ist PPL ein recht einfaches Match-3-Spiel, bei dem Blöcke vom unteren Rand des Spielbildschirms aufsteigen und der Spieler ein Spiel erstellen muss, damit der Spielbildschirm nicht voll wird. Wenn die Blöcke die Spitze erreichen, verliert der Spieler und muss erneut von vorne beginnen.
Hier ist eine Demo des Spiels, auf das wir während der gesamten Serie hinarbeiten werden:
In diesem ersten Artikel werden wir uns auf die Grundlagen für unser Spiel konzentrieren. Dieser Artikel konzentriert sich speziell auf das Einrichten des Projekts und das Aufblättern eines Zufallsrasters für den Player.
Bevor Sie mit diesem Lernprogramm beginnen, sollten Sie die neueste Version von Construct 2 (C2) installieren. Als ich die ursprüngliche Version des Spiels erstellt hatte, war Release 122 verwendet worden. Solange Sie eine neuere Version als diese haben, sollte es Ihnen gut gehen. Wenn Sie C2 noch nie zuvor verwendet haben, sollten Sie diese Anleitung lesen, in der die Grundlagen der Verwendung von C2 und die meisten Objekttypen beschrieben werden.
Sie sollten auch das Grafikpaket herunterladen, das ich für dieses Lernprogramm erstellt habe. Natürlich können Sie beliebige Grafiken verwenden, aber ich werde für viele Elemente in diesen Lernprogrammen eine spezifische Positionierung vornehmen. Diese Positionen basieren auf den von mir verwendeten Bildern. Wenn Sie andere Grafiken verwenden, müssen Sie die Größenunterschiede in diesen Grafiken berücksichtigen, wenn Sie diese Lernprogramme ausführen.
Wenn Sie alles eingerichtet haben und ein gutes Verständnis von C2 haben, lesen Sie weiter!
Bevor wir das gesamte Gameplay tatsächlich erstellen, müssen wir das Projekt selbst einrichten. Laden Sie C2 und führen Sie die folgenden Schritte aus:
Accentsconagua
600 x 600.Hintergrund, die mittlere Schicht bis Blöcke, und die oberste Schicht zu Spielfeld. GameBG. Hintergrund.650, 650. 
GameFieldBorder.9, -12.16, 732.Spielfeld.GameFieldBorder Objekt. 368, -12 .
GameFieldBottom.197, 625.344, 150.Spielfeld.GameFieldBottom Objekt. 196, -30.180.
Als letztes müssen wir einen Hintergrund für den tatsächlichen Bereich erstellen, in dem die Blöcke erscheinen.
0, und das Alpha zu 200.359, 570.195,294.Hintergrund
Das Spielfeld ist nun abgeschlossen, aber wir müssen noch ein Sprite erstellen, das für die Blöcke verwendet werden kann.
Bevor wir weitergehen, möchte ich die Blockbilder erklären. Der graue Block repräsentiert einen "inaktiven" Block, der in einem nächsten Tutorial implementiert wird. Die verbleibenden Bilder werden für jeden Block in Dreiergruppen gruppiert: Der erste Frame ist für den Fall, dass der Block nicht verwendet wird, der zweite für den Fall, dass der Spieler den Block bearbeitet, und der dritte für den Block, wenn der Block zu einem Block passt Gruppe.
Nehmen Sie schließlich den Block, den wir erstellt haben, und platzieren Sie ihn irgendwo im Layout, damit der Spieler ihn während eines Spiels nicht sehen kann. Stellen Sie außerdem die Größe des Blocks auf 40, 40.
Wir haben jetzt alle Bilder, die wir für diesen Artikel benötigen, mitgebracht und können das Spiel wirklich funktionieren lassen.
In der endgültigen Version des Spiels bewegen sich die Blöcke ständig nach oben, und neue Blöcke werden von unten auf den Bildschirm gedrückt. Für den Moment müssen wir jedoch die grundlegenden Mechaniken zum Laufen bringen, also werden wir nur ein 8x8-Raster von Blöcken erzeugen und dabei belassen.
Gehe zu Veranstaltungsblatt 1 Fügen Sie diese globalen Variablen hinzu, um die anfängliche Laichposition der Blöcke zu definieren:
Globale Variable: SPAWNX-Wert = 49 Konstante = True Globale Variable: SPAWNY-Wert = 526 Konstante = True
Wir müssen noch etwas anderes tun, bevor wir das erste Ereignis durchführen: Wir müssen eine Instanzvariable für den Block erstellen, die dem Block die Farbe angibt.
Erstellen Sie eine neue Instanzvariable für das Blockobjekt, und nennen Sie sie Farbe und ändern Sie keine anderen Einstellungen.
Jetzt machen wir unsere erste Veranstaltung. Das Ziel dieses Ereignisses ist es, zu Testzwecken ein statisches Blockraster zu erstellen:
Ereignis: Bedingung: System> Beim Start des Layouts Bedingung: System> Für Name: "Y" Startindex = 0 Ende Index = 7 Unterereignis: System> Für Name: "X" Startindex = 0 Ende Index = 7 Aktion: System> Objekt erstellen Objekt: Block X = (SPAWNX + (loopIndex ("X")) * (Block.Width + 2)) Y = (SPAWNY - (LoopIndex ("Y")) * (Block.Width + 2) ) Beide Formeln sagen grundsätzlich dasselbe aus. Zuerst addieren wir die Blockbreite um 2, sodass jeder Block einen 2px-Puffer zwischen sich und seinen Nachbarn hat, um falsche Kollisionen bei der Kollisionserkennung zu verhindern. Dann multiplizieren wir diese Zahl mit dem aktuellen Index in der for-Schleife und addieren sie zur Startposition von X oder Y. Außerdem subtrahieren wir den Y-Wert, da sich in C2 der 0-Punkt auf der Y-Achse oben auf dem Spielbildschirm befindet. Wenn Sie den Wert der Y-Position verringern, setzen wir ein Objekt näher an den oberen Rand des Bildschirms.
Was leistet das also? Dies bedeutet, dass, wenn die X- und Y-Schleifen iterieren und die Werte von X und Y zunehmen, sich die Position, in die jeder Block eingefügt wird, ändert, was schließlich zu einem quadratischen Gitter führt:
Wenn Sie das Spiel zu diesem Zeitpunkt ausführen, haben Sie ein Raster aus Blöcken - aber anstatt verschiedene Farben zu haben, werden alle Blöcke einfach nacheinander durchlaufen.
Um dies zu beheben, müssen wir zwei Dinge tun.
Zunächst müssen wir jedem Block einen Farbwert zuweisen, indem wir die zuvor erstellte Instanzvariable verwenden. Fügen Sie dazu eine weitere Aktion hinzu:
Aktion: Blockieren> Wert setzen Farbe = Boden (zufällig (1,7))
Dadurch wird dem Block ein zufälliger Farbwert von 1 bis 6 zugewiesen. (Der Grund dafür ist nicht von 1 bis 7, wird in der Erklärung des erläutert Zufällig Funktion.)
Ihre Funktion sollte jetzt so aussehen:
Wir müssen auch ein System hinzufügen, das das Image eines Blocks basierend auf seinem Wert ändert. Fügen Sie dazu dem Block-Objekt eine neue Instanzvariable hinzu:
Instanzvariable für Blockname: "IsMatched" Typ: Boolean-Initialwert = false
Fügen Sie nun ein neues Ereignis hinzu:
Ereignis: System> Aktion für alle Häkchen: Blockieren> Rahmenwert festlegen = (Block.Farbe-1) * 3 + 1
Diese Formel subtrahiert zuerst 1 vom Farbwert des Blocks, um der Tatsache Rechnung zu tragen, dass die Werte bei 1 und nicht bei 0 beginnen. Dann multipliziert sie diese Zahl mit 3, um die Tatsache zu berücksichtigen, dass jeder Block 3 Animationsrahmen hat. Schließlich addiert er diesen Wert um 1, da das Standardbild eines Blocks das erste Bild in der Bildgruppe ist.
Sehen wir uns ein schnelles Beispiel mit einem Block mit dem Farbwert 4 an, um zu sehen, welchen Animationsrahmen es verwenden wird. Zuerst wird 1 von dem Farbwert subtrahiert, um 3 zu erhalten. Als Nächstes wird diese Zahl mit 3 multipliziert, um 9 zu erhalten. Schließlich wird 1 zu diesem Wert hinzugefügt, um 10 zu erhalten. Dies bedeutet, dass ein Block mit einem Farbwert von 4 den Rahmen 10 als verwendet Der Standard-Animationsrahmen ist ein violetter / quadratischer Block.
Wenn Sie Ihr Spiel jetzt ausführen, werden Sie feststellen, dass jeder Block eine andere Farbe hat. Wir haben jedoch noch keine Animationen implementiert, wenn sich der Mauszeiger über dem Block befindet oder wenn er abgeglichen wird. Dies wird im nächsten Tutorial behandelt und erläutert, wie zwei benachbarte Blöcke ausgetauscht werden.
Hier ist eine kleine Demo, wie das Spiel an dieser Stelle aussehen sollte (hier die Quelle):
Klicken Sie hier, um die Demo zu laden. Wenn Sie selbstständig weiterarbeiten möchten, sollten Sie den Animationsrahmen des Blocks basierend auf dem Ereignis "Maus> Cursor ist über Objekt" ändern. Sie können sich auch mit dem "Drag & Drop" -Verhalten beschäftigen, um den Block zu manipulieren, und darüber nachdenken, was der Spieler mit dem Block zu tun versucht, wenn er mit dem Ziehen beginnt oder wenn er ihn ablegt.
Vielen Dank, dass Sie diesen Teil des Tutorials gelesen haben, in dem wir die Grundlagen für unser Match-3-Spiel gelegt haben. Kommen Sie bald wieder für den nächsten Teil der Serie! Sie können sich per Facebook, Twitter, Google+, RSS oder E-Mail auf dem Laufenden halten.
