Search the Community

So I'm currently using Phaser 2.9.1 and had a weird issue I've been struggling with today. If I use scaleMode RESIZE, then whenever the window resizes, the camera gets stuck at 0,0 and wont move anymore. Debugging reveals that the update function is called and the camera x,y are changed whenever the buttons to move the camera are pressed. However, it's like they are changed back right away again. One theory I had was that the world gets resized to the browser innerWidth and innerHeight upon resizing with that scaleMode. I found a thread after a while that fixed my problem. The problem now is that I want to know why it works.... So, doing the following in my create function: game.world.resize(5000, 5000); game.world.setBounds(0, 0, 5000, 5000); works, for some reason. Only doing resize does not work and I have to use setBounds there. But according to the docs, resize sets the size of the world and setBounds sets the camera to 0,0 and then sets the size of the world. Why would that make a difference when the browser is resized after the game has been created and the update function is running? If anyone could shed some light on this, I would greatly appreciate it :-). Also creds to Zekko and Carlos in the post above, for solving the issue 2 years ago

I am building a basketball game. I cannot get the ball to stop sticking to the rim colliders. When I was running p2 physics, the ball would simply bounce off the rim colliders as expected, but now, everytime the ball touches the rim colliders, it slows down movement rapidly and doesn't bounce or fall as expected. I think I might be missing a property setting somewhere. I set the rim colliders (leftMarker + rightMarker) to be immovable in create() but I'm not sure what else I need. I don't understand why the colliders stick to each other! Any help is appreciated! Basketball.Game = function (game) { this.score = null; this.scoreText = null; this.ball = null; this.net = null; this.basket = null; this.rim = null; this.leftMarker = null; this.rightMarker = null; this.checker = null; this.ballCollisionGroup = null; this.rimCollisionGroup = null; this.collisionsOn = false; this.launched = false; this.respawned = false; this.lastPointerPos = null; //HTML element that will produce screenshot this.clickToSave = null; //Constants this.GRAVITY = 1600; this.SHOOT_FORCE = 1400; this.EDGE_CUSHION = 10; this.SCALE_PERCENT = 0.55; }; Basketball.Game.prototype = { create: function () { //Initialize physics world this.game.physics.startSystem(Phaser.Physics.ARCADE); this.game.physics.arcade.gravity.y = this.GRAVITY; //Create basket group this.basket = this.game.add.group(); //Load net sprite this.net = this.game.add.sprite(this.game.world.centerX, this.game.world.centerY - 200, 'net'); this.net.anchor.setTo(0.5); this.basket.add(this.net); //Load hoop markers this.leftMarker = this.game.add.sprite(this.game.world.centerX - 57, 232, 'marker'); this.rightMarker = this.game.add.sprite(this.game.world.centerX + 57, 232, 'marker'); this.leftMarker.anchor.setTo(0.5); this.rightMarker.anchor.setTo(0.5); this.basket.add(this.leftMarker); this.basket.add(this.rightMarker); //Load ball sprite this.ball = this.game.add.sprite(this.game.world.centerX, this.game.world.height - 100, 'ball'); this.ball.anchor.setTo(0.5); //Load rim sprite this.rim = this.game.add.sprite(this.game.world.centerX, this.game.world.centerY - 200, 'rim'); this.rim.anchor.setTo(0.5); this.basket.add(this.rim); //Load checker sprite this.checker = this.game.add.sprite(this.game.world.centerX, this.game.world.centerY - 80, 'checker'); this.checker.anchor.setTo(0.5); this.basket.add(this.checker); //Setup physics this.game.physics.arcade.enable([this.leftMarker, this.rightMarker, this.ball]); this.leftMarker.body.setCircle(this.leftMarker.width / 2); this.rightMarker.body.setCircle(this.rightMarker.width / 2); this.leftMarker.body.moves = false; this.rightMarker.body.moves = false; this.leftMarker.body.immovable = false; this.rightMarker.body.immovable = false; this.leftMarker.body.enable = false; this.rightMarker.body.enable = false; this.ball.body.setCircle((this.ball.width * this.SCALE_PERCENT) / 2); this.ball.body.allowGravity = false; this.ball.body.bounce.set(0.8); this.ball.body.velocity.set(0); //Enable input this.game.input.onDown.add(this.track, this); this.game.input.onUp.add(this.launch, this); //Initialize this.score = 0; this.scoreText = this.game.add.bitmapText(this.game.world.centerX, this.game.world.centerY, 'pixel', 'Score: ' + this.score, 36); this.scoreText.anchor.setTo(0.5); this.lastPointerPos = new Phaser.Point(0, 0); //For mobile Phaser.Canvas.setTouchAction(this.game.canvas, 'auto'); this.game.input.touch.preventDefault = true; }, update : function () { this.game.physics.arcade.collide(this.ball, this.leftMarker); this.game.physics.arcade.collide(this.ball, this.rightMarker); //Only enable collisions when the ball is above the net markers if (this.ball.y < this.basket.children[1].y - this.ball.height / 2) { console.log("Detect collisions!"); this.leftMarker.body.enable = true; this.rightMarker.body.enable = true; } //Check if the ball is out of bounds if (this.ball.x < this.camera.x - this.ball.width / 2 || this.ball.x > this.camera.width + this.ball.width / 2|| this.ball.y < this.camera.y - this.ball.height / 2 || this.ball.y > this.camera.height + this.ball.height / 2) { //Respawn the ball if it hasn't already if (!this.respawned) { this.respawn(); } } }, render : function () { this.game.debug.body(this.ball); if (this.leftMarker.body.enable) { this.game.debug.body(this.leftMarker); this.game.debug.body(this.rightMarker); } }, track : function () { //Update the last finger position this.lastPointerPos.x = this.input.x; this.lastPointerPos.y = this.input.y; //Set the ball physics to be still this.ball.body.allowGravity = false; this.ball.body.velocity.set(0); this.launched = true; }, launch : function () { //Launch the ball if it hasn't already if (this.launched) { this.game.add.tween(this.ball.scale).to({ x: this.SCALE_PERCENT, y: this.SCALE_PERCENT }, 1000, Phaser.Easing.Linear.Out, true); this.launched = false; this.ball.body.allowGravity = true; //Get the direction of finger swipe, normalize it, and apply a scalar to the velocity of the ball var direction = new Phaser.Point(this.input.x - this.lastPointerPos.x, this.input.y - this.lastPointerPos.y); Phaser.Point.normalize(direction, direction); if (direction.y < 0) { this.ball.body.velocity.x = direction.x * this.SHOOT_FORCE; this.ball.body.velocity.y = direction.y * this.SHOOT_FORCE; } } }, respawn : function () { this.respawned = true; //Set the ball physics to be still again this.ball.body.allowGravity = false; this.ball.body.velocity.set(0); //Disable collisions this.leftMarker.body.enable = false; this.rightMarker.body.enable = false; this.game.time.events.add(Phaser.Timer.SECOND * 0.25, function () { this.respawned = false; //Rescale the ball and its body this.ball.scale.setTo(1); this.ballResized = false; //Spawn the ball in a new, random location var ballSpawnX = this.game.rnd.integerInRange(this.camera.x + this.ball.width / 2 + this.EDGE_CUSHION, (this.camera.width - this.ball.width / 2) - this.EDGE_CUSHION); ballSpawnX = this.game.math.snapTo(ballSpawnX, 10); //Make sure the ball is in the boundary we set if (ballSpawnX < this.ball.width + this.EDGE_CUSHION) { ballSpawnX = this.ball.width + this.EDGE_CUSHION; } else if (ballSpawnX > this.world.width - this.EDGE_CUSHION) { ballSpawnX = this.world.width - this.EDGE_CUSHION; } this.ball.x = ballSpawnX; this.ball.y = this.game.height - 100; }, this); }, saveCanvas : function () { var link = this.game.canvas.toDataURL('image/png'); window.open(link, '_blank'); } };

I am currently working on a procedural generation program in Phaser, which generates the environment by stitching together a series of tiles in a grid format. Think along the lines of a roguelike. At the moment the collision detection is a bit wonky under certain circumstances. When I move against a set of solid tiles horizontally with Arcade physics turned on and the walls set to immovable, it moves along smoothly; The black line is just there to illustrate where the non-solid tiles end and the solid ones begin. Each tile on screen is an individual sprite. When moving vertically though, the movement gets "stuck" as if the item is catching against the solid items. Again as above, each tile is a sprite; I'm using moveToPointer to move the object on screen. Here's a screenshot with some debug collision bodies turned on for reference; Any help is greatly appreciated, thank you.

Hi! For several months, I have this problem and have not been able to fix it. I made a post about it while communicating my problem. http://www.html5gamedevs.com/topic/4807-physics-bodies-stick-when-colliding-from-the-side/#entry32859 I use physical P2. When the player touches a wall or jump over the side it gets stuck and does not fall as it should. Some of my code: // map this.map = this.game.add.tilemap('level1_1'); this.map.addTilesetImage('sand'); this.map.setCollisionBetween(0, this.map.tiles.length); this.layer = this.map.createLayer('Sand'); // this.layer.debug = true; this.layer.resizeWorld(); this.layer_tiles = this.game.physics.p2.convertTilemap(this.map, this.layer); // materials & collision groups this.playerMaterial = this.game.physics.p2.createMaterial('player'); this.layerMaterial = this.game.physics.p2.createMaterial('layer'); this.enemyMaterial = this.game.physics.p2.createMaterial('enemy'); this.playerCG = this.game.physics.p2.createCollisionGroup(); this.enemyCG = this.game.physics.p2.createCollisionGroup(); this.layerCG = this.game.physics.p2.createCollisionGroup(); function setupLayer(layer_tiles, theGame) { var layerLength = layer_tiles.length; for (var i = 0; i < layerLength; i++) { layer_tiles[i].setCollisionGroup(theGame.layerCG); layer_tiles[i].collides([theGame.playerCG, theGame.enemyCG]); layer_tiles[i].setMaterial(theGame.layerMaterial); } } setupLayer(this.layer_tiles, this); // player this.game.physics.p2.enable(player); player.scale.setTo(0.5, 0.5); player.body.setZeroDamping(); player.body.fixedRotation = true; player.anchor.setTo(0.5, 0.5); player.body.collideWorldBounds = true; player.body.setCircle(15); player.body.setCollisionGroup(this.playerCG); player.body.setMaterial(this.playerMaterial); player.body.collides([this.layerCG, this.enemyCG]); player.body.createGroupCallback(this.enemyCG, collisions.collisionEnemy, this); player.body.mass = 50; Can anybody help me? A greeting.