A 帧 WASD 控件可替代移动设备

Question

我有一个A-Frame多人游戏项目，它依赖于每个用户在地图上移动，并且在桌面浏览器中运行良好。绊脚石是移动设备中缺乏运动控制，例如相机的WASD控制。

您建议什么解决方法？也许，使用jQuery添加屏幕按钮并触发按键事件？

或者有没有一种更直接的方法来添加一个功能，该功能会改变每次按下屏幕按钮的相机位置？在这种情况下，有没有办法找到归因于 W、A、S、D 键的确切功能？

我尝试过的几件事包括：

$(".up-button").click(function(){
  window.dispatchEvent(new KeyboardEvent('keypress',{keyCode: 38}));

还有一个：

var e = jQuery.Event("keydown");
e.which = 38;
$(window).trigger(e);

两者都不会产生任何变化。

Answer 1

你有没有尝试过这样的事情：

window.dispatchEvent(new KeyboardEvent('keypress',{keyCode: 38} )  );

模拟按向上箭头键？

您可以模拟按 wasd 或从左下右下。不过，轮换可能会有点棘手，您必须模拟 onMouseDown 和 onMouseMove 事件。

Answer 2

我明白你的意思。大多数人甚至没有控制器来正确移动项目/游戏中的角色。我在A-Frame的演示中看到过，在我看来这是非常聪明的。基本上，如果用户向下看地板，则相机会向前移动。这很好，因为它不需要任何外部输入，因此它可以适用于所有内容。

至于如何实现它，这可能是一个解决方案：

//First calculate the verticle angle of the camera
     var verticalAngle = getVerticalAngle(camera.getWorldDirection());
        console.log('vertical angle:' + verticalAngle);
        function getVerticalAngle(cameraVector) {
            return vRadiansToDegrees(Math.atan(cameraVector.y));
        }
        function vRadiansToDegrees(radians) {
            return radians * 180 / Math.PI;
        }

如果用户向下看地板，则向前移动相机

if (verticalAngle < -43) {
      //move camera
    }