Ein echtes Spielerlebnis mit der Gamepad -API

Key Takeaways

• Die Gamepad-API, ein vorgeschlagener Standard des W3C, bietet eine konsistente API über Browser für die Verbindung von Gaming-Eingabegeräten wie ein Xbox-Controller an einen Computer für browserbasierte Erlebnisse.
• Die Gamepad -API bietet Flexibilität und bietet Zugriff auf Schaltflächen und Achsen mit normalisierten Werten, und das Gamepad -Objekt bietet detaillierte Informationen zum Hersteller und Modell des verbundenen Gamepads.
• Das PXGamePad ist eine Helferklasse, die eine höhere Darstellung eines Standard -Gamepad wie den Xbox One -Controller bietet, der die Taste und die Achsenindizes zu vertrauten Namen zuordnen, wie sie auf dem Xbox -Controller gekennzeichnet sind.
• Während die Gamepad-API in der Lage ist, mehrere Spieler mit eigenen Gamepads zu unterstützen .

Dieser Artikel ist Teil einer Web -Dev -Serie von Microsoft. Vielen Dank, dass Sie die Partner unterstützt haben, die SitePoint ermöglichen.

Gaming im Web hat mit HTML5 -Technologien wie Leinwand, WebGL und Webaudio einen langen Weg zurückgelegt. Es ist jetzt möglich, Grafiken und Sound im Browser mit hoher Fidelity zu erstellen. Um jedoch ein echtes Spielerlebnis zu bieten, benötigen Sie Eingabereiche für Spiele. Die Gamepad -API ist ein vorgeschlagener Standard des W3C und soll eine konsistente API über Browser hinweg liefern.

Mit der Gamepad-API können Benutzer Geräte wie einen Xbox-Controller an einen Computer anschließen und für Browser-basierte Erlebnisse verwenden! Wenn Sie ein Gamepad haben, stecken Sie ihn in Ihren Computer an und drücken Sie dann eine Taste. Sie sehen den Xbox -Controller unten auf, um jede Bewegung, die Sie durchführen, zu spiegeln!

probieren Sie es hier interaktiv aus.

Dieses Tutorial ist das dritte in einer Serie auf Flight Arcade, die demonstrieren, was auf der Webplattform möglich ist, und im neuen Microsoft Edge -Browser und im Renderning Engine von EdgeHtml. Die ersten beiden Artikel über WebGL- und Web -API sowie interaktive Code sowie Beispiele für diesen Artikel finden Sie unter flugarcade.com.

[YouTube XYAQ9TPMXRA]

flexible API

Die Gamepad -API ist intelligent unter Berücksichtigung von Flexibilität ausgestattet. Auf einer grundlegenden Ebene bietet es Zugriff auf Tasten und Achsen. Die Schaltflächenwerte reichen von [0 .. 1], während die Achsen von [-1 .. 1] reichen. Alle Werte werden auf diese Bereiche normalisiert, sodass Entwickler ein konstantes Verhalten zwischen Geräten erwarten können.

Das GamePad -Objekt enthält detaillierte Informationen zum Hersteller und Modell des angeschlossenen Gamepad. Nützlicher ist eine Kartierungseigenschaft, die die allgemeine Art des Gamepad beschreibt. Derzeit ist die einzige unterstützte Zuordnung Standard, die dem Controller -Layout entspricht, das von vielen beliebten Spielekonsolen wie der Xbox verwendet wird.

Die Standard -Controller -Mapping hat zwei Sticks, von denen jeweils 2 Achsen (x und y) dargestellt werden. Es enthält auch ein D-Pad, 4 Spiele, Top-Tasten und Trigger: Alle als Tasten in der Gamepad-API dargestellt.

aktuelle Xbox -Controller -Berichtstaststatus als 0 (normaler Zustand) oder 1 (gedrückt). Sie können sich jedoch vorstellen, dass zukünftige Controller die für jede Taste angewendete Kraft melden könnten.

