Search the Community

Showing results for tags 'p2'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 333 results

  1. Hello, I am quite new to phaser and Tiled. I was wondering if anyone could give me some help with understanding on how to create tilemap collisions that are more than just squares with the p2 physics system. Right now every tile has a square collision box, I would like the collision shape to match the tile shape so that I can have slopes and what not. I am a quite a bit confused on the Tiled to phaser workflow especially on what p2.convertTilemap does and how Tiled's collision editor ties into phaser. So far my code looks like this: preload: function () {'mapTiles', "assets/platformer-pack-redux-360-assets/Spritesheets/spritesheet_ground.png");'level1', "assets/testmap2.json", null, Phaser.Tilemap.TILED_JSON);'player', "assets/kenney_platformercharacters/PNG/Player/player_tilesheet.png", 80,110, 24); }, create: function () {; var level1 ='level1'); level1.addTilesetImage('spritesheet_ground', 'mapTiles'); var wallsLayer = level1.createLayer("layer1"); wallsLayer.resizeWorld(); level1.setCollisionByExclusion([],true,'layer1');,wallsLayer);,"objectLayer1"); player =,80, 'player'); var walk = player.animations.add('walk', [0]);'walk', 10, true);;; player.body.setZeroDamping(); player.body.fixedRotation = true;,true,true,true,false); cursors =; wallsLayer.debug = true; player.body.debug = true; }, Any help is appreciated!
  2.;; var wallCollisionGroup =; var playerCollisionGroup =; var doorCollisionGroup =;; // I've created all the necessary collisions as in expamle: and it works perfect. player.body.collides(wallCollisionGroup); player.body.collides(doorCollisionGroup, wrongDoor, this); cursors =; } wrongDoor() { player.body.velocity.x = 0; player.body.velocity.y = 0; //player.body.setZeroVelocity(); //player.body.velocity.x = -20000; //player.body.velocity.y = -20000; //player.body.static = true; result = 'You last hit: The wall :)';'Message', 'text'); } update() { player.body.velocity.x = 0; player.body.velocity.y = 0; if (cursors.left.isDown) { player.body.velocity.x = -300; } else if (cursors.right.isDown) { player.body.velocity.x = 300; } if (cursors.up.isDown) { player.body.velocity.y = -300; } else if (cursors.down.isDown) { player.body.velocity.y = 300; } } Hello. I'm making a game where player have to reach the right door and created all the necessary collisions and it works almost perfect, except the call back function wrongDoor. I want to create a dialog line when player collides wrong door and make his velocity = 0 while dialog line is on screen, but I can't. Every time player colldes the door dialog line displays on screen but the player sprite still moves. How can I make him stop on collision with door? All the //commented stuff I've tried and it didn't help. I tried to add this function in Update function but it triggers wrongDoor all the time and displays dialog line again and again from the start of the game. I've tried set velocity = -20000 but it doesn't set -20000 velocity, like it doesn't see the player. On screenshots I press up and right buttons so character moves up and right after wrongDoor triggers.
  3. Hello, I am working on a project where i can drag an object in X-direction only(like in a abacus). Is it possible to drag objects in one direction only? I created a simple task where i can move two objects with mouse (link here). The issue is that objects are pushing inside each other if i drag one object to another. I need them to be hard like diamond. Can i achieve that with p2 js or i have to use box2d plugin (like here). Also is box2d will be availabe in phaser v3. Thanks
  4. hi all, I have a problem about the p2 body and sprite positon when I enable a p2 body to a sprite, I use fish.body.setRectangle(fish.width, fish.height); to set the body shape, but the position of body is far away from the sprite, anyone know what is the problem? thx
  5. Hi! What I'm trying to do is have 2 objects: one stuck on screen, and one moving with P2 physics. But from all my testing, what I've gotten down to is that I have 2 choices: 1. No collision between the objects, but able to detect when it goes out of screen or 2. Objects collide but can't detect when goes out of screen So my question is... How do I combine that? This is my code now: var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create }); function preload() { game.load.image('block', 'assets/block.png'); } function create() { game.stage.disableVisibilityChange = true; //keep running on lost focus, 0, 800, 600); game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.gravity.y = 250; //create objects var stuck = game.add.sprite(400, 350, 'block'); var stucknon = game.add.sprite(480, 150, 'block'); game.physics.p2.enable([stuck, stucknon]); stuck.body.static = true; } If I have the code for collision groups and collisions, then it will just fall through each other and not collide at all. The reason I'm using P2 is because I want the realistic/rotating gravity effect So what do I need to add to make the moving object ("stucknon") fall through the screen and then delete it?
  6. lewdoo

    Trouble with p2 bodies

    I'm having an issue with scaling a body down with p2, it would appear that the body has an anchor point that is different to the sprite it is for. This causes the body to move up and left when the sprite is shrunk and the body is scaled to match, thus displacing the sprite... any advice? Note that this only occurs when using a custom poly to create the body
  7. flow

    P2 physics momentum transfer

    I'm doing P2 physics collisions with: sprite.body.collides(collisionGroups, callback, this); and I'm trying to get some info on the momentum transfer of the collision to calculate damage, but I can't find the right values. What I've tried is to use the velocity difference like this: var impactSquare = Math.pow(p2BodyA.velocity.x - p2BodyB.velocity.x, 2) + Math.pow(p2BodyA.velocity.y - p2BodyB.velocity.y, 2); This works ok, but obviously it gives totally wrong values when the bodies fly towards each other and just barely touch, then deltaV is pretty high but there is basically no momentum transfer. Since there is no V_old and V_new (as far as I know) to get the change of velocity per sprite (pre and post collision) I've tried to look into using the deltaX values: dx = sprite.previousPosition.x - sprite.position.x ... but stopped there because it feels like an over-complicated and unreliable way to get something that should be somewhere in the data anyway Has anybody an idea where to look? Another (likely over-complicated) idea was to use the onBeginContact method to get the pre-collision velocity and store that somewhere so we can call it in the collides feedback, but ... well feels like there must be something simpler ...
  8. Hi all, I am recently developing a game which needs a physics bounds like a rounder rectangle. I looked through the docs but find no way to achieve that. Help me, thank you all~
  9. flow

    P2 physics child bug?

    I've played around with P2 physics and created a sprite that has a child attached that can (is supposed to) move freely around the parent. The child should still contribute to collisions with other objects so I gave it a P2 body as well, but it was behaving very odd. A closer look at the debug data revealed that the collision shape and the sprite image are not at the same position o_O in fact the collision shape is located at an absolute position in the world that relates to the relative coordinates between parent and child and does not move at all. Here is an example that you can try with the sandbox editor: game.physics.startSystem(Phaser.Physics.P2JS); var parent = game.add.sprite(200, 200, 'phaser'); game.physics.p2.enable(parent, true); parent.anchor.set(0.5); var child = game.make.sprite(100, 100, 'phaser'); game.physics.p2.enable(child, true); child.body.static = true; child.anchor.set(0.5); child.angle = 0; parent.addChild(child); If you look at the attached image you can see the offset. When dragging the parent around with the mouse the collision shape will stay at a fixed position, but it CAN collide with the parent. This issue might be related to an older discussion: Any ideas how we can fix this (that don't involve creating the child as a "free" sprite and let it follow the parent via the update() function)?
  10. Hi everybody, I'm working on my first Phaser based game and so far it's really a lot of fun One thing that keeps giving me some headaches from time to time though is that P2 physics is mostly incompatible with arcade and many tutorials only work with arcade. That seems to start with the sprite bitmaps where everything is rotated 90 degrees Usually I find some workarounds or I've replaced stuff completely like the Weapon plugin, but now I'm facing an issue with collisions where I'm not quite sure what's the best solution: Let's assume we have 2 player sprites and 2 enemy sprites and each of them has some bullets to fire. So we create 2 collision groups for the sprites and 2 for the bullets: var playerCG = game.physics.p2.createCollisionGroup(); var enemyCG = game.physics.p2.createCollisionGroup(); var playerBulletsCG = game.physics.p2.createCollisionGroup(); var enemyBulletsCG = game.physics.p2.createCollisionGroup(); player1.body.setCollisionGroup(playerCG); player1.body.collides([enemyCG, enemyBulletsCG]); p1Bullets.body.setCollisionGroup(playerBulletsCG); p1Bullets.body.collides([enemyCG]); player2.body.setCollisionGroup(playerCG); player2.body.collides([enemyCG, enemyBulletsCG]); p2Bullets.body.setCollisionGroup(playerBulletsCG); p2Bullets.body.collides([enemyCG]); enemy1.body.setCollisionGroup(enemyCG); enemy1.body.collides([playerCG, playerBulletsCG]); e1Bullets.body.setCollisionGroup(enemyBulletsCG); e1Bullets.body.collides([playerCG]); enemy2.body.setCollisionGroup(enemyCG); enemy2.body.collides([playerCG, playerBulletsCG]); e2Bullets.body.setCollisionGroup(enemyBulletsCG); e2Bullets.body.collides([playerCG]); So far so good, that works fine. But now we want to change the play-mode and want to activate "friendly fire" and "friendly collisions". If we add the playerBulletsCG to player1.body.collides(...) and playerCG to p1Bullets.body.collides(...) we get a problem when the bullets are fired from withing the collision box of a player because the players own bullets collide now with his sprite :-( Obviously we could create additional groups like player1CG, player2CG and player1BulletsCG, player2BulletsCG, but then we also have to add all these groups to the enemies and we need to come up with a whole new structure of initializing all these groups in case we want to support 4 players or more. So I was wondering if there is any method that says "collide with anything but your own bullets"? I'm open for any suggestions :-)
  11. I have used this phaser example as a starting point to build a game where shapes are dynamically dropped from the top of the screen and collide with each other: What I would like is for the shapes to stop bouncing and vibrating when they collide - but I'm not sure which settings to adjust to achieve this effect (and I've not had much luck with trial and error so far!). I have set gravity like this: game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.gravity.y = 6000; Here is my shapes/sprites json file: { "shapeOne": [ { "density": 2, "friction": 100, "bounce": 0, "filter": { "categoryBits": 1, "maskBits": 65535 }, "shape": [ 84, 76 , 0, 160 , 0, 0 , 84, 0 ] } , { "density": 2, "friction": 100, "bounce": 0, "filter": { "categoryBits": 1, "maskBits": 65535 }, "shape": [ 84, 76 , 314, 76 , 314, 160 , 0, 160 ] } ], "shapeTwo": [ { "density": 2, "friction": 100, "bounce": 0, "filter": { "categoryBits": 1, "maskBits": 65535 }, "shape": [ 0, 0 , 315, 0 , 315, 83 , 0, 83 ] } ], "shapeThree": [ { "density": 2, "friction": 100, "bounce": 0, "filter": { "categoryBits": 1, "maskBits": 65535 }, "shape": [ 0, 0 , 237, 0 , 237, 235 , 0, 235 ] } ] } Does anyone know the correct settings to adjust? Do I need to turn density up really high and friction low? And should gravity be high? Here is a screenshot of the shapes that are being dropped into the container:
  12. Hi I'm new to phaser and have been trying to use some of the examples as a starting point. I'm planning on using the "Pick Up Object" example, but restrict the area that the tetris shapes are placed in - so that they land on a solid platform. I would then add 3 x buttons to add more of the shapes onto the screen. Example here: Would the best way to achieve this be to build the solid platform using a kinematic sprite as documented here: If not, what is the best way define the area that the shapes are placed in - so they do not fall behind or in front of the platform and buttons? Thanks! Tom
  13. I have a mian body that moves freely on the board. To that body I want to attach a recrangle at a certain offset that would visibly dangle and rotate upon forces affecting the main body. How could I achieve that? I tried a set of springs, but I can't get the desired effect.
  14. When adding a rectangle to a p2 body you have the option to specify a rotation in radians for the shape which it appears is just passed directly on to the p2 shape constructor (hence the need for it to be in radians instead of degrees as are used elsewhere in Phaser). I find that if I use any value other than 0 for a rotation, the shape is properly rotated however drawing of the body via the debug parameter ignores the rotation. Here is a quick codepen illustrating the bug. The character should have a long protrusion coming out the bottom achieved with a rotated rectangle. The physics collision seems to indicate that the rotation has occurred correctly, however the debug shape is not drawn rotated. Notice that he appears to sit a little ways off the ground due to the un-rotated debug visualization of the shape. It seems to me this must be a bug (or maybe a limitation of the debugbody drawing system) but I thought I would post here first for thoughts. I will likely dig in and see if I can find a fix / workaround for this. Phaser P2 DebugBody rotation bug (codepen)
  15. rorymcg

    P2 sprite collision group pain

    Hi all, Been banging my head against the wall for ages with this. Default P2 collision works, I clearShapes() on each sprite to get rid of these boundary boxes and loadPolygon() to get my custom boundaries (defined in sprite_physics.json). However the collision groups appear not to be working as my player sprite goes straight through/under the enemy. Can anyone see where I'm going wrong? // in index.html (function() { var game = new Phaser.Game(1024, 768, Phaser.AUTO, null) game.state.add('Game', Game); game.state.start('Game'); })(); // in game.js var Game = function (game) { }; Game.prototype = { preload: function () {'player', 'assets/player.png');'enemy', 'assets/enemy.png');'sprite_physics', 'assets/sprite_physics.json'); }, create: function () {; this.playerCollisionGroup =; this.enemyCollisionGroup =; this.createPlayer(); this.createEnemy(); }, update: function () { // <snip> do some steering stuff </snip> }, createPlayer: function () { this.player =, + 300, 'player');, true); // so I can see the polygon's boundaries // Gets rid of current bounding box this.player.body.clearShapes(); // BUT THEN need to add collision cos default p2 collision is wiped with clearShapes() // Add boundary shape from PhysicsEditor this.player.body.loadPolygon('sprite_physics', 'player'); // Seems to do nothing :( this.player.body.setCollisionGroup(this.playerCollisionGroup); this.player.body.collides([ this.enemyCollisionGroup ]); }, createEnemy: function () { this.enemy =,, 'enemy');, true); this.enemy.body.clearShapes(); this.enemy.body.loadPolygon('sprite_physics', 'enemy'); this.enemy.body.setCollisionGroup(this.enemyCollisionGroup); this.enemy.body.collides([ this.playerCollisionGroup ]); } }
  16. Hello, I read this simple tutorial for beginners: Adventures in Phaser with TypeScript Physics using the P2 physics engine When two objects are in contact, the event "onBeginContact" must occur. But this does not happen. I moved the code to codepen:
  17. I'm making a game using Phaser, P2 physics and webpack. When it comes to P2 I can not use custom physic shapes because they won't collide with world bounds. I'm using Phaser webpack example template ( Templates/Webpack) and an example from the website ( The point is that when using custom colision shapes, entities won't collide. But they do if I use the default squared shapes or the circle ones that Phaser provide. The game code is simple and you can check it here: /** * Import Phaser dependencies using `expose-loader`. * This makes then available globally and it's something required by Phaser. * The order matters since Phaser needs them available before it is imported. */ import PIXI from 'expose-loader?PIXI!phaser-ce/build/custom/pixi.js'; import p2 from 'expose-loader?p2!phaser-ce/build/custom/p2.js'; import Phaser from 'expose-loader?Phaser!phaser-ce/build/custom/phaser-split.js'; var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); function preload() { game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.load.image('tetrisblock1', 'assets/sprites/tetrisblock1.png'); game.load.image('tetrisblock2', 'assets/sprites/tetrisblock2.png'); game.load.image('tetrisblock3', 'assets/sprites/tetrisblock3.png'); game.load.physics('physicsData', 'assets/physics/sprites.json'); } var tetris1; var tetris2; var tetris3; var mouseBody; var mouseConstraint; function create() { // Enable p2 physics game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.gravity.y = 1000; tetris1 = game.add.sprite(300, 100, 'tetrisblock1'); tetris2 = game.add.sprite(375, 200, 'tetrisblock2'); tetris3 = game.add.sprite(450, 300, 'tetrisblock3'); // Create collision group for the blocks var blockCollisionGroup = game.physics.p2.createCollisionGroup(); // This part is vital if you want the objects with their own collision groups to still collide with the world bounds // (which we do) - what this does is adjust the bounds to use its own collision group. game.physics.p2.updateBoundsCollisionGroup(); // Enable the physics bodies on all the sprites game.physics.p2.enable([ tetris1, tetris2, tetris3 ], false); tetris1.body.clearShapes(); tetris1.body.loadPolygon('physicsData', 'tetrisblock1'); tetris1.body.setCollisionGroup(blockCollisionGroup); tetris1.body.collides([blockCollisionGroup]); tetris2.body.clearShapes(); tetris2.body.loadPolygon('physicsData', 'tetrisblock2'); tetris2.body.setCollisionGroup(blockCollisionGroup); tetris2.body.collides([blockCollisionGroup]); tetris3.body.clearShapes(); tetris3.body.loadPolygon('physicsData', 'tetrisblock3'); tetris3.body.setCollisionGroup(blockCollisionGroup); tetris3.body.collides([blockCollisionGroup]); // create physics body for mouse which we will use for dragging clicked bodies mouseBody = new p2.Body();; // attach pointer events game.input.onDown.add(click, this); game.input.onUp.add(release, this); game.input.addMoveCallback(move, this); } function click(pointer) { var bodies = game.physics.p2.hitTest(pointer.position, [ tetris1.body, tetris2.body, tetris3.body ]); // p2 uses different coordinate system, so convert the pointer position to p2's coordinate system var physicsPos = [game.physics.p2.pxmi(pointer.position.x), game.physics.p2.pxmi(pointer.position.y)]; if (bodies.length) { var clickedBody = bodies[0]; var localPointInBody = [0, 0]; // this function takes physicsPos and coverts it to the body's local coordinate system clickedBody.toLocalFrame(localPointInBody, physicsPos); // use a revoluteContraint to attach mouseBody to the clicked body mouseConstraint =, [0, 0], clickedBody, [game.physics.p2.mpxi(localPointInBody[0]), game.physics.p2.mpxi(localPointInBody[1]) ]); } } function release() { // remove constraint from object's body game.physics.p2.removeConstraint(mouseConstraint); } function move(pointer) { // p2 uses different coordinate system, so convert the pointer position to p2's coordinate system mouseBody.position[0] = game.physics.p2.pxmi(pointer.position.x); mouseBody.position[1] = game.physics.p2.pxmi(pointer.position.y); } function update() { } function render() { // game.debug.text(result, 32, 32); } If you need to have a look at the project, you can check it here: Any toughts about why the collisions are not working when using custom collision shapes? Thanks in advance, Alex
  18. Lefota

    Polygon collision does not work

    Hi Everyone! Hopefully someone can help with the issue I have faced. I am building a simple racing game and want to implement collision between car and other objects. I am using p2 physics. When I create primitive body objects (e.g. body.setRectangle) collision works fine, but when i use polygon (body.loadPolygon) i have created in PhysicsEditor the car just rides throw these objects without any collisions. I have tried building very simple objects to exclude "holes" in collide, creating collision groups but unfortunately any of these things helped. Attaching my code and a screenshot Car class: export default class extends Phaser.Sprite { constructor ({ game, x, y, asset }) { super(game, x, y, asset) game.physics.p2.enable(this, true) this.anchor.setTo(0.5) this.body.clearShapes() this.body.loadPolygon('physicsData', 'car') this.body.angle = -90 this.cursors = game.input.keyboard.createCursorKeys() this.velocity = 0 } Obstacle code: create () { = 0.8 =, 0, 2880, 1620, 'map'), 0, 8640, 4860), 3) this.mapAbove =, 0, 'race'), true) this.mapAbove.body.clearShapes() this.mapAbove.body.loadPolygon('physicsData', 'race') = new Car({ game:, x: 3800, y: 3750, asset: 'car' }) } Also i am using this stuff as skeleton - Could troubles be in incorrect packages? Looking forward for Your reply, Thanks!
  19. Hi there, I'm working on some P2 physic and getting the attached result, which is weird because the two objects collides without overlapping on one another. I'm I missing something? The code is as follow: game.physics.enable(car, Phaser.Physics.P2JS); car.body.debug = true car.body.angle = car.angle car.body.rotation = car.rotation car.body.addCapsule(70,20) car.body.setCollisionGroup(this.carCollisionGroup); var v =100; var angle = car.body.angle; var vx = v * Math.cos(angle * (Math.PI/180)) var vy = v * Math.sin(angle * (Math.PI/180)) car.body.velocity.x = vx; car.body.velocity.y = vy; Thanks
  20. danecekpilar

    Online Body Editor Hi guys. during the development in Phaser i found out, that there is no simple online editor for Making Physics bodies for P2 physics in Phaser. So i came up with an simple idea. To do a simple online body editor to make json files for Phaser. I know its super simple and it could do much more things as other desktop body editors can do, but when you want just simple body in two minutes, i think its a good way. I took me less than two hour to do it, so dont judge it for bad appearance and not efficient solutions for the algorithm. Maybe ill do things like more bodies in one json file, or auto edge-tracer adn stuff like that, but fell free to comment and come up with your ideas to improve it for the future. So please, if have have anything to say to this, comment below, i would be pleased.
  21. Part 7 is here, concluding our series: Check out the demo: Thanks for the support throughout the series! Let me know if you want to see more tutorials like these ones.
  22. mrkstwrt

    Phaser P2 Physics fixedX/fixedY?

    When using p2.js bodies have fixedX and fixedY properties which prevents movement on the given axis. It seems to me that when using p2 physics in Phaser-CE I'm unable to access these properties on a sprite body although fixedX and fixedY exist inside the source (here). Am I doing something wrong? I've noticed DOES contain these properties although setting them to true has no effect.
  23. Andy R

    Physics P2 Collision equation

    Hi, i've 2 characters physics p2 enabled, they both can collide with each other, they are also static=False.Which mean that when one run toward another, the second get back and get some velocity. Which properties i've to set to get more control on this effect ? I tried editing masse/inertia but got had not good results. Any tips ? I'm also looking for an equation that show how the effect works depending on theses parameters. Thx
  24. scofieldly

    onbegincontact not work

    Hi all, I want to use p2 onbegincontact to detect 2 p2 body overlap and want to do some actions, I tried to write like this body1.onBeginContact.add(func, this); but it seems when it overlap another body, the callback func did not run. is there any tips for using this event, thanks.
  25. Part 5 of our series has arrived: Also check out the demo for this part: In this part you will learn how to add those awesome eyes to your snakes!