Heim > Web-Frontend > js-Tutorial > Schreiben eines Push-Box-Spiels mit JS und H5

Schreiben eines Push-Box-Spiels mit JS und H5

小云云
Freigeben: 2018-03-17 16:24:49
Original
2093 Leute haben es durchsucht


Das Push-Box-Spiel ist vor vielen Jahren ein beliebtes Spiel (viele Leute spielen es auch heute noch) Der Zweck des Spiels ist sehr einfach, das heißt, die Box zu schieben und alles zu schieben Wenn Sie das Ziel erreichen, ist das Spiel erfolgreich: Es scheint eine einfache Logik zu sein, aber es ist tatsächlich ziemlich schwierig, es zu vervollständigen. Jetzt werde ich vorstellen, wie man das Spiel schreibt unter Verwendung von js und html5 (der Einfachheit halber werden wir es durch einen rosa Kreis ersetzen):

1. Fähigkeitsanforderungen

JavaScript , HTML-Canvas, grundlegende objektorientierte Ideen, vernünftige Programmierlogik.

2. Schreibreihenfolge

1. pushBox.html-Datei

2.pojo.js-Datei (wird zum Speichern aller Objekte verwendet)

3.paint.js-Datei (wird zum Schreiben von Zeichnungen verwendet Anweisungen)

4.game.js-Datei (wird zum Schreiben des laufenden Logikteils verwendet)

5.allLevels.js-Datei (wird zum Speichern von Ebenen verwendet)

*Hinweis: Dies ist meine Schreibgewohnheit, unterteilt nach Inhalt und Funktion. Trennen Sie jede Kategorie . Wenn Sie eine bessere Möglichkeit haben, es zu schreiben, kommentieren Sie es bitte

3. Beginnen Sie mit dem Schreiben

1. Erstellen Sie eine einfache PushBox .html-Datei:

Der -Tag muss nur noch mit der ID versehen werden Der Logikteil ist abgeschlossen:

<body>
	<canvas id=&#39;can1&#39; width=1536 height=733></canvas>
	<audio id="walk" autoplay></audio>
	<audio id="push" autoplay></audio>
	<audio id="win" autoplay></audio>
</body>
Nach dem Login kopieren

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage