Wie realistisch Motion Ihr HTML5 Spiel hinzufügen
Werfen Sie einen Blick auf space.html
. Dieses einfache Spiel ist ein gutes Beispiel für eine realistische Bewegung zu HTML5 Spiel anwenden. Es nutzt die Steuerungsschema, bekannt geworden in den Spiele-Klassiker Asteroids und Spacewar! (Obwohl Asteroids ist besser bekannt, Spacewar! weitaus früher und einflussreichen Spiel ist vorbei.)
Klicken Hier die volle Erfahrung zu bekommen.
Wie ein Kraftvektor zu Ihrem Spiel des Objekts hinzufügen
Das Schiff wird mit den Pfeiltasten gesteuert, aber Newtons Effekt ist leichter im Raum zu sehen als auf dem Boden (keine lästigen Widerstandskräfte in die Quere kommen). Die linke; und rechts; Pfeiltasten drehen Sie das Schiff, aber sie haben nicht die Schiffsbewegung beeinflussen. Der Pfeil nach oben feuert eine Rakete, die einen Kraftvektor in Richtung addiert wird das Schiff zur Zeit gegenüber.
Hier ist der Code:
Raum
Wie Raum in Ihrem Spiel zu simulieren
Hier ist der Überblick:
Beginnen Sie das Beispiel in der üblichen Weise.
Wie die meisten simpleGame Demos, beginnen mit einem Sprite und einer Szene. Da das Schiff eine eigene Methode haben wird, Sie machen es zu einem einzigartigen Objekt.
Geben Sie das Schiff ein checkKeys () -Methode.
Das checkKeys () Methode sieht für Tastendrücke und ändert die entsprechend Verhalten des Schiffes.
Ändern Sie den Bildwinkel.
Ein Sprite hat tatsächlich zwei verschiedene Winkel. Es kann einen Winkel haben, dass es zeigt (die so genannte imgAngle im simpleGame) Und der Winkel es bewegt (die so genannte moveAngle). Wenn Sie den Winkel ändern, ändern Sie auch sowohl die Bewegung und die Bildwinkel auf der Annahme, dass das Objekt einfach in Richtung reisen es gegenüber.
Für einfache Beispiele ist das in Ordnung, aber viele Arten von Bewegung erfordern, um die Bild- und Bewegungswinkel zu entkoppeln. Das changeImgAngleBy () Methode ermöglicht es Ihnen, das Bild, um die Richtung zu ändern, ohne Änderung der Bewegungswinkel zeigt. (Dort ist ein changeMotionAngle () Methode auch, aber es ist nicht sehr oft verwendet.)
Fügen Sie einen Kraftvektor Schub simulieren.
Wenn der Benutzer den Pfeil nach oben drückt, löst das Schiff seine Haupt Raketen. Dadurch wird eine kleine Kraftvektor in Richtung das Schiff derzeit konfrontiert ist. Verwenden Sie die getImgAngle () Methode, um die Richtung zu bestimmen, das Schiff derzeit konfrontiert ist, und diesen Wert verwenden, um festzulegen, wo die Kraft hinzugefügt werden soll.
Da dieser Code ist in der Animationsschleife geschieht und verstärkt wird, wie der Pfeil-Taste gedrückt gehalten wird, nur eine sehr geringe Kraft benötigt wird.