如何使用WebVR和A-Frame跟踪控制器运动事件？

Question

I have a WebVR page made with A-Frame, using an Oculus Rift with touch controllers. I have these elements for the controllers:

<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>

I want to select or grip an object and move it as a controller moves. But I haven't been able to find an event for controller movement. Mousemove doesn't seem to be available, even though mouseup and mousedown are.

Answer 1

Use the tick method. If you want to track an entity position or rotation do:

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

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

See a demo where the red ball tracks the x position of the camera (moved with wasd keys). You can do something similar using an appropriate selector for the controller entity you want to track. eg: document.querySelector('[laser-controls]');