最近新版微信更新后,babylonjs的第三人称相机触控出现问题,具体表现为在微信安卓端无法正常缩放和旋转。我的同事在解决这个问题是发现主要是因为babylon的_onPointerUp 事件和微信的长按系统菜单冲突导致,解决方案如下:
1.导入pep.min.js
<script src="https://code.jquery.com/pep/0.4.0/pep.min.js"></script>
2.注意不要忘记给canvas设置 touch-action="none"
<canvas id="renderCanvas" touch-action="none"></canvas>
2018年7月9日更新,好像不用下面的代码也可以支持微信了。如果引入上面代码没用再试试下面的。
var oldUp = scene._onPointerUp, oldDown = scene._onPointerDown, oldMove = scene._onPointerMove; var eventPrefix = BABYLON.Tools.GetPointerPrefix(); canvas.removeEventListener(eventPrefix + "move", oldMove); canvas.removeEventListener(eventPrefix + "down", oldDown); window.removeEventListener(eventPrefix + "up", oldUp); // Wheel scene._onPointerUp = function(evt){ console.log(1); if(false === evt.pointerId > 0){ return;} oldUp(evt); } scene._onPointerDown = function(evt){ console.log(2); if(false === evt.pointerId > 0){ return;} oldDown(evt); } scene._onPointerMove = function(evt){ if(false === evt.pointerId > 0){ return;} oldMove(evt); } canvas.addEventListener(eventPrefix + "move", scene._onPointerMove, false); // Whee canvas.addEventListener(eventPrefix + "down", scene._onPointerDown, false); window.addEventListener(eventPrefix + "up", scene._onPointerUp, false);
上面的不行就用下面的,再不行就jj了。。。
var n = scene._onPointerUp , o = scene._onPointerDown , r = scene._onPointerMove , a = BABYLON.Tools.GetPointerPrefix(); canvas.removeEventListener(a + "move", r), canvas.removeEventListener(a + "down", o), window.removeEventListener(a + "up", n), scene._onPointerUp = function(e) { void 0 !== e.pointerId && n(e) } , scene._onPointerDown = function(e) { void 0 !== e.pointerId && o(e) } , scene._onPointerMove = function(e) { void 0 !== e.pointerId && r(e) } , canvas.addEventListener(a + "move", scene._onPointerMove, !1), canvas.addEventListener(a + "down", scene._onPointerDown, !1), window.addEventListener(a + "up", scene._onPointerUp, !1);
多谢非常好用。另外,还有个问题请教,微信里先横屏后再竖屏,Babylon不能正常恢复显示竖屏的内容,有一部分内容跑到屏幕外了。已经按照官方在window resize事件里调用了engine.resize()了。原生移动版safari没有这个问题,只是在微信里才有这个问题。请楼主不吝赐教,谢谢!
这个有可能是微信的问题,你可能需要在恢复到竖屏的时候,强制刷新界面。