Question

参考Detecting Magnetic Button on Cardboard in C#无论如何都要在手机浏览器中访问Javascript中的磁性纸板按钮？

欢呼声斯蒂芬

Answer 1

我终于能够自己解决问题了。幸运的是，时间和一点运气有助于解决方案（当我实际要求时，这是不可能的。）

该解决方案基于W3C提出的“通用传感器API”，特别是磁力计API的实现。

请参阅以下规格 - https://developers.google.com/web/updates/2017/09/sensors-for-the-web - https://www.w3.org/TR/generic-sensor/ - https://w3c.github.io/magnetometer/

然而，有一些警告：

您需要至少拥有Chrome版本63（我不知道任何其他浏览器目前支持它），在我撰写本文时，它只能作为开发人员版本使用。
您需要启用
- 铬：//标志/＃启用泛型传感器
- 铬：//标志/＃启用泛型传感器的额外的类
代码必须通过HTTP或localhost传递！如果没有，您将获得安全例外...

我从更复杂的代码中提取了以下代码。我希望我没有忽视任何事情。

this.lastSensorX = 0;

try {
  this.sensor = new Magnetometer();
  if (this.sensor!==undefined) {
       this.sensor.start();
  }
} catch(err) {
            console.log("Magnetometer not supported. Make sure you configure chrome://flags/#enable-generic-sensor-extra-classes and deliver via HTTPS.");
}

....

// Check major differences on Magnetometer and identify this as a button-click

if (this.sensor !== undefined) {
  this.sensor.onreading = () => {
     var delta= this.sensor.x-this.lastSensorX;
      
     if (delta > 100 ) {
           // do whatever you want to do, in case the cardboard magnet has been "clicked"
     }
     this.lastSensorX = this.sensor.x;
  }
  
  this.sensor.onerror = event => console.log(event.error.name + " (Magnetometer): ", event.error.message);

}

我在我自己的应用程序中使用了上面的剪辑它完美无缺。

Answer 2

您实际上只能在渲染WebGL场景的画布上侦听touchstart事件。

canvas.addEventListener( "touchstart", onCardboardClick );

function onCardboardClick() {}

点击技术上发生在mouseup上，因此您可能希望附加touchend事件。那取决于你。

编辑评论

确保将事件侦听器添加到正确的画布中。你提到你用了THREE.js。所以我假设你有一个WebGLRenderer的实例。您可以通过参考那里确保获得正确的元素。完成所有设置后，您可以添加

renderer.domElement.addEventListener( "touchstart", onCardboardTouch );

Answer 3

在2020年，我也不再担心磁性按钮，但我竭尽全力寻找任何方法在Web VR中实现V2硬纸板按钮。

在纸板中禁用了触摸事件，尽管我看到了对游戏手柄事件的引用，并且注入了一个单按钮游戏手柄来覆盖chrome中的触摸事件，但我没有看到游戏手柄。

我终于找到了一个似乎涵盖所有基础的库-它监听所有内容，并以一个按钮触发所有内容，并且有东西触发-因此，我将回到研究和发现的所有地方无效的答案并将其链接以帮助下一个可怜的灵魂：

https://dougreeder.github.io/aframe-button-controls/example.html

检测Google Cardboard磁性按钮单击Javascript

3 个答案: