使用 xbox one 控制器监听游戏手柄按钮事件
Listen for gamepad button events with xbox one controller
我想在 xbox one 控制器上监听按钮按下事件,但似乎对此的许多解决方案都是实验性的并且正在开发中。我发现的大多数显示如何从游戏手柄接收输入的示例都使用轮询方法来重复检查游戏手柄的事件,但对于我的应用程序来说,我可以记录按钮按下的确切时间是至关重要的,但我没有想错过扫描游戏手柄之间的按钮按下。
我可以使用 Firefox 或 Chrome,但我还没有得到以下解决方案以在任一浏览器中工作:
Firefox: 根据这个页面 https://www.chromestatus.com/feature/5989275208253440#, "gamepad button and axis events are implemented in Firefox behind the flag dom.gamepad.non_standard_events.enabled
". I have enabled this in Firefox but listening to state change events (as described at https://www.smashingmagazine.com/2015/11/gamepad-api-in-web-games/) 仍然没有效果。
Chrome: 这个 github 页面 https://github.com/MozillaReality/gamepad-plus/blob/master/README.md 看起来可以扩展游戏手柄 API 所以我也可以听对于 Chrome 中的按钮按下事件,但是当我尝试使用 npm run build
将 JavaScript 编译为独立模块时,我收到错误 node_modules_missing
并且构建失败。
如果能提供有关如何使 .addEventListener('gamepadbuttondown'
... 在这些浏览器中的任何一个中工作的建议,我将不胜感激。
感谢 Christopher Van Wiemeersch 在 https://codepen.io/cvan/pen/aOzgGE 的代码笔示例,我在 Firefox 中找到了解决方案。
首先我打开火狐浏览器(73.0.1版),在URL中输入about:config
。然后我将 dom.gamepad.non_standard_events.enabled
切换为 true.
然后我使用了来自 Christopher 的代码笔的以下 functions/listeners:
var gamepadConnected = function (e) {
console.log('Gamepad connected at index %d: %s. %d buttons, %d axes.',
e.gamepad.index, e.gamepad.id, e.gamepad.buttons.length, e.gamepad.axes.length);
};
var gamepadDisconnected = function (e) {
console.log('Gamepad removed at index %d: %s.', e.gamepad.index, e.gamepad.id);
};
var gamepadButtonDown = function (e) {
console.log('Gamepad button down at index %d: %s. Button: %d.',
e.gamepad.index, e.gamepad.id, e.button);
};
var gamepadButtonUp = function (e) {
console.log('Gamepad button up at index %d: %s. Button: %d.',
e.gamepad.index, e.gamepad.id, e.button);
};
window.addEventListener('gamepadconnected', gamepadConnected);
window.addEventListener('gamepaddisconnected', gamepadDisconnected);
window.addEventListener('gamepadbuttondown', gamepadButtonDown);
window.addEventListener('gamepadbuttonup', gamepadButtonUp);
然后当按下按钮时,我使用 var timestamp = new Date().getTime()
.
记录时间戳
我想在 xbox one 控制器上监听按钮按下事件,但似乎对此的许多解决方案都是实验性的并且正在开发中。我发现的大多数显示如何从游戏手柄接收输入的示例都使用轮询方法来重复检查游戏手柄的事件,但对于我的应用程序来说,我可以记录按钮按下的确切时间是至关重要的,但我没有想错过扫描游戏手柄之间的按钮按下。
我可以使用 Firefox 或 Chrome,但我还没有得到以下解决方案以在任一浏览器中工作:
Firefox: 根据这个页面 https://www.chromestatus.com/feature/5989275208253440#, "gamepad button and axis events are implemented in Firefox behind the flag dom.gamepad.non_standard_events.enabled
". I have enabled this in Firefox but listening to state change events (as described at https://www.smashingmagazine.com/2015/11/gamepad-api-in-web-games/) 仍然没有效果。
Chrome: 这个 github 页面 https://github.com/MozillaReality/gamepad-plus/blob/master/README.md 看起来可以扩展游戏手柄 API 所以我也可以听对于 Chrome 中的按钮按下事件,但是当我尝试使用 npm run build
将 JavaScript 编译为独立模块时,我收到错误 node_modules_missing
并且构建失败。
如果能提供有关如何使 .addEventListener('gamepadbuttondown'
... 在这些浏览器中的任何一个中工作的建议,我将不胜感激。
感谢 Christopher Van Wiemeersch 在 https://codepen.io/cvan/pen/aOzgGE 的代码笔示例,我在 Firefox 中找到了解决方案。
首先我打开火狐浏览器(73.0.1版),在URL中输入about:config
。然后我将 dom.gamepad.non_standard_events.enabled
切换为 true.
然后我使用了来自 Christopher 的代码笔的以下 functions/listeners:
var gamepadConnected = function (e) {
console.log('Gamepad connected at index %d: %s. %d buttons, %d axes.',
e.gamepad.index, e.gamepad.id, e.gamepad.buttons.length, e.gamepad.axes.length);
};
var gamepadDisconnected = function (e) {
console.log('Gamepad removed at index %d: %s.', e.gamepad.index, e.gamepad.id);
};
var gamepadButtonDown = function (e) {
console.log('Gamepad button down at index %d: %s. Button: %d.',
e.gamepad.index, e.gamepad.id, e.button);
};
var gamepadButtonUp = function (e) {
console.log('Gamepad button up at index %d: %s. Button: %d.',
e.gamepad.index, e.gamepad.id, e.button);
};
window.addEventListener('gamepadconnected', gamepadConnected);
window.addEventListener('gamepaddisconnected', gamepadDisconnected);
window.addEventListener('gamepadbuttondown', gamepadButtonDown);
window.addEventListener('gamepadbuttonup', gamepadButtonUp);
然后当按下按钮时,我使用 var timestamp = new Date().getTime()
.