gzlock

Members
  • Content count

    13
  • Joined

  • Last visited

  1. Because the runtime env is not a normal html env, that is more like run at the Node.Js. The runtime env just exposed the "game.js" file entry and GameGlobal/wx/canvas three global objects to the developer, no window/document objects, no Html DOM system. And it bind a touch events like that(need to fake a event system to trigger the canvas listened events): wx.onTouchStart(()=>{}) wx.onTouchMove(()=>{}) wx.onTouchEnd(()=>{}) wx.onTouchCancel(()=>{}) I think the touch event cycle is : When touch, the Android/iOS native app will trigger the wx object touch series events. My friend make a module to fake the window/document objects and Babylon.js runs successfully (just has simulate the touchstart/touchmove/touchend events, no simulate the pointer series events) I tried the jQuery pep not work, I think the jQuery pep module just can work on the normal html env. So I want to keep to use the touch events, and just solved the three problems then It's perfect.
  2. I am not good at english, very sorry about that. Use the pc chrome emulated any touch devices open: https://www.babylonjs-playground.com/#0ZQ985#9 Runtime Environment: Highly customized environment of the phone app. Only touchstart/move/end events. No PointerEvent object. So, I did: Create the custom PointerEvent object. Create and use the ArcRotateCameraTouchInput object(use the scene.simulatePointerDown/Move/Up methods). Let the _onPointerDown/_onPointerMove/_onPointerUp of the Babylon.Scene properties listen to the canvas touchstart/move/end events. Already successful: Rotate the camera Interact with OnPickUpTrigger of the blue sphere. Interact with mesh ui button. Problems: Touch any position alway trigger the full screen ui button event. The Panning/Pinch control of the camera. Cannot trigger the OnPickTrigger event of the red sphere.
  3. https://www.babylonjs-playground.com/#2ARI2W The edge of the button will blur, just like adding a blur filter.
  4. My custom camera input class is referenced from ArcRotateCameraPointersInput, it can the rotation of the camera. Now, my ArcRotateCameraTouchInput class can only control the camera rotation, can not trigger Babylon.UI events, like Babylon.UI.Button.onPointerUpObservable. And I know it missing this part, but i don't know how to implement at the custom environment without the PointerEvent object. this._pointerInput= ()=> {}//I don't know how to implement ๐Ÿ˜‚ this.camera.getScene().onPointerObservable.add(this._pointerInput, BABYLON.PointerEventTypes.POINTERDOWN | BABYLON.PointerEventTypes.POINTERUP | BABYLON.PointerEventTypes.POINTERMOVE | BABYLON.PointerEventTypes._POINTERDOUBLETAP); //My Custom Input class module.exports = BABYLON => { class ArcRotateCameraTouchInput { constructor() { this.angularSensibilityX = 1000.0; this.angularSensibilityY = 1000.0; this.screenX = 0; this.screenY = 0; this.movementX = 0; this.movementY = 0; console.log('init TouchInput') } getTypeName() { return 'ArcRotateCameraTouchInput'; } getSimpleName() { return 'touch'; } attachControl(element, noPreventDefault) { // console.log('attachControl', element); let scene = this.camera.getScene(); this.__touchStart = evt => { console.log('__touchStart'); this.screenX = evt.touches[0].screenX; this.screenY = evt.touches[0].screenY; scene.simulatePointerDown(scene.pick(this.screenX, this.screenY)) }; this.__touchMove = evt => { this.movementX = evt.touches[0].screenX - this.screenX; this.movementY = evt.touches[0].screenY - this.screenY; this.screenX = evt.touches[0].screenX; this.screenY = evt.touches[0].screenY; }; this.__touchEnd = evt => { this.movementX = 0; this.movementY = 0; }; element.addEventListener('touchstart', this.__touchStart, false); element.addEventListener('touchmove', this.__touchMove, false); element.addEventListener('touchend', this.__touchEnd, false); } detachControl(element) { element.removeEventListener('touchstart'); element.removeEventListener('touchmove'); element.removeEventListener('touchend'); } checkInputs() { this.camera.inertialAlphaOffset -= this.movementX / this.angularSensibilityX; this.camera.inertialBetaOffset -= this.movementY / this.angularSensibilityY; } } BABYLON.ArcRotateCameraTouchInput = ArcRotateCameraTouchInput; BABYLON.CameraInputTypes["ArcRotateCameraTouchInput"] = ArcRotateCameraTouchInput; };
  5. I have been doing other projects some time ago. The custom environment does not have the PointerEvent Object, so use the scene.simulatePointerDown method throw this error.
  6. This is a phone app of the html5 game platform, just support custom touch events. No other input events. And hand.js not working. btw: I posted 2 replies to the ใ€Report postใ€‘ button ๐Ÿ˜‚๐Ÿ˜‚๐Ÿ˜‚
  7. html env: app custom webview js env: like JavaScriptCore Babylon.js version: 3.1.1 That app custom webview just can use touch events, so all of the features that rely on pointer events are not working! So, how to let the babylon.js adapt the events change? My test results: canvas.addEventListener('pointerdown', () => { console.log('Pointer down!') }); canvas.addEventListener('touchstart', () => { console.log('Touch Start!') });
  8. gzlock

    Playground editor cursor mis-aligned in Chrome

    Mac: 10.13.1 Chrome: 62.0.3202.94 Chrome had this problem +1 And hope to set up a switch to control the mini map to display or not
  9. This code can be more shortened a little more Box1.setPivotPoint(Box1.getBoundingInfo().boundingBox.center);
  10. @Wingnut @JohnK Thank you! Less code than JohnK. Box1.setPivotPoint(Box1.getBoundingInfo().boundingBox.centerWorld, BABYLON.Space.WORLD); http://www.babylonjs-playground.com/index.html#Q4KURW
  11. @Wingnut No effect for the CSG program generated mesh object. mesh.setPivotMatrix(BABYLON.Matrix.Identity()); As same as with NewMesh.setPivotMatrix(BABYLON.Matrix.Translation(0, 0, 0));
  12. code: http://www.babylonjs-playground.com/#Y5561T The green object was generated from CSG (BoxA.intersect(BoxB)) and the pivot point was inherited from BoxA. So I want to let the pivot point of the new object reset to the center. I tested NewMesh.setPivotMatrix(BABYLON.Matrix.Translation(0, 0, 0)); but the pivot point still stay in place. How to do it by easy way?