如何使用 Google Cardboard 的按钮移动 A-Frame？

Question

我正在使用 A-Frame 编写 WebVR 应用程序。该应用程序主要是为 Cardboard 用户量身定制的。在桌面上，您可以简单地将 wasd-controls 组件添加到相机，以便使用 WASD 移动。但是，我希望能够以相同的方式移动，只使用 Cardboard 按钮（即屏幕触摸），方向由相机的方向决定。使用 A-Frame 是否有一种直接的方法来做到这一点？

Answer 1

正如您所指出的，wasd-controls 实际上只是为桌面键盘控件设计的。我写了一个类似的 universal-controls component，它可以选择性地替换 look-controls 和 wasd-controls。使用此组件，按下纸板按钮会将相机朝它所面对的方向移动：

<a-entity camera universal-controls></a-entity>

或者，您可以定义 "checkpoints"，当用户注视他们时，传送相机。在许多情况下，这可能是更好的用户体验。 Demo and source.

  <!-- Player -->
  <a-entity camera="userHeight: 1.6"
            universal-controls="movementControls: checkpoint"
            checkpoint-controls="mode: teleport">
    <a-entity cursor
              position="0 0 -1"
              geometry="primitive: ring; radiusInner: 0.02; radiusOuter: 0.03;"
              material="color: #CCC; shader: flat;">
    </a-entity>
  </a-entity>

  <!-- Terrain -->
  <a-grid></a-grid>

  <!-- Checkpoints -->
  <a-entity position="1 0 1">
    <a-cylinder checkpoint="offset: 0 1.6 0" radius="1" height="0.1" position="0 0 -5.2" color="#39BB82"></a-cylinder>
    <a-cylinder checkpoint="offset: 0 1.6 0" radius="1" height="0.1" position="3 0 0" color="#39BB82"></a-cylinder>
    <a-cylinder checkpoint="offset: 0 1.6 0" radius="1" height="0.1" position="-3 0 0" color="#39BB82"></a-cylinder>
  </a-entity>

这两个选项都在 aframe-extras package 中实现，它向 A-Frame 添加了几个组件。

如何使用 Google Cardboard 的按钮移动 A-Frame？

How to move around with A-Frame using Google Cardboard's button?

web

aframe