Das Xbox D-Pad meldet auch diskrete Werte (0 oder 1), aber die Sticks liefern kontinuierliche Werte über den gesamten Achsenbereich [-1 .. 1]. Diese zusätzliche Präzision erleichtert es viel einfacher, das Flugzeug in unseren Flug Arcade -Missionen zu fliegen.

pxgamepad

Die von der Gamepad -API bereitgestellte Reihe von Tasten und Achsen ist als API auf niedriger Ebene perfekt. Beim Schreiben eines Spiels ist es jedoch schön, eine höhere Darstellung eines Standard -Gamepad wie dem Xbox One -Controller zu haben. Wir haben eine Helferklasse namens PXGamePad erstellt, die die Taste und die Achsenindizes auf die bekannteren Namen, die im Xbox -Controller gekennzeichnet sind

Wir werden ein paar interessante Teile der Bibliothek durchlaufen, aber der vollständige Quellcode (MIT -Lizenz) ist hier verfügbar: https://github.com/thinkpixellab/pxgamepad

Die Standard -Gamepad -API bietet Tastenstatus als Array von Schaltflächen. Auch diese API ist für die Flexibilität ausgelegt, die Controller mit verschiedenen Tastenzählungen ermöglicht. Beim Schreiben eines Spiels ist es jedoch viel einfacher, Code zu schreiben und zu lesen, bei dem die Standard -Kartentastennamen verwendet werden.

Zum Beispiel ist hier der Code mit der HTML5 -Gamepad -API zu überprüfen, ob der linke Auslöser derzeit gedrückt wird:

Die PXGamePad -Klasse enthält eine Aktualisierungsmethode, mit der der Status für alle standardmäßigen zugeordneten Tasten und Achsen sammelt. Die Feststellung, ob der Linkstrigger gedrückt wird, ist so einfach wie der Zugriff auf eine boolesche Eigenschaft:

Achsen in der Standard -Gamepad -API werden auch als Array von numerischen Werten bereitgestellt. Zum Beispiel ist hier der Code, um die normalisierten x- und y -Werte für den linken Stick zu erhalten:

Das D-Pad ist ein Sonderfall, da es von der HTML5-Gamepad-API von vier Schaltflächen betrachtet wurde (Indizes 12, 13, 14 und 15). Es ist jedoch üblich, dass Entwickler das DPAD genauso wie einer der Stöcke verwendet werden können. Pxgamepad liefert eine Taste für das D-Pad, aber auch sythetisiert die Achseninformationen, als wäre der D-Pad ein Stick:

Eine weitere Einschränkung der HTML5 -Gamepad -API ist, dass es keine Ereignisse auf Tasteebene bietet. Es ist üblich, dass ein Spieleentwickler ein einzelnes Ereignis für einen Knopfdruck aktivieren möchte. In Flugbogenbogen sind die Zünd- und Bremsknöpfe gute Beispiele. PXGamePad Watches -Schaltflächenstatus und ermöglicht es Anrufern, sich für Benachrichtigungen bei der Schaltfläche zu registrieren.

Hier ist die vollständige Liste der benannten Schaltflächen, die von pxgamepad unterstützt werden:

• a
• b
• x
• y
• links
• rechten
• linksTtrigger
• righttrigger
• auswählen
• starten
• linker
• rechter Stift
• dpadup
• dpaddown
• dpadleft
• dpadright

Erhalten des aktuellen Gamepad

Es gibt zwei Methoden zum Abrufen des Gamepad -Objekts. Die Gamepad -API fügt dem Navigator -Objekt mit dem Namen getgamepads () eine Methode hinzu, die ein Array aller verbundenen Gamepads zurückgibt. Es gibt auch neue GamePadConnected- und Gamepaddisconnected -Veranstaltungen, die abgefeuert werden, wenn ein neues Gamepad verbunden oder getrennt wurde. Zum Beispiel speichert der PXGamePad -Helfer das letzte verbundene Gamepad:

Und hier ist der Helfer, mit dem das erste Standard -Gamepad mit dem Navigator.getGamepads () API:

abgerufen wird:

