Body going outside sprite when moving fast

[Martiny]

Well, I'm having this situation in my game. When moving too fast, the sprite body goes off the image. It happens when moving slowly as well, but in a smaller scale (only the hair is off the collision then). 

 

(1) - Not moving.

(2) - Moving right 20px at a time in the update function.

(3) - This is what happens when I'm colliding with the WorldBounds. This happens as long as the keyboard key responsible for moving is down.

 

 

Here's the game code:

var game = new Phaser.Game(1200, 400, Phaser.CANVAS, 'game', { preload: preload, create: create, update: update, render: render}); function preload() {	game.load.image('hero', 'assets/hero.png');	game.load.image('background', 'assets/background.png')}  var hero,   	 speed = 20.5, 	 facing = "left", 	 background;function create() {	game.world.setBounds(0, 0, 2000, 400);	background = game.add.sprite(0, 1, 'background');	hero = game.add.sprite(200, 289, 'hero');	hero.anchor.setTo(0.5, 0.5);	hero.body.collideWorldBounds = true;	game.camera.follow(hero);} function update() {	if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT) || game.input.keyboard.isDown(Phaser.Keyboard.A)) {		hero.x -= speed;		if (facing != "left") {			hero.scale.x *= -1;			facing = "left";		}	}	else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT) || game.input.keyboard.isDown(Phaser.Keyboard.D)) {		hero.x += speed;		if (facing != "right") {			hero.scale.x *= -1;			facing = "right";		}		}}function render () {game.debug.renderSpriteBody(hero);}

When the camera is following the player (hero), the body is perfectly fitting the image.

 

Am I using this correctly? Thanks for the attention. I can upload the game folder somewhere if necessary.

[rich]

If you want to use the physics body then you need to move the player using physics too, i.e. don't set the .x value directly on the sprite but use velocity/acceleration on the body instead.

 

Edit: If you need an example the recent tutorial we posted shows exactly how.