qt gamepad_Mac上的Gamepad API和Xbox控制器

qt gamepad

The Mozilla MozVR team was demonstrating the open WebVR standard as well as A-Frame at GDC a few weeks ago and people were intrigued; some were surprised the web could handle VR, some probably just thought our VR line was smaller (it was by miles), and others saw the Xbox controller next the VR headsets and wanted to know how Microsoft Xbox controller + VR + Mac + browser even worked.  I was so excited about all of this that I jumped on it immediately upon return from GDC.  Let's see how it all works!

Mozilla MozVR小组几周前在GDC上展示了开放的WebVR标准以及A-Frame，人们对此很感兴趣。 有些人对Web可以处理VR感到惊讶，有些人可能只是以为我们的VR产品线较小(以英里计)，而其他人则在VR头显之后看到了Xbox控制器，甚至想知道Microsoft Xbox控制器+ VR + Mac +浏览器工作。 我对所有这些都感到非常兴奋，以至于我从GDC回来后立即跳了起来。 让我们看看它是如何工作的！

第一步：Xbox控制器驱动程序(360Controller) (Step One:  Xbox Controller Driver (360Controller))

The 360Controller project provides a list of Mac driver releases for the Xbox, Xbox 360, and Xbox One.  The latest (0.15.0) is required for Xbox One support.  Download and install the package provided and you'll see a "Xbox 360 Controllers" label and icon in your System Preferences app.  This preferences pane provides information about the Xbox controller selected and also provides controls for overriding settings:

360Controller项目提供了Xbox，Xbox 360和Xbox One 的Mac驱动程序版本的列表 。 Xbox One支持需要最新版本(0.15.0)。 下载并安装提供的软件包，您将在“系统偏好设置”应用中看到“ Xbox 360控制器”标签和图标。 此首选项窗格提供有关所选Xbox控制器的信息，还提供用于覆盖设置的控件：

You must connect your Xbox controller via USB for the Mac to detect the controller  -- wireless wont work.  Press the buttons and watch each button's representation in the app light up.  You can even press the left and right trigger buttons and the Xbox controller will shake.  Solid!

您必须通过USB连接Xbox控制器，Mac才能检测到该控制器-无线无法正常工作。 按下按钮，观察应用程序中每个按钮的表示是否点亮。 您甚至可以按左右触发按钮，Xbox控制器将抖动。 固体！

第二步：Gamepad API (Step Two:  Gamepad API)

The JavaScript GamePad API provides access to controllers within the browser.  Start by calling `navigator.getGamepads()` to get a listing of gamepads plugged in:

JavaScript GamePad API提供对浏览器内控制器的访问。 首先调用“ navigator.getGamepads()”以获取插入的游戏手柄列表：

var gpads = navigator.getGamepads(); // Array[Gamepad]

The user may plug in a device during gameplay (or any time for that matter) so you can use two handy event listeners to detect connection and disconnection:

用户可以在游戏过程中(或任何时候)插入设备，以便您可以使用两个方便的事件侦听器来检测连接和断开连接：

// Listen for the connection
window.addEventListener('gamepadconnected', function(e) {
  var gpad = navigator.getGamepads()[e.gamepad.index];

  // Start the game / animation
  
});

// Oh nooooo, disconnected
window.addEventListener('gamepaddisconnected', function(e) {

  // Pause the game
  
});

A GamePad object provides the following information:

GamePad对象提供以下信息：

Gamepad {
  axes: Array[6],
  buttons: Array[15],
  connected: true,
  id: "45e-2d1-Xbox One Wired Controller",
  index: 0,
  mapping: "",
  timestamp: 5142195.495
}

The buttons property is interesting: an array of GamepadButton objects, each having a boolean pressed values describing if the button is currently being pressed.  You're were probably hoping (like I did) that there would be an event listener for button presses but there isn't -- you have to do button press checks within your game's loop (requestAnimationFrame).  It's likely done that way so that lag, latency, etc. don't cause havoc between a listener and game state.  Here's a quick example:

button属性很有趣：一个GamepadButton对象数组，每个对象都有一个布尔pressed值，用于描述当前是否正在按下按钮。 您可能希望(像我一样)希望有一个按钮监听事件监听器，但没有-您必须在游戏循环( requestAnimationFrame )中进行按钮按下检查。 这样做可能是为了避免延迟，等待时间等在听众和游戏状态之间造成破坏。 这是一个简单的例子：

GamepadButton {
  pressed: false,
  value: 0
}

You can see more button press and reaction examples on MDN.  You can also check out HTML5 Gamepad Tester to experiment with button pressing and axis state for any given controller.

您可以在MDN上看到更多的按钮按下和React示例 。 您还可以签出HTML5 Gamepad Tester，以试验任何给定控制器的按钮按下和轴状态。

步骤3：游戏：Tanx (Step 3:  The Game: Tanx)

The game showcased with VR + Xbox controller + Gamepad API was a special 3D build of Tanx by PlayCanvas.  The visual was amazing and people loved the game in an enhanced 3D state.  Sorry, I don't have a link to a public version at this time!

VR + Xbox控制器+ Gamepad API展示的游戏是PlayCanvas的Tanx的特殊3D构建。 视觉效果很棒，人们喜欢增强型3D状态的游戏。 抱歉，我目前没有公共版本的链接！

There you have it -- you can connect your Xbox controller to Mac and play HTML5 games that support the Gamepad API with a special driver and a bit of JavaScript magic!

有了它-您可以将Xbox控制器连接到Mac，并使用特殊的驱动程序和一点JavaScript魔术来玩支持Gamepad APIHTML5游戏！

翻译自: https://davidwalsh.name/gamepad-api-xbox-controller-mac

qt gamepad