Die PXGamePad -Helferklasse wurde für das einfache Szenario entwickelt, in dem ein einzelner Benutzer ein Spiel mit einem Standard -Gamepad spielt. Die neuesten Browser wie Microsoft Edge unterstützen die W3C Gampepad -API. Ältere Versionen einiger anderer Browser unterstützten jedoch nur Teile der aufkommenden Spezifikation. Das pxgamepad hört die Veranstaltungen für gamepadconnected an und fällt bei Bedarf auf die Liste der Liste aller Gamepads zurück.

Zukunft von Gamepad

Während sich PXGamePad auf das einfache, häufigste Szenario konzentriert, ist die Gamepad -API in der Lage, mehrere Spieler mit jeweils eigenem Gamepad zu unterstützen. Eine mögliche Verbesserung für PXGamePad könnte darin bestehen, eine Kurs im Manager-Stil bereitzustellen, die die Verbindung mehrerer Gamepads verfolgt und sie in einem Spiel an mehrere Spieler ordnet. Ein anderer kann darin bestehen, dass Benutzer die Schaltflächenfunktionen in ihren Gamepads neu aufstellen oder anpassen können.

Wir freuen uns auch über das Potenzial des Gamepads für Nicht-Spiel-Szenarien. Mit dem Aufstieg von WebGL sehen wir eine Vielzahl innovativer Verwendungszwecke für 3D im Web. Das könnte bedeuten, die Region Mt. Everest in 3D mit Gletschern zu erforschen. Oder betrachten Sie die assyrische Sammlung des British Museum dank Cyarks Bemühungen, wichtige Weltstandorte und Artefakte digital zu erhalten.

Während der Entwicklung von Flugbogenbogen verwendeten wir häufig Blender und andere 3D -Tools, um Modelle für babylon.js zu verarbeiten. Einige Entwickler und Künstler verwenden ein Gerät namens 3D -Maus, um 3D -Modelle zu manipulieren und zu navigieren. Diese Geräte verfolgen die Bewegung eines einzelnen Knopfes durch sechs Achsen! Sie machen es wirklich einfach und schnell, Modelle zu manipulieren. Über das Spielen hinaus werden sie in einer Vielzahl interessanter Anwendungen verwendet, von der Ingenieurwesen bis zur medizinischen Bildgebung. Während wir Flugbogengamepad -Unterstützung hinzufügten, waren wir überrascht zu erfahren, dass die Gamepad -API unseren 3D -Spacemouse feststellte und Bewegungsdaten für alle sechs Achsen bereitstellte!

Es ist aufregend, sich alle Möglichkeiten vorzustellen, die die neue Gamepad -API bietet. Jetzt ist eine großartige Zeit, um mit der neuen Gamepad -API zu experimentieren und präzise Kontrolle und viel Spaß für Ihr nächstes Spiel oder Ihre nächste Anwendung zu verleihen!

mehr praktisch mit JavaScript

Microsoft hat eine Reihe kostenloser Lernen bei vielen Open -Source -JavaScript -Themen und wir sind auf der Aufgabe, mit Microsoft Edge viel mehr zu kreieren. Hier finden Sie einige zum Auschecken:

• Microsoft Edge Web Summit 2015 (eine vollständige Serie von dem, was Sie mit dem neuen Browser, neuen Webplattformfunktionen und Gastrednern aus der Community erwarten können)
Build von // Build/und Windows 10 (einschließlich der neuen JavaScript -Engine für Websites und Apps)
JavaScript vorantreiben, ohne das Web (Christian Heilmanns jüngster Keynote) zu brechen
gehostete Web-Apps und Webplattform-Innovationen (ein tiefes Tauchgang zu Themen wie vielfältig.js)
Praktische Leistungstipps, um Ihr HTML/JavaScript schneller zu gestalten (eine 7-teilige Serie vom reaktionsschnellen Design bis hin zu Casual Games bis zur Leistungsoptimierung)

Die moderne Webplattform Jumpstart (die Grundlagen von HTML, CSS und JS)

und einige kostenlose Tools zum Einstieg: Visual Studio-Code, Azure-Versuch und Cross-Browser-Test-Tools-alle für Mac, Linux oder Windows verfügbar.

