javascript - 如何使用 WebVR 和 A-Frame 跟踪 Controller 移动事件？

Question

我有一个使用 A-Frame 制作的 WebVR 页面，使用带有触摸 Controller 的 Oculus Rift。我有这些 Controller 元素:

<a-entity oculus-touch-controls="hand: right" right-control-listener></a-entity>
<a-entity oculus-touch-controls="hand: left" left-control-listener></a-entity>
<a-entity laser-controls="hand: right" raycaster="objects: .clickable"></a-entity>

我想选择或抓取一个对象并随着 Controller 的移动而移动它。但我一直没能找到 Controller 移动的事件。 Mousemove 似乎不可用，尽管 mouseup 和 mousedown 可用。

Answer 1

使用tick 方法。如果您想跟踪实体位置或旋转，请执行以下操作:

AFRAME.registerComponent('track', {
  init: function () {
     this.trackedEl = document.querySelector('#trackedEntity');
  },

  tick: function () {
     this.el.object3D.position.x = this.trackedEl.object3D.position.x;
  }
});

查看 demo红色球跟踪相机的 x 位置(使用 wasd 键移动)。您可以为要跟踪的 Controller 实体使用适当的选择器来执行类似的操作。例如:document.querySelector('[laser-controls]');