Search the Community
Showing results for tags 'pointer'.
-
Hi, i'm new to phaser 3 and would have some clarifying answers on the Calss Pointer here: in particular: I want to create an Pointer instance using the following code: var gun = new Pointer(manager,0); I know that the "manager" argument refers to a InputManager object, but i don't understand how to create/configure it, i tried this: var manager = new InputManager(this, this); but obtain the following error log: ReferenceError: InputManager is not defined Can someone help me on this problem? Thanks! -
Hi, have encountered such issue, I am listening on pointer events observable: scene.onPointerObservable.add(this.onPointer); this method listens to down, up, move events: function onPointer(info: PointerInfo) { if (info.type === PointerEventTypes.POINTERMOVE) { this.handleMove(info.event); } else if (info.type === PointerEventTypes.POINTERUP) { this.handleUp(info.event); } else if (info.type === PointerEventTypes.POINTERDOWN) { this.handleDown(info.event); } } all woks well till on some android devices PointerUp is not triggered, after some investigation found out that event was canceled so PointerCancel was triggered instead of PointerUp, but after digging in the code saw that engine doesn't handle them at all. Anyone had issues with pointer events being canceled ? maybe some solutions ? As it's not trivial to add cancel event handling as on some devices both Cancel and Up is handled at the same time. Thank you for any info.
-
Hello! I'm trying to make a game like raze (flash game from 2010~ish) and I currently have a level import system and moving animated sprite. I am using matter.js for the physics. I am also using phaser 3 v3.12 as tiled hit detection(? idk how to say) breaks in the the newer versions. I saw the demo for angle to pointer (http://phaser.io/examples/v2/arcade-physics/angle-to-pointer#gv) and wondered if something like it existed in Phaser 3. and also, it would be great if i could anchor a sprite onto another moving one (the weapon on the player) as then it would work, but idk how to do it as I couldn't find anything for phaser 3. Thanks for your help, I might not respond right away! AND here is my project link(so i can work on it on the multiple different computers that I have): https://codesandbox.io/s/k0mq2lj533 ~~~~technically I'm copying the code from the "making modular game worlds in phaser 3 part 5" demo, but this is how I get started on projects as I'm not good at setting things up!
-
Hello and <ping> Q: about Touch.... Getting an Offset of the Pointer on the lower right: The grey dot draws the blue line at offset upper left. Reproduced using Chrome in the Chrome Emulator. But first experienced it in a site using BJS 3.0 with both Hand and then PEP - on a Google Pixel. Replicated in a local sandbox, I'll build a playground... It uses this code: scene.onPointerObservable.add(function(){ console.log('movin') },BABYLON.PointerEventTypes.POINTERMOVE); //TODO - initPickEvents = function // ----------------------------------------------------Register Pointer Events. var meshes = centerTiles; //TODO rename tiles and move up with other code. for(var i = 0; i < meshes.length; i++){ mesh = meshes[i]; mesh.actionManager = new BABYLON.ActionManager(scene); // trigger actions mesh.actionManager.registerAction( new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickDownTrigger, function(){ // debugger; console.log('DOWN') }) ); mesh.actionManager.registerAction( new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickUpTrigger, function(){ console.log('UP') // debugger; }) ); } with this: <canvas id="renderCanvas" touch-action:"none"></canvas> Any tip on things to try? : ) SOLUTION: gotta use meta tag to set device-width. Zing.
-
Has anyone figured out how to still move the camera if the mouse pointer goes outside of the canvas? I'm working with a canvas that is only a small part of the screen but I don't want to restrict dragging to just the canvas area. It feels funny when you go outside the canvas then it stops moving -
I've been working with Pixi for quite sometime with V3 up until now. Recently decided it was time to move some code over to version 4 but have been experiencing some issues with interaction events. I have a button class that originally used both listeners for touch and mouse events to a.) change the visual state of the button on up/down etc b.) perform an action on click/tap. This had been working perfectly fine in version 3 and I could have multiple buttons in a class/container. Switching to version 4 this caused issues with click/tap area where only the last button to be added to a particular class/container will fire this event. All buttons will fire the up/dwn start/end events still though. On upon researching I tried converting them all pointer events and still experience the issue. I'm currently using V4.7.0. I've been trying to pick my way through the PIXI source trying to figure out why the event doesn't fire but it's not clear to me. All I can see is that it doesn't seem to have 'trackingData' when processing the up portion when it does on the one that does fire the tap/click. I've being using Chrome only at this point for Dev tools and tried but desktop and mobile/tablet emulator, both having the same result. I know interaction was reworked for v4 but can anyone give me any pointers as to why those changes have affected my code thus. I don't understand well enough the changes to be able to find the right place to look for a solution. I can't provide the exact code at the moment as it's not a personal project and corporate rules prevent me from doing so. But can give an overview. The class is structured with a parent container (essentially a stage) to add class container to and a class container to display the current button state (current button state can be a graphic, sprite, animation). The current button state container has all the interaction events attached to it. These call binded functions within the class which either change the current state sprite or call a function on click/tap that has been passed in the settings on instantiation (event data is sent to this function). As stated if the event is fired, which it is on the last button added, the function is fired but event doesn't trigger for click/tap on the others. All other events fire normally on each button. I've possibly just overlooked something simple as you get to that 'wood for the trees' state. Any thoughts, suggestions would be grateful.
-
Hi all, Currently I try to rotate the game 90 degree to meet the portrait mode for my [landscape] game, I used other's solution to rotate all display object by this.game.scale.setGameSize(, ; and Phaser.World.prototype.displayObjectUpdateTransform = function() { if(!this.game.scale.correct) { this.x = this.game.camera.y + this.game.width; this.y = -this.game.camera.x; this.rotation = Phaser.Math.degToRad(Phaser.Math.wrapAngle(90)); } else { this.x = -this.game.camera.x; this.y = -this.game.camera.y; this.rotation = 0; } PIXI.DisplayObject.prototype.updateTransform.call(this); }; now all display object are rotated, but the pointer are not rotate, so when I want to do something with activePointer like: calculation with the mouse position drag and drop logic the x, y are reversed. So I want to know is there any good solution to switch the x, y of the pointer, thx.
-
Hi, I just updated an old version of pixi.js we had been using. The cursor used to change to "pointer" when hovering over a DisplayObject in our embedded chromium browser (CEF). After v4.4.0 the cursor does not change on hover. I pinpointed that the last version it was working with our embedded browser was v4.3.5. Does anyone know why this might be and what I can do to fix it? Thank you
-
Hi, I try to lock the pointer without the PointerLock API. I want to do it with "engine.isPointerLock". I have created a PG https://playground.babylonjs.com/#MVQB59. If you press "Q" the camera will turn in the direction of the mouse movement. Now the questions. 1) How can I fix the Pointer arrow in the center of the scene after pressing "Q"? 2) Is it possible to hide the standard cursor after pressing "Q"? I would really appreciate your help.
-
Hi There is bug when BABYLON.GUI buttons that has been created with custom viewport on camera: buttons can be clicked even if mouse is out of button playground: https://www.babylonjs-playground.com/#08PH4F#1
-
Can anybody explain me why pointer event (mouse and touch events) does not work in Edge browser ? It Works well with Chrome FireFox Opera! What is difference? Is there any better way to handle (mouse and touch events) in all browser same? You can try and see difference between Edge and Chrome/Fierefox/Opera in this example/game. (here I use hand.min.js) Is there any better alternative of hand.min.js ??? Is there any bug in Edge browser or BabylonJS's hand.js? https://ajna4taiga.tk/PerplexusShadowOpen/PerplexusProd.html Edge problem: When I release any of WSAD key it has longer delay only in Edge (Windows) Browser. Is there any batter way to handle (mouse/touch evnets) with javascript? greetings Ian
-
Yesterday i add simple GUI buttons to my game. I have problem with pointer event, when i click to button pointer event send data with selected mesh (I think about ground instead button) and now i logic of my game, if i select ground player move to this point. Is possible to block pointer event when i click to my button? Tom
-
How can I find the pointer's x/y coordinates in the world? Can I convert between camera and world coordinates?
-
I'm referring to the https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API to keep the mouse from leaving your game window, however we're having a problem that after you engage the lock, we can't find a method to keep using the mouse functionality to click on things within the box. The mouse is locked to some arbitrary spot, and while we can map its movements to move a fake sprite mouse around, we can't click from that fake sprite mouse. Does anyone know of any examples that accomplish this? -
hy guys, i used a lookAt function for my model on a pickedPoint, but the problem here is i want the model to rotate clockwise or anticlockwise, i don't want it to rotate up and down http://playground.babylonjs.com/#OK5PN#1
-
Hey Guys! I am making a game when I need the player to look at mouse pointer. I implemented this. But Phaser seems to be giving coordinates only inside canvas bounds. which gives effect like this: demo I get mouse coordinates like this: lookAtMouse() { const mouseX = this.game.input.mousePointer.worldX, mouseY = this.game.input.mousePointer.worldY; this.lookAt( mouseX, mouseY ); } lookAt( targetX, targetY ) { const targetPoint = new Phaser.Point( targetX, targetY ), entityCenter = new Phaser.Point( this.body.x, this.body.y ); let targetAngle = ( 360 / ( 2 * Math.PI ) ) * this.game.math.angleBetweenPoints( targetPoint, entityCenter ) - 90; if ( targetAngle < 0 ) { targetAngle += 360; } this.angle = targetAngle; } Is there any way that I can get mouse coordinates outside of the canvas ? -
I am working on a project in which the user creates a system of points by adding them one-at-a-time. These points are also draggable, and clicking on existing points sets the clicked point as active. That's all working fine. When using a simple mouseDownCallback, clicking one of these existing points creates interference between the activities of the new point and the old point. I want to be able to determine what sprites, if any, a clicked point contains and run a function only if the spot is unoccupied. If I can do this via the activePointer versus specifically mouse, that's preferred, but not necessary. Can someone point me in the correct direction?
-
Iorana! I have just a little question about onInputOut behaivour in mobile/touch devices. I have this scenario in Phaser 2.6.2: A small lovely Sprite with inputEnabled activated to handle events, connected with events.onInputOver and events.onInputOut, just for hover actions. No problems there. If I test it in desktop, the signals are dispatched correctly if I move the mouse over the sprite and then move it away from it. But in mobile/touch the behaivour is different. Obviously, you can't "move" a touch Pointer like a mouse, but anyways if you tap the sprite events.onInputOver is dispatched. BUT, after that, if you tap other place somewhere in the screen there's not any events.onInputDown signal, resulting the game acting if there's still hovering the sprite. But keeping pressed the touchscreen and move Pointer it dispatch the desired signal. I know one can make workaround to handle this (if it is mobile check in the next tap, if the pointer is inside bounds of the sprite: If not, manually dispatch events.onInputOut signal), but I have the doubt in mind if this is the correct behaivour of the signal or not. (Probably not, but there's always a bug possiblity). I checked the docs and there's not much thing to say about the event: As yoy can see, the docs don't cover this particular case. If someone explains me this well if this must be work or not... Thanks in advance
-
So, I'm working on a project that will make use of Kinect, and I would like to translate certain coordinates I'm calculating based on the input recieved from the device into x and y values in the screen. In order to simplify the code, I thought the easiest way to handle it would be to use some pointers whose position would be updated by myself in code, and then rely on Phaser's event detections for overlappiing. Of course I can just use Phaser.Point objects and do the overlapping calculations myself, but I was wondering if there's an easy way to control some Pointers myself, as the InputManger pointer list is meant to be read only.
-
Hey everyone I am not sure why but if I create two ScreenSpaceCanvas2D in two different scenes, one of the scenes being shown and not the other (stored in a parent object). The function Canvas2D.prototype._updatePointerInfo is called twice each time I move the mouse, once for the shown Canvas, and once for the canvas that is in the stored scene. Since I did not declare a camera in that stored scene the bit of code in babylon.max.js 44657 : Canvas2D.prototype._updatePointerInfo = function (eventData, localPosition) { ... var camera = this._scene.cameraToUseForPointers || this._scene.activeCamera; ... } return camera as undefined. And later on while the function tries to access camera.viewport it returns an error. This report is not really about solving the bug because if I declare a random camera for the stored scene (like a normal human being not trying to find bugs everywhere) i do not get the error. But I think it was not on purpose that events are captured on a canvas in a scene that is not currently rendered. All in all it is not a real problem for me but it might cause trouble for other people. To change between scenes I use this bit of code /* --- Start the render loop --- */ taskObject.engine.runRenderLoop(function () { taskObject.scenes[taskObject.currentScene].render(); }); This is the call stack for the error: Uncaught TypeError: Cannot read property 'viewport' of undefined @babylon.max.js:44665 Canvas2D._updatePointerInfo @ babylon.max.js:44665 Canvas2D._handlePointerEventForInteraction @ babylon.max.js:44628 (anonymous function) @ babylon.max.js:44549 Observable.notifyObservers @ babylon.max.js:3399 _onPointerMove @ babylon.max.js:15232 It seems the observables are set up at scene creation and down the callback chain there is no test to check wether the scene is currently being rendered (is that even possible?).
-
Hello, I try to develop a game compatible desktop and mobile, but I am faced with a big problem. I managed to handle the scroll of the camera with this great plugin: http://jdnichollsc.github.io/Phaser-Kinetic-Scrolling-Plugin/ Now I would like to handle the click, in addition to the scroll. I'm comparing pointers in the update function, but no way to differentiate the click pointer and the first pointer of the scroll (the following is good) I'm am already able to detect the first click of a scroll compared to the next with isClick param on : this.game.input.addMoveCallback ((point, x, y, isClick) => {}) But nothing to differentiate a simple click of a first click on a scroll event I tried with a setTimeout but I not get a great result. Any other ideas ? Thank you PS: Sorry for my english (i'm french ^^")
-
Trying out a little project in the PG that requires clicking on a mesh I found that the pointer disappears when you go to full screen and so it is not possible to click on the mesh. Then I tried with some of the built in PGs. In the PG from the drop down menu select Actions and Drag and Drop and then Full Screen, no pointer with which to carry out the actions. Any suggestions?
-
I am kind of lost in this events system. I have a button which when i press it creates new graphics object. I want to be able to drag this object while the mouse button is down and when I release it this object should be destroyed. Tried several things but I am lost in sending context objects. How this functionality should be done correctly? ( I remember in Flash was easy, just use startDrag() and the newly created object start to follow the mouse as you move it) Here is my sample code which works partially: var horizontalBaffleBtn = null, horzBaffle = null; horizontalBaffleBtn = gameObject.add.button(10, 10, frnConstr.ImageAssetKeys.HORIZONTAL_BAFFLE); horizontalBaffleBtn .events .onInputDown .add(function () { this.frnPart = this .grUtils .drawRect(this.context, gameObject.input.x, gameObject.input.y, 50, thickness, constGr.DEFAULT_GRAPHICS_BORDER_SIZE, constGr.Colors.BLACK, 1, utils.getHexColor(shelveCssColor), 1); this.frnPart.inputEnabled = true; this.frnPart.input.enableDrag(false); this.frnPart.input.start(0, true); }, {context: grContext, grUtils: this, frnPart: horzBaffle}); console.log(horzBaffle);// prints null horizontalBaffleBtn.events.onInputUp.add(function () { this.destroy(); // breaks here, horzBaffle is null }, horzBaffle); -
So I have two event listeners in my game which work great drop.events.onDragStart.add(this.onDragStart, this); drop.events.onDragStop.add(this.onDragStop, this); But the callback only gets trigggered when the click takes place over the sprite. I want the event to trigger if the pointer is already down and then it moves over the sprite, is there any way to do that? One solution would be to use onInputOver drop.events.onInputOver.add(this.onInputOver, this); But that won't tell the sprite to be dragged, Is there a way to manually trigger events in Phaser? EDIT Ok I found a solution that works use onInputOver and manually start the drag. onInputOver: function(sprite, pointer){ if(pointer.isDown){ sprite.input.startDrag(pointer); } },
-
Hello guys, I got an issue when I want to implement a drawing tool, if I move the pointer slow, it can draw a linear line, but if I move the point fast, it will have the gap between my 'brush' dot. I have attached a screenshot for this issue. My planning solution is: when the pointer isDown or is dragging, start drawing. However, it seems there are not 'dragging' or 'moving' method for input.pointer. Is there any other ways that can solve this problem? Thank you very much.
