Search the Community

Hi! character in my game is this cat: The cat is class extending group and contains torso and head, both are sprites with arcade physics enable on it. In the game, the cat is pushed up by applying velocity on it and it collects certain items (gameplay is similar to Flip the Gun game, check it out for better understanding). THE PROBLEM: In update method, I am constantly checking for collisionse between cat and the items: this.game.physics.arcade.overlap(this._cat, this._sceneObjectsLayer, this.onObjectCollision, null, this); My onObjectCollision method looks like this: onObjectCollision(cat: Phaser.Sprite, item: GeneratedItem) { console.log("COLLISION SOURCE IS " + cat.key); console.log("COLLISION! OBJECT ID IS " + item.ItemID + "... UPDATE FRAME IS " + this._updateFrameCnt); this._items++; this._UI.showCount(this._items); item.KillItem(); //inside this method I call item.kill() this._sceneObjectsLayer.remove(item); } Basically, it should just update the total amount of items taken in player UI. The problem is that same item is sometimes collected multiple times. That makes sense - one collision for torso, one for head, but I would expect it not to call this method for the same item after item.kill() is called. I already debugged this and I put the variable this._updateFrameCnt to update method. Result is this. You can see that the item with certain ID is collected, then it is killed and after few frames it is collected again like no kill() was called on it: State_game.ts:451 COLLISION SOURCE IS catHead State_game.ts:452 COLLISION! OBJECT ID IS 0... UPDATE FRAME IS 2034 GeneratedItem.ts:52 KILLING ITEM WITH ID 0 //called from item.KillItem //and after few frames: State_game.ts:451 COLLISION SOURCE IS catTorso State_game.ts:452 COLLISION! OBJECT ID IS 0... UPDATE FRAME IS 2040 GeneratedItem.ts:52 KILLING ITEM WITH ID 0 //called from item.KillItem Moreover, this sometimes happens for the same sprite (for example it is called twice for head sprite). Is this expected behaviour due the reasons how Phaser handles physics? Seems really strange for me, I would expect to make physics computation after each frame and therefore no second collision should occur, because the item should be dead at the time. Am I missing something here? Thanks in advance for your responses!

Hi All I've been working on a top down endless runner , where the player jumps from one platform to another and should not leave the screen. How to make a platform move horizontally I'm spawning platforms and adding x and y velocity its working but is it a right of doing it ? if not how to make it look better this.initX = this.x; this.body.velocity.y = -200; platform.prototype.update = function () { if (this.moving) { if (this.x > (this.initX + this.width)) { this.speed = -200; } if (this.x < (this.initX)) { this.speed = 200; } this.body.velocity.x = this.speed; }

Hi Guys. I did some test on my notebook, and the phaser doesn't reach 60FPS, just 40FPS. As this said, I've been having some problem working with the ARCADE physics, considering that it works on a 60FPS constant. The following implementation was a try to solve the problem: var game = new Phaser.Game(960, 540, Phaser.CANVAS); var GameState = { init: function () { this.game.forceSingleUpdate = true; this.game.time.desiredFps = this.game.time.fps || 60; ... }, update: function() { this.game.time.desiredFps = this.game.time.fps || 60; this.car.body.velocity.x = 400; } } Would it be a bad practice fulfill this implementation? Would it be more correct to set aside physics and increase position using the delta time?

Hi guys, I've been digging through the code, examples and the forums and I'm yet to discover a solution to my problem. I have an array of objects and have set their collision properties as follows: this.physics.add.overlap(this.ball, this.bricks, this.hitBrick, null, this); What I need is to be able to dynamically change the collision type to something like: this.physics.add.collider(this.ball, this.bricks, this.hitBrick, null, this); Is there any way I can achieve that? Many thanks

Hi, This is my first game and im working with Phaser . I have made progress far, its a basic basketball shoot and score game. I am the point where i write the logic to throw the ball into the net. Can I get some assistance on how to go about this ? Demo link : basket.inspireleadership.biz

Hi everyone, I ran into a problem while prototyping a game. The game is very basic for now: the player is a 32x32 square sprite in a tilemap of 32x32 tiles. The player had to dig trough the dirt tile. Grey tiles (rocks) will fall down if there is no more dirt below them. As you can see on the screenshots, if the player remove a dirt tile below a rock, this one will start falling down and will also make the player tunneling through the dirt tiles which of course is not intended. I don't understand where the problem might be? In update, I make the player collide with rocks and the dirt tiles. update: function() { // ... this.game.physics.arcade.collide(this.player, this.layerDirt); this.game.physics.arcade.collide(this.rocks, this.layerDirt); this.game.physics.arcade.collide(this.player, this.rocks); //... }I also checked the tiles collisions attributes: collideUp is set to true for the tiles below the player. The player body is set to collide on every faces. Also, the group "rocks" has its property "allowGravity" set to false. It's only when the player remove a dirt tile below a rock that I set the allowGravity of this rock to true. But this is done all in the same frame. Creating the rocks group: create: function() { //... this.rocks = this.game.add.group(); this.rocks.enableBody = true; this.map.createFromObjects('rocks', 7, 'rock', 0, true, false, this.rocks); this.rocks.setAll('body.allowGravity', false); this.rocks.setAll('body.immovable', true); // I don't want the player to be able to push rocks //...}It seems that the falling rock gives a velocity to the player which is correct but the player should immediately collide with the dirt tile below him? I tried to play with the TILE_BIAS attribute but still no luck from 40 to 150. The value of gravity does not change anything, the problem is still here with a gravity of 10 or 300. Can anyone help me in the right direction? Thanks!

Hey, Still fairly new to game developing. Trying my hand at it. I've got most of a game created and have figured out a bunch of things. There are two glaring issues I can't seem to get past. My player has gravity applied. If he falls from a certain height and the gravity is high, he falls through the floor tiles. If I turn down the gravity so this doesn't happen, the game seems slow. You can check out a working version of the game at http://gf-game.herokuapp.com/ . I looked into switching to P2 Physics but it just seemed way more complicated than I needed it to be for this type of game. Any help will do.

Hello everyone, I've been looking in to how one might create sloping tiles in Phaser.js and its Arcade physics engine. From what I've done so far, I just basically have two squares moving through the middle of an existing square as an experiment to see if my 'limited' knowledge of maths actually works (see fiddle): http://jsfiddle.net/drunkenoodle/qLuzv06c/10/. My plan was to simply move a sprite along that same trajectory while ignoring the left and right collisions of the tile... So I gave it a shot and attempted to apply the method to Phaser, although had very little luck doing so. I've checked out a few articles but sadly don't 100% understand them yet, so heading back to them after posting this. I just wondered if anyone else had any luck, and if you may have some pointers on how to go about it. Cheers for your time guys, -D

Hello! I'm not well versed in game development but I write a lot of JS for my classes and my job, so I'd like to think I have some semblance of knowing what I'm doing, but the issue I'm having with Phaser right now is completely beyond me. It's hard to accurately describe my problem in words, so I've left the entire project as an attachment for you to see for yourself. (Cursor keys to control.) Essentially, I'm trying to write a simple platformer using a tilemap larger than the screen. However, when the camera is set to follow an object, and that object crosses the center of the window in a given direction on either axis, the camera slides in that direction at high speed - it seems to depend on how far you've crossed the threshold - until it reaches the stage boundary. The most difficult part is that the object seems to move properly relative to the camera - meaning it moves across the stage itself at very high speeds, confusing the arcade physics system and causing clips and zips galore if you're in the wrong places (try jumping under the spawn platform, for instance - you'll zip to the left or right) The problem doesn't happen at all when the stage size is equal to the game window size, nor does it happen if the camera is not following an object. Here are some things I've tried to resolve the issue: Removing game window scaling code Rewriting of Tilemap import code & use of different maps and tilesets Refactoring/simplification of the Player object (as well as forgoing the use of a class and extending Phaser.Sprite) Applying "layer.fixedToCamera = false" and "layer.fixedToCamera = true" Restarting the project and rewriting all code (this happened on a prior test project as well) Rolling back to some prior versions of Phaser I'm not certain whether the issue is with my Tilemap setup, my use of the camera, the general jankiness of the arcade physics system, or maybe something else I haven't taken into account, but given half of my Google searches lead here, I'm sure someone's got some kind of answer for me. For convenience, here's the important bits of my code, in case anything looks off at first glance: (game.js, the main game code) 'use strict' /* global Phaser, Player */ var game = new Phaser.Game( 161, // width 145, // height Phaser.AUTO, // idek 'game', // game name { create: create, update: update, preload: preload, render: render } // functions ) game.antialias = false function preload () { game.load.tilemap('mapTest', 'assets/map/testmap.json', null, Phaser.Tilemap.TILED_JSON) game.load.image('tileGrass', 'assets/img/grass.png') game.load.image('bgClouds', 'assets/img/bg.png') game.load.spritesheet('spritePlayer', 'assets/img/player.png', 9, 9) } let bg, player, map, layer function create () { // display background bg = game.add.image(1, 1, 'bgClouds') bg.fixedToCamera = true // instantiate the map map = game.add.tilemap('mapTest') map.addTilesetImage('tileGrass', 'tileGrass') layer = map.createLayer('terrain') map.setCollisionBetween(1, 10, 'terrain') layer.resizeWorld() layer.debug = true // initialize physics and set gravity game.physics.startSystem(Phaser.Physics.ARCADE) game.physics.arcade.gravity.y = 257 // set up the player player = new Player(game, 33, 49) game.physics.arcade.enable(player) // set game scale game.scale.scaleMode = Phaser.ScaleManager.USER_SCALE game.scale.setUserScale(6, 6) game.renderer.renderSession.roundPixels = true Phaser.Canvas.setImageRenderingCrisp(game.canvas) // camera: follow the player game.camera.follow(player) } function update () { game.physics.arcade.collide(player, layer) } function render () { game.debug.body(player) game.debug.body(layer) game.debug.text(Math.round(player.body.position.x), 9, 17) } game.antialias = false (player.js, the Player object file) /* global Phaser */ class Player extends Phaser.Sprite { constructor (game, x, y) { // set up the player super(game, x, y, 'spritePlayer') // physics game.physics.enable(this, Phaser.Physics.ARCADE) this.velCap = {x: 64, y: 150} this.jumpVel = -100 this.acceleration = 500 // units per second // animations this.anims = { 'idle': this.animations.add('idle', [0, 1, 2, 3], 6, true), 'walk': this.animations.add('walk', [8, 9, 10, 11, 12, 13, 14, 15], 15, true), 'down': this.animations.add('down', [21, 22], 15, false), 'jump': this.animations.add('jump', [16, 17, 18, 19], 15, false), 'fall': this.animations.add('fall', [19], 20, true), 'land': this.animations.add('land', [20, 21, 22, 23], 10, false) } this.animations.play('idle') this._facing = true this.anchor.setTo(0.5, 1) this.body.setSize(6,8,1,0) this.body.tilePadding.x = 12 this.body.tilePadding.y = 12 // input this.keys = game.input.keyboard.createCursorKeys() // add the player to the stage game.stage.addChild(this) } // facing code set face (bool) { if (bool) { this.scale.x = 1 } else { this.scale.x = -1 } this._facing = bool } get face () { return this._facing } update () { let airborne = !(this.body.blocked.down || this.body.touching.down) let dt = game.time.physicsElapsed if(this.keys.right.isDown) { this._move(dt, true, airborne) } else if(this.keys.left.isDown) { this._move(dt, false, airborne) } else{ this._decelerate(airborne) } if(this.keys.up.isDown && !airborne) { this._jump() } else if(this.keys.down.isDown && !airborne) { this._crouch() } this._capMovement() } _move (dt, right, airborne) { if(this.face != right){ this.face = right if(!airborne){ this.body.velocity.x = -this.body.velocity.x } } else { this.body.velocity.x += Math.floor(this.acceleration * (right ? 1 : -1) * dt) if (airborne) { this.animations.play('fall') } else { this.animations.play('walk') } } } _jump () { this.body.velocity.y = this.jumpVel this.animations.play('jump') } _crouch() { // stop all movement and crouch the player this.body.velocity.x = 0 if(this.animations.currentAnim.name != 'down'){ this.animations.play('down') } } _decelerate(airborne) { this.body.velocity.x = this.body.velocity.x / 2 if(airborne){ this.animations.play('fall') } else { this.animations.play('idle') } } _capMovement () { if(this.body.velocity.y > this.velCap.y){ this.body.velocity.y = this.velCap.y } else if (this.body.velocity.y < -this.velCap.y) { this.body.velocity.y = -this.velCap.y } if(this.body.velocity.x > this.velCap.x){ this.body.velocity.x = this.velCap.x } else if (this.body.velocity.x < -this.velCap.x) { this.body.velocity.x = -this.velCap.x } } } Thanks in advance! phaser_wtf.zip

I see the docs of the Body class http://phaser.io/docs/2.6.2/Phaser.Physics.Arcade.Body.html But i am not sure which would be the right property to change. I have two balloons falling down and they might both at the same time or one after the other, hit my rectangle. The problem is, both objects stop moving after they hit the rectangle. i am sure this has to do something with physics. As if the vertical(y coordinate) velocity gets set to 0 when they hit the rectangle. Here is a sample code: graphics = si.gameObject.add.sprite(boxX, boxY, si.ImageAssetKeys.BALLOON_ANIM_ATLAS, 0); floatingAnim = graphics.animations.add('floating', si.GraphicsUtility.getFloatingAnimArray(), 30, true); splashAnim = graphics.animations.add('splash', si.GraphicsUtility.getSplashAnimArray(), 30, false); splashAnim.onComplete.add(si.LetterBox.splashComplete, this); graphics.animations.play('floating'); balloon.graphics = graphics; balloon.graphics.anchor.setTo(0.5, 0.5); balloon.graphics.body.checkCollision.up = false; balloon.graphics.body.checkCollision.left = false; balloon.graphics.body.checkCollision.right = false; balloon.graphics.body.checkCollision.down = true; balloon.graphics.body.velocity.y = velocity; balloon.graphics.allowGravity = false; balloon.graphics.allowRotation = false; Which body property should I change to prevent the stop in movement of balloons?

Hello everyone, i am having a hard time implementing the physics for a race like game where you can drive over "boosting" and "slowing" zones. The player can control in which lane the vehicle drives (left, mid, right). On the track there are different zones/areas. Boosting Zones should accelerate the vehicle and "Slowing" zones should really punish the player with very slow speed and a massive drag. The game is played in portrait mode with the vehicle going up. The camera is fixed on the vehicle. The lane switching is working and right now I am using tweens for that. My problem is the "natural" feeling for the acceleration / deceleration. I tried tweening the amount of pixels the y coordinate gets manipulated, I tried working with acceleration and velocity. Nothing of that "feels" right. The Zones fire events when ever the vehicle enters and leaves them. I am stuck at the physics part. What should I manipulate? Acceleration? Velocity? Drag? Friction? Inside my State: /** * handle Vehicle entering a zone! * * @param obstacle */ handleVehicleZoneEnter(event) { if (event.zone instanceof SlowingZone) { this.vehicle.speedEffect = 'SLOWED'; } if (event.zone instanceof BoostingZone) { this.vehicle.speedEffect = 'BOOSTED'; } } /** * handle vehicle zone leave * @param event */ handleVehicleZoneLeave(event) { if (event.zone instanceof SlowingZone) { this.vehicle.speedEffect = 'NONE'; } if (event.zone instanceof BoostingZone) { this.vehicle.speedEffect = 'NONE'; } } Inside my vehicle Object: // This gets called on every frame as long as the vehicle hasnt reached the end of the track adjustSpeed() { let minSpeed = 30; let normalSpeed = 500; let maxSpeed = 3000; switch (this.speedEffect) { case 'SLOWED' : this.body.drag.y = 500; this.body.friction.y = 500; break; case 'BOOSTED' : this.body.acceleration.y = -500; break; default : this.body.drag.y = 100; this.body.friction.y = 100; break; } } Thanks.

Hi i'm quite new to phaser but ive been making this game for a school project where you control a helicopter and when the helicopter body collides with the water refill building it refills the water but if i go up against the side of the building and change direction it flips my helicopter so that it flys the other direction which then makes the helicopter overlapping the water refill building and my game crashes and i get this error Game.js:342 Uncaught ReferenceError: refill is not defined at Function.<anonymous> (Game.js:342) at Phaser.Physics.Arcade.collideSpriteVsSprite (phaser.js:80431) at Phaser.Physics.Arcade.collideSpriteVsGroup (phaser.js:80520) at Phaser.Physics.Arcade.collideHandler (phaser.js:80369) at Phaser.Physics.Arcade.overlap (phaser.js:80121) at Object.update (Game.js:341) at Phaser.StateManager.update (phaser.js:30658) at Phaser.Game.updateLogic (phaser.js:38763) at Phaser.Game.update (phaser.js:38707) at Phaser.RequestAnimationFrame.updateRAF (phaser.js:61260) function Refill() { water = 3 } game.physics.arcade.overlap(player, WaterBuildings, function (overlappingPlayer, overlappingWaterBuildings) { refill() }); any help would be much appreciated

I'm using physics in one of my games, but I'm having trouble getting things to move realistically. I have the player (a bird), and I have objects in a group (trash). The trash I want to be very lightweight, so that it can be knocked around by the bird. Setting mass on both the player and the objects sometimes results in some weird visual stuff, so for now I have taken those lines out. What I really want to solve is the issue of friction. Right now, my code looks like this: this.trash.forEach(function (piece) { piece.anchor.setTo(0.5, 1); piece.body.gravity.y = 5; piece.body.moves = true; piece.body.velocity.setTo(100, 100); piece.body.collideWorldBounds = true; piece.body.bounce.set(0.8); piece.body.friction.x = 1; piece.body.drag.x = 1; }); The trash is gliding around on the floor of the game like wet ice cubes. I thought perhaps introducing another sprite to interact with would help: this.platforms = this.add.physicsGroup(); // Create the ground and set properties. this.platforms.create(0, game.height - 5, 'ground'); this.platforms.setAll('body.allowGravity', false); this.platforms.setAll('body.immovable', true); this.platforms.setAll('body.moves', false); this.platforms.setAll('body.velocity.x', 100); this.platforms.setAll('body.friction.x', 1); this.platforms.setAll('body.drag.x', 1); I'm still watching ice-cube trash. What I'm aiming for is something that can tumble (is there a way to get corresponding rotation on collision to happen?), so I want moving the trash to be more of a shove to move a distance rather than a tap from the player. Thank you for your help!

I have a block based game that requires separated physics bodies, which is why I can't merge a wall of five bodies into one. It appears like the player could still hit the floor in-between the blocks, if the player is forcing itself towards that direction, which makes me think that the bodies are slightly overlapping and causing this. I'm using arcade physics. Is there a way to avoid this? A video here shows the player executing the bug on the top of the tower. He's jumping on the wall, eventually getting over it.

Hi! I'm making a game where the player clicks or touches the screen and his avatar walks towards that point and stops. It works great without obstacles. With obstacles the player avatar get stuck in the corner. See gif below. I managed to fix it, but it feels hacky. When hero (player's avatar) collides with box (obstacle on screen) I move him towards his target EXAMPLE: if hero collides with left or right side of box and target is above him, I move hero up a bit function collisionHandler(){ //prevent hero avatar from getting stuck on corners kick = 0.4; if(box.x < hero.sprite.x && hero.target.sprite.x > hero.sprite.x){ hero.sprite.x += kick; //KICK right } else if(box.x > hero.sprite.x && hero.target.sprite.x < hero.sprite.x){ hero.sprite.x -= kick; //KICK left } if(box.y < hero.sprite.y && hero.target.sprite.y > hero.sprite.y){ hero.sprite.y += kick; //KICK down } else if(box.y > hero.sprite.y && hero.target.sprite.y < hero.sprite.y){ hero.sprite.y -= kick; //KICK up } } Is there a property of ARCADE physics I'm missing? Do I need my hacky code or there's a better way of fixing it? UPDATE: Github page: https://github.com/CaioMGA/ZenvaGameJam/ hero.js: function createHero(x, y, _speed){ return { "alive":true, "walking" : false, "speed":_speed, "direction" : {"x":1, "y":0}, "target":null, "sprite" : null, "createTarget": function(){ this.target = createTarget(); }, "createAnimations" :function(){ this.sprite = game.add.sprite(x, y, 'hero_spritesheet', 10); this.sprite.anchor.setTo(0.5, 0.5); this.sprite.animations.add('walkH', [13, 14 ,15, 14], 8, true); this.sprite.animations.add('walkUp', [7, 8, 7, 9], 8, true); this.sprite.animations.add('walkDown', [10, 11, 10, 12], 8, true); this.sprite.animations.add('idle', [10], 8, false); this.sprite.animations.add('idleUp', [7], 8, false); this.sprite.animations.add('victory', [10, 16, 10, 16, 10, 16], 5, false); this.sprite.animations.add('death', [0, 1, 2, 3, 0, 1, 2, 3, 4, 5, 6], 10, false); this.sprite.animations.play('idle'); game.physics.enable(this.sprite, Phaser.Physics.ARCADE); this.sprite.body.collideWorldBounds = true; this.sprite.body.setCircle(16); this.sprite.body.bounce.set(0.05); }, "death" : function(){ this.sprite.animations.play('death'); }, "walk" : function(direction){ this.sprite.animations.play('walkH'); this.sprite.scale.x = direction; }, "walkUp" : function(){ this.sprite.animations.play('walkUp'); }, "walkDown" : function(){ this.sprite.animations.play('walkDown'); }, "stop" : function(){ this.walking = false; this.sprite.animations.play('idle'); }, "victory" : function(){ this.sprite.animations.play('victory'); }, "update" : function(){ this.move(); }, "move" : function(){ if(this.walking){ game.physics.arcade.moveToXY(this.sprite, this.target.sprite.x, this.target.sprite.y,this.speed, 0); if(Phaser.Math.distance(this.sprite.x, this.sprite.y, this.target.sprite.x, this.target.sprite.y) < 8){ this.sprite.x = this.target.sprite.x; this.sprite.y = this.target.sprite.y; this.walking = false; this.sprite.body.velocity.setTo(0, 0); this.stop(); this.target.hide(); } } }, "setTarget" : function (x, y){ this.target.set(x, y); this.walking = true; if(Math.abs(this.sprite.x - this.target.sprite.x) >= Math.abs(this.sprite.y - this.target.sprite.y)){ if(this.sprite.x > this.target.sprite.x){ this.walk(-1); } else { this.walk(1); } } else { if(this.sprite.y > this.target.sprite.y){ this.walkUp(); } else { this.walkDown(); } } }, "init" : function(){ this.createAnimations(); this.createTarget(); this.target.init(); } }; }

Hello, does someone perhaps have any examples for this? I want to make a "button" with the arcade physics system, so that when the player steps on it, it is pushed into the ground, and triggers some event, and when the player moves away, it sticks out again.

Hello everyone, I've got a very odd problem with the collision detection of the arcade physics system. The code is as follows: var x_player = null; var floor = null; BasicGame.Game.prototype = { preload: function () { }, create: function () { this.physics.startSystem(Phaser.Physics.ARCADE); var boundary_bottom = 650; var boundary_top = 50; floor = this.add.sprite(640, 680, 'floor'); floor.anchor.setTo(0.5, 0); x_player = this.add.sprite(640, 450, 'x_player'); x_player.anchor.setTo(0.5, 0.5); this.physics.arcade.enable([floor, x_player]); floor.body.allowGravity = false; floor.body.immovable = true; x_player.body.gravity.y = 600; x_player.body.bounce.y = 0.4; x_player.body.setCircle(27,9,9); }, update: function () { this.physics.arcade.collide(x_player, floor); if (this.input.activePointer.isDown) { x_player.body.velocity.y = -500; } }, render: function () { this.game.debug.body(x_player); this.game.debug.body(floor); } }; The collision detection seems to work basically, but when I let the ball jump by pressing the mouse button, there is a pretty big random chance it will just slip through the floor when it comes down again. It seems like it doesn't work precisely enough or something. Does anyone know more? Help is greatly appreciated!

HI Been going through the Book Discover Phaser, but are stuck with this bit of code: The jump functionality on the player somehow doe's not work. When I console.log the body.touching object, I can see, that body.touching.down does not turn true, when the player hit's the a platform. Furthermore, the cursor.up is detected when I leave out this bit of code: '&& this.player.body.touching.down', but somehow does not function, when the code is as in the Quote. Any Ideas to what I should be looking for? Thanks.

Hey! I have a group of enemies created like this (called from create()): spawnEnemies: function(map){ this.enemies = this.game.add.group(); this.enemies.enableBody = true; this.game.physics.arcade.enable(this.enemies); var enemyStartPositions = this.findObjectsByType('enemyStart', this.map, 'objectLayer'); for(var i = 0; i < enemyStartPositions.length; i++){ var enemyStart = enemyStartPositions[i]; var enemy = new Enemy(this.game, enemyStart.x, enemyStart.y, 'cultist'); enemy.countStats(); this.enemies.add(enemy); } this.enemies.setAll("body.immovable", true); } In the update function - I try to detect the collision between the children in the group like in this example (using 2.4.7): http://examples.phaser.io/_site/view_full.html?d=arcade physics&f=group vs self.js&t=group vs self&phaser_version=v2.4.7& this.game.physics.arcade.collide(this.enemies); But they wont collide with - just passing trough - each other. Also tried with adding a callback as when I let the player sprite collide with the enemy group like this: this.game.physics.arcade.collide(this.player, this.enemies, this.collisionHandlerPlayerAndEnemy, null, this); this.game.physics.arcade.collide(this.enemies, null, this.collisionHandlerEnemyAndEnemy); And the callback-function will not be called (may it be that this does not even work at all when the case is group to group?). I need someone elses eyes on this. No properties for enemy body is set outside these code blocks.

var mainState = { preload: function() { // This function will be executed at the beginning // That's where we load the game's assets game.load.image('player', 'assets/player.png'); game.load.image('wallV', 'assets/wallVertical.png'); game.load.image('wallH', 'assets/wallHorizontal.png'); game.load.image('player2', 'assets/secondplayer.png'); }, create: function() { game.stage.backgroundColor = '#3498db'; game.physics.startSystem(Phaser.Physics.ARCADE); this.player2 = game.add.sprite(200,100, 'player2'); this.player2.anchor.setTo(0.5, 0.5); game.physics.arcade.enable(this.player2); //first enable gravity this.player2.body.gravity.y = 500; //then use gravity properties. this.player = game.add.sprite(game.world.centerX, game.world.centerY, 'player'); this.player.anchor.setTo(0.5, 0.5); game.physics.arcade.enable(this.player); this.player.body.gravity.y = 500; this.cursor = game.input.keyboard.createCursorKeys(); // Create a new group this.walls = game.add.group(); // Add Arcade physics to the whole group this.walls.enableBody = true; // Create 2 walls in the group game.add.sprite(0, 0, 'wallV', 0, this.walls); // Left wall game.add.sprite(780, 0, 'wallV', 0, this.walls); // Right wall game.add.sprite(0,580, 'wallH' , 0, this.walls); //horizontal wall. this.walls.setAll('body.immovable', true); // this.createWorld(); }, //timer update: function() { game.physics.arcade.collide(this.player, this.walls); this.movePlayer(); game.physics.arcade.collide(this.player2, this.walls); }, movePlayer: function() { // If the left arrow key is pressed if (this.cursor.left.isDown) { // Move the player to the left this.player.body.velocity.x = -200; } // If the right arrow key is pressed else if (this.cursor.right.isDown) { // Move the player to the right this.player.body.velocity.x = 200; } else if (this.cursor.up.isDown) && (this.player.body.touching.wallH == true) { this.player.body.velocity.y = -500; //this.cursor.up.isDown := false } else if (this.cursor.down.isDown) { this.player.body.velocity.y = 200; } // If neither the right or left arrow key is pressed else { // Stop the player this.player.body.velocity.x = 0; //this.player.body.velocity.y = 0; } // If the up arrow key is pressed and the player is touching the ground if (this.cursor.up.isDown && this.player.body.touching.down) { // Move the player upward (jump) this.player.body.velocity.y = -320; } }, }; var game = new Phaser.Game(800, 600, Phaser.AUTO, 'gameDiv'); game.state.add('main', mainState); game.state.start('main'); Hello! I am very new to Phaser, only started out a few days ago. As you might expect, I will do some dumb mistakes. My issue here is that my character that works, (the one controllable with arrow keys) has the ability to jump to infinity. I have tried a bit of code with a double if condition to solve this, but I can't get the syntax right and I don't know how to check if the player is touching the horizontal wall or not. (I don't want it to jump unless it's touching the horizontal wall, that way I can't keep on jumping in mid air. Here's the horrible bit of code I am attempting to get to work: //if i'm pressing up AND the player is touching the wall THEN set vertical velocity to -500px. else if (this.cursor.up.isDown) && (this.player.body.touching.wallH == true) { this.player.body.velocity.y = -500; } I have attached all my actual code. I'm new here, I don't know how to write this condition, thanks for your help main.js

Hey guys! I'm having another issue with my endless runner and arcade physics bodies. This time bodies seem to flicker for a frame after I have call kill/reset on their sprites. Basically I have three chunks which are laid out and scrolled on screen one other the other. Once a chunk has scrolled off the opposite side of the screen, the layout is reshuffled and it is positioned behind the previous chunks so it can scroll back on screen. Before reshuffling the layout, I forEachAlive -> member.kill(). This is because it's possible that no every child of the chunk will be used in the new layout, so I want to pool them. When I generate the new layout, I reset(x, y) the child. This seems to cause the body of the child to flicker on screen despite the chunk being off screen. I wrote an example and attached it to help demonstrate the issue I am having. example.zip

I've been working on a Phaser game for a project at university. All of this is relatively new stuff to me, so I'm learning on the fly. I've managed to create a simple tilemap using Tiled, and got it to import to Phaser successfully. However, I can't make the player collide with the 'platform' layer, and I've tried just about everything I can find online. I've cut down my game code to just what's needed for you to (hopefully) point out my error, but it all runs without errors usually. I can also upload any JSON or Image files that might be needed. var SuddenGame = SuddenGame || {}; var char; var map; // GAMEPLAY STATE // SuddenGame.playState = function() {}; SuddenGame.playState.prototype = { init: function() { this.game.renderer.renderSession.roundPixels = true; }, create: function() { //Setup FPS Counter this.game.time.advancedTiming = true; //Stop game from pausing if a player tabs out this.stage.disableVisibilityChange = true; //Import and play background music music = this.game.add.audio('menumusic'); music.play('', 0, 1, true); //Create Dotted Background this.background = this.game.add.tileSprite(0, this.game.height - this.game.cache.getImage('background').height, this.game.width, this.game.cache.getImage('background').height, 'background' ); this.dots = this.game.add.tileSprite(0, this.game.height - this.game.cache.getImage('dots').height, this.game.width, this.game.cache.getImage('dots').height, 'dots' ); //Enable Physics Engine this.game.physics.startSystem(Phaser.Physics.ARCADE); //Add level one tilemap map = this.game.add.tilemap('levelone'); map.addTilesetImage('scifi_platformTiles_32x32', 'scifi_platformTiles_32x32'); backgroundTiles = map.createLayer('backgroundLayer'); Objective = map.createLayer('Objective'); Platform = map.createLayer('Platform'); this.game.add.existing(Platform); this.physics.arcade.enable(Platform); map.setCollisionBetween(1, 1000, true, 'Platform'); Platform.resizeWorld(); Platform.debug = true; this.char = this.add.sprite(50, 470, 'hero'); this.physics.arcade.enable(this.char); this.char.body.gravity.y = 1300; this.char.body.collideWorldBounds = true; this.char.scale.setTo(2, 2); //Create Player Animations var idle = this.char.animations.add('idle', [0]); var walk = this.char.animations.add('walk', [0, 1, 2, 1]); this.game.camera.follow(this.char); }, update: function() { this.game.physics.arcade.collide(char, Platform); this.physics.arcade.TILE_BIAS = 40; if (this.game.input.keyboard.isDown(Phaser.Keyboard.LEFT) && !this.char.body.touching.left) { this.char.body.velocity.x = -150; this.char.animations.play('backwalk', 10, true); } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.RIGHT) && !this.char.body.touching.right) { this.char.body.velocity.x = 150; this.char.animations.play('walk', 10, true); } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) { this.char.animations.play('die', 10, true); } else { this.char.body.velocity.x = 0; this.char.animations.play('idle', 7, true); } if (this.game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR) && this.game.time.now > jumpTimer) { { this.char.animations.play('jump', 10); this.char.body.velocity.y = -1000; jumpTimer = this.game.time.now + 750; } } //if (this.cursors.up.isDown && !this.char.body.touching.down ) { if (this.game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR) && this.game.input.keyboard.isDown(Phaser.Keyboard.LEFT) && this.char.body.touching.left && this.game.time.now > jumpTimer) { this.char.body.velocity.y = -500; jumpTimer = this.game.time.now + 1; } if (this.game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR) && this.game.input.keyboard.isDown(Phaser.Keyboard.RIGHT) && this.char.body.touching.right) { this.char.body.velocity.y = -500; this.char.body.velocity.x = -2500; //jumpTimer = this.game.time.now + 1; } //More update code here }, render: function() { this.game.debug.text(this.game.time.fps || '--', 2, 14, "#00ff00"); } } Apologies if I've missed an extremely obvious mistake!

Hi! I want to make a pixel game with a resolution of 144*256 pixels. I want to keep the pixel look also when I rotate a sprite. So the player is able to see tilted pixels. So i decided to set the real dimension of the game to the full available size like 1920*1080. Then I put everything inside a Group and scale the whole Group up so that the game fits the canvas. Also I'm using the Arcade physics and there is where the problem takes place. The physics bodies are not scaled with the group and so the whole szene is useless^^ So is there a solution to scale a whole stage or the "game" up to maximal resolution but working correctly with a design resolution? The Falsh engine Starling worked like this and that was very handy cause you get the real pixel count of the device without taking care of that. Thanks in advance^^

Hey guys! I'm making an endless runner and I'm running into a weird issue with Arcade physics. Because my game is an endless running, I'm anchoring my player on the screen and moving the objects towards the player instead of using the camera. My issue is that I get collision events however none of the body.blocked booleans are being set, so I know a collision happens, but I don't know which side it happens on (up, down, or left). I'm checking for collision like such: this.game.physics.arcade.collide(sprite, this.chunks[0], levelHandler, null, ctx); this.game.physics.arcade.collide(sprite, this.chunks[1], levelHandler, null, ctx); this.game.physics.arcade.collide(sprite, this.chunks[2], levelHandler, null, ctx); Basically, what I'm doing is I spawn three chunks (or segments) of objects and position them one screen length apart from each other. I then scroll each group on screen towards the player. When a chunk is scrolled off the opposite side of the screen, I reposition it back behind the last chunk in the list so it can be scrolled back on towards the player. My 'levelHandler' is being called properly, and it's giving my the object that the player collided with. Again, my issue is the object.body.blocked booleans aren't being set, so I don't know whether the player hit the left side, top, or bottom of the object. Would this be because I'm not moving the objects by applying a velocity to the object's body? I'm moving the parent group of the objects so I don't have to iterate through all my objects to do that. Is there another way to get the information I want? Or am I going to have to write my own detection to get which side was hit after the collision happened?

Hey everyone, I stepped upon an interesting thing or self induced bug that seems to be happening whilst using Arcade Physics for an infinite runner. It's pretty rough around the edges, more of a proof of concept than anything else, but basically in the update function I'm doing a couple of things. First of all, the ground is a group of child sprites, each ones velocity gets nudged left per update cycle: this.ground.children.forEach(function(c) { c.body.velocity.x = -this.RUN_SPEED; }, this); Then, I check to see if any of those children have gone off screen to the left (child.body.right < 0) for example. Once that's done, I then reset that child back to the right hand side of the screen like so: child.reset(this.game.width, child.y); In between all that I just do a couple of checks to make sure none of them overlap, by using this (it also makes sure we don't try to place anything else whilst this particular piece is still leaving the right-hand area: this.ground.children.find(function(child){ return child.x < this.game.width && child.x + child.width > this.game.width || child.x >= this.game.width; }, this); Now the main problem I'm having is that there seems to be a gap between each one of the sprites when they've been resetted and are following the one that came before hand. What I find interesting is that if I set the velocity to 256, the gap between each sprite seems to be exactly 12 pixels in width. If I drop it to 128, then it drops to 6 pixels in width. I'm curious as to how the numbers might correlate, or, is there something that happens in the physics step that's making the gap outside of the main update loop? It's a bit of a weird problem, and as said earlier, it's probably just down to poor implementation. I've attached the script file if you'd fancy a perusal also. Thanks for your time everyone, take care! IFPlay.js