Dieser Artikel ist Teil der Web Dev Tech -Serie von Microsoft. Wir freuen uns, Microsoft Edge und die neue EdgeHTML -Rendering -Engine mit Ihnen zu teilen. Holen Sie sich kostenlose virtuelle Maschinen oder testen Sie remote auf Ihrem Mac, iOS, Android oder Windows Device @ modern.ie.

Häufig gestellte Fragen zur Gamepad -API

Was ist die Gamepad-API? Diese API ist so konzipiert, dass sie mit jeder Art von Gamepad funktioniert, was sie zu einem vielseitigen Tool für Spieleentwickler macht. Es bietet eine Möglichkeit, direkt mit dem Gamepad zu interagieren, ohne eine Software oder einen Treiber von Drittanbietern durchzusetzen.

Wie funktioniert die Gamepad -API? Dies geschieht, indem Sie nach bestimmten Ereignissen wie Knopfdruck oder Joystick -Bewegungen und dann die entsprechende Aktion im Spiel auslösen. Dies ermöglicht ein eindringlicheres und interaktives Spielerlebnis.

Wie kann ich die Gamepad -API in meinen eigenen Spielen verwenden? Es im Code Ihres Spiels. Dies beinhaltet das Aufrufen der Funktionen der API und das Anhören der von ihm generierten Ereignisse. Sie können diese Ereignisse dann verwenden, um Aspekte Ihres Spiels zu kontrollieren, z. B. die Charakterbewegung oder Menünavigation.

Welche Arten von Gamepads sind mit der Gamepad -API kompatibel Seien Sie mit einer Vielzahl von Gamepads kompatibel. Dies beinhaltet Standard -Gamepads mit Tasten und Joysticks sowie spezialisiertere Controller wie Lenkräder oder Flugstangen. Die API kann auch mehrere Gamepads gleichzeitig bearbeiten, was Multiplayer -Spiele ermöglicht.

Kann ich die Gamepad -API mit anderen APIs verwenden? komplexere Spiele schaffen. Sie können beispielsweise die Gamepad -API verwenden, um die Charakterbewegung zu kontrollieren, während Sie eine andere API verwenden, um die Spielphysik oder Grafik zu bewältigen.

Wird die Gamepad -API von allen Browsern unterstützt? ist eine webbasierte Oberfläche, nicht alle Browser unterstützen sie derzeit. Die meisten modernen Browser, einschließlich Chrome, Firefox und Edge, unterstützen jedoch die Gamepad -API. Es ist immer eine gute Idee, die aktuelle Browser -Unterstützung für die API zu überprüfen, bevor Sie mit der Entwicklung beginnen. Die Gamepad -API beinhaltet das Erkennen des richtigen Gamepads, die Behandlung mehrerer Gamepads und das Umgang mit verschiedenen Tastenlayouts. Diese Probleme können normalerweise durch sorgfältiges Lesen der API -Dokumentation und das gründliche Testen des Spiels gelöst werden.

Kann die Gamepad -API für mobile Spiele verwendet werden? Desktop -Browser können auch für mobile Spiele verwendet werden. Dies erfordert jedoch ein Gamepad, das mit dem mobilen Gerät kompatibel ist, und die Benutzererfahrung ist möglicherweise nicht so reibungslos wie bei einem Desktop -Spiel. Kann die Gamepad -API testen, indem ein Gamepad mit Ihrem Computer angeschlossen und ein Spiel ausgeführt wird, das die API verwendet. Sie können dann Schaltflächen im Gamepad drücken und feststellen, ob die entsprechenden Aktionen im Spiel ausgelöst werden.

Wo kann ich mehr über die Gamepad -API erfahren? Dies schließt die offizielle API -Dokumentation sowie Tutorials und Führer auf verschiedenen Websites für Spielentwicklung ein. Sie können auch Beispiele für Spiele finden, die die API verwenden, um sie in Aktion zu sehen.

Das obige ist der detaillierte Inhalt vonEin echtes Spielerlebnis mit der Gamepad -API. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!