帧场景中的触摸控件仅在左右工作,它无法使用移动设备上下工作但是使用桌面它可以完美运行当我添加触摸控件时,外观控件被删除
如何同时添加它们
我想在移动设备上做同样的事情。在加载 aFrame 库后添加以下代码:
AFRAME.components["look-controls"].Component.prototype.onTouchMove = function (t) {
var PI_2 = Math.PI/2,
e,
o = this.el.sceneEl.canvas,
i = this.yawObject,
j = this.pitchObject;
this.touchStarted && this.data.touchEnabled && (e = 2 * Math.PI * (t.touches[0].pageX - this.touchStart.x) / o.clientWidth, f = 2 * Math.PI * (t.touches[0].pageY - this.touchStart.y) / o.clientHeight, j.rotation.x += .3 * f, i.rotation.y += .5 * e, j.rotation.x = Math.max(-PI_2, Math.min(PI_2, j.rotation.x)), this.touchStart = {
x: t.touches[0].pageX,
y: t.touches[0].pageY
})
}
或者,您也可以在aframe.min.js(或您使用的任何文件(中找到"look-controls"的代码,并在那里修改onTouchMove功能。
我从"Igor R"中获取了答案,并对其进行了一点清理。
AFRAME.components["look-controls"].Component.prototype.onTouchMove = function (t) {
if (this.touchStarted && this.data.touchEnabled) {
this.pitchObject.rotation.x += .6 * Math.PI * (t.touches[0].pageY - this.touchStart.y) / this.el.sceneEl.canvas.clientHeight;
this.yawObject.rotation.y += /* */ Math.PI * (t.touches[0].pageX - this.touchStart.x) / this.el.sceneEl.canvas.clientWidth;
this.pitchObject.rotation.x = Math.max(Math.PI / -2, Math.min(Math.PI / 2, this.pitchObject.rotation.x));
this.touchStart = {
x: t.touches[0].pageX,
y: t.touches[0].pageY
}
}
}
请指定您使用的是iOS设备还是Android。要遵循的步骤:
-
在iOS 12.2上,这是一个已知问题,因为Apple已在Safari中禁用了设备方向和设备运动。 尝试手动启用它,但仍然不起作用。 安装了Chrome和Cardboard-VR文件,但没有取得丰硕的成果。
-
在Android上,如果你没有谷歌纸板,请安装它。 更新 Aframe 的版本,确保您使用的是 A-Frame 0.9.2。