How to use Oculus Go trackpad to move in AFrame

Asked 17/6, 2018 at 12:5 Answered 17/6, 2018 at 17:32

I'm testing some AFrame pages with Oculus Go, but I cannot make the trackpad work to move within the scene. I'm using the master version of AFrame, where the Oculus Go controller is apparently supported. In fact, this code for example:

<!DOCTYPE html>
<html>
<head>
  <script src="https://rawgit.com/aframevr/aframe/cf15c15/dist/aframe-master.min.js"></script>
</head>
<body>
  <a-scene anti-alias>
    <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9" shadow></a-box>
    <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E" shadow></a-sphere>
    <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D" shadow></a-cylinder>
    <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" shadow></a-plane>
    <a-sky color="#ECECEC"></a-sky>

    <a-entity laser-controls="hand: right"></a-entity>
    <a-entity oculus-go-controls x-button-listener></a-entity>
    <a-entity camera look-controls wasd-controls position="0 1.6 0"></a-entity>
  </a-scene>
</body>
</html>

shows the controller in the image, but apparently does not affect to the trackpad being used as I would use wasd in the desktop version (which does work pretty well with respect to moving through the scene).

So, in summary, how can I use the Oculus Go trackpad in an AFrame scene to move in it, as I would do in the desktop with wasd keys? (or, maybe this is not still supported by AFrame?)

[I know this is similar to AFrame Oculus Go Controller Documentation?, but I'm more specifically interested in how to move.]

Stephniestepladder answered 17/6, 2018 at 12:5 Comment(0)

A-Frame does not provide trackpad based locomotion out of the box. You can look into aframe-extras, in particular movement-controls as a starting point to derive your own Oculus Go locomotion component

Stampede answered 17/6, 2018 at 14:11 Comment(0)

Thanks to the answer by @diego-marcos I could write some simple HTML which worked for me:

<!DOCTYPE html>
<html>
<head>
  <script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
  <script src="//cdn.rawgit.com/donmccurdy/aframe-extras/v4.1.2/dist/aframe-extras.min.js"></script>
</head>
<body>
  <a-scene anti-alias>
    <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9" shadow></a-box>
    <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E" shadow></a-sphere>
    <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D" shadow></a-cylinder>
    <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" shadow></a-plane>
    <a-sky color="#ECECEC"></a-sky>

    <a-entity movement-controls="fly: true" position="0 0 0">
      <a-entity camera position="0 1.6 0"></a-entity>
    </a-entity>
  </a-scene>
</body>
</html>

This provides locomotion of the camera, out of the box, using the currently stable release of AFrame, and of AFrame Extras.

When you launch the scene in the browser in the Oculus Go, and go VR, you can control movement of the camera by just gently positioning your thumb on the trackpad. The camera moves in the direction you are positioning your thumb, in the horizontal plane, and in the direction of your gaze. That is, if you are moving forward, but positioning your thumb in the front of the trackpad, and looking upwards, the camera will move forward and upwards, in the direction of your gaze. Remember that it the camera moving, not the scene, which means if you position your thumb on the left, the camera will move to the left, and the scene will seem to move to the right.

If the vertical movement is not wanted (eg, because you're simulating moving over an horizontal plane) you can remove fly: true from the movement-controls properties.

For other properties of movement-controls check its documentation.

Stephniestepladder answered 17/6, 2018 at 17:32 Comment(1)

This is a beautiful answer, but for anyone else looking to do this in 2022, it is not currently possible. See this issue: github.com/n5ro/aframe-extras/issues/314 – Scrawly 20/4, 2022 at 23:26

Stampede answered 17/6, 2018 at 14:11 Comment(0)

Recommended topics

Hot tags