Sign in to follow this  
Faizy

Collision isnt working

Recommended Posts

EDIT: THIS PROBLEM WAS SOLVED BY CUDABEAR ALREADY!. The fifth post includes a new problem in the same context though!

 

Could someone explain me why the collision isnt working? I expect(want) the "player.image" and "enemy.image" to not go "through" each other. What am I missing? Both(player.image and enemy.image) have the Aracde engine enabled.

//window.location.reload(true) //Clear Cache
var player;
var enemy;

var game = new Phaser.Game(800, 600, Phaser.Auto, '', 
	{
		preload: preload,
		create: create,
		update: update
	}
);

function preload() {
	game.load.image('player', 'assets/playerDefault.png')
	game.load.image('enemy', 'assets/enemyDefault.png')
}

function create() {
	game.stage.backgroundColor = '#3598db'
	game.physics.startSystem(Phaser.Physics.ARCADE);

	player = new Player();
	enemy = new Enemy();
}

function update() {
	game.physics.arcade.collide(player.image, enemy.image);

	if (player.cursor.left.isDown) {
		player.image.position.x -= 10;
	}
	else if (player.cursor.right.isDown) {
		player.image.position.x += 10;
	}
	else if (player.cursor.up.isDown) {
		player.image.position.y -= 10;
	}
	else if (player.cursor.down.isDown) {
		player.image.position.y += 10;
	}
}

Enemy = function () {
    var x = game.world.randomX;
    var y = game.world.randomY;

    this.health = 3;
    this.image = game.add.sprite(x, y, 'enemy');

    game.physics.arcade.enable(this.image);
}

Player = function() {
	var x = 200;
	var y = 75;

	this.health = 10;
	this.image = game.add.sprite(x, y, 'player');
	
	game.physics.arcade.enable(this.image);
	this.image.body.collideWorldBounds = true;
	this.cursor = game.input.keyboard.createCursorKeys();
};

 

Thank you :)

Share this post


Link to post
Share on other sites

A common mistake!

Your problem is here:

if (player.cursor.left.isDown) {
		player.image.position.x -= 10;
	}
	else if (player.cursor.right.isDown) {
		player.image.position.x += 10;
	}
	else if (player.cursor.up.isDown) {
		player.image.position.y -= 10;
	}
	else if (player.cursor.down.isDown) {
		player.image.position.y += 10;
	}
}

 

When working with physics, you can't directly move sprites around with their positional values and expect them to collide with other sprites.  The reason for this is physics calculations require velocity, and if you directly move things around the velocity of these objects is 0, so no calculation can be done.

Change your code to something like this

if (player.cursor.left.isDown) {
	player.image.body.velocity.x = 10;
}
else if (player.cursor.right.isDown) {
	player.image.body.velocity.x = 10;
} 
else {
    player.image.body.velocity.x = 0;
}

if (player.cursor.up.isDown) {
	player.image.body.velocity.y = 10;
}
else if (player.cursor.down.isDown) {
	player.image.body.velocity.y = 10;
} 
else {
    player.image.body.velocity.y = 0;
}


And the collisions should work.  Also, position calculated via velocity is weird and might not be the same as moving sprites directly, so you might need to fidgit with the number 10 to something that feels better for your game.

Good luck!

Share this post


Link to post
Share on other sites

Hi Cudabear,

I changed my code like you suggested and it works perfectly fine now - thanks :)

 

Is it actually somewhere descibed, or at least some information about the fact, that ARACDE PHYSICS need velocity to work? I couldn´t find anything about this in the API Documentation.

 

Share this post


Link to post
Share on other sites

I personally ran into this problem when I first started learning Phaser and I've helped dozens of people through it as well over the years, so it leads me to think there's a gap in the documentation there.  However, the examples do clearly show you need to use velocity, so who knows.  I think it's just an easy hole to fall in when first using Phaser, when you start with moving positionally and then try to throw in collision you naturally think your positional moving logic will just work.  If more tutorials skipped positional moving and just did stuff with velocity/tweens it would probably be less of an issue, but you never know.

Share this post


Link to post
Share on other sites

Thanks.

I got a new problem now though. Code:

//window.location.reload(true) //Clear Cache
var player, enemy;
var playerMovementX = 10;
var playerMovementY = 10;
var playerMovementStandbyX = 3;
var playerMovementStandbyY = 3;

var game = new Phaser.Game(800, 600, Phaser.Auto, '', 
	{
		preload: preload,
		create: create,
		update: update
	}
);

function preload() {
	game.load.image('player', 'assets/playerDefault.png')
	game.load.image('enemy', 'assets/enemyDefault.png')
	game.load.image('playerBullet', 'assets/playerBullet.png')
}

function create() {
	game.stage.backgroundColor = '#3598db'
	game.physics.startSystem(Phaser.Physics.ARCADE);
	
	player = new Player();
	enemy = new Enemy();
}

function update() {
	//Collision
	game.physics.arcade.collide(player.image, enemy.image, null, null, null);
	game.physics.arcade.collide(player.weapon.bullets, enemy.image, enemyKill, null, null);

	//Player: movement
	player.image.rotation = game.physics.arcade.angleToPointer(player.image)

	if (player.left.isDown) {
		player.image.body.velocity.x -= playerMovementX;
	}
	else if (player.right.isDown) {
		player.image.body.velocity.x += playerMovementX;
	} 
	/*else {
		player.image.body.velocity.x = playerMovementStandbyX;
	}*/
	
	if (player.up.isDown) {
		player.image.body.velocity.y -= playerMovementY;
	}
	else if (player.down.isDown) {
		player.image.body.velocity.y += playerMovementY;
	} 

	//Player: fire
	if (game.input.activePointer.leftButton.isDown) {
		console.log("Fire")
		player.weapon.fire();
	}
}

Enemy = function () {
    var x = game.world.randomX;
    var y = game.world.randomY;

    this.health = 3;
    this.image = game.add.sprite(x, y, 'enemy');
    game.physics.arcade.enable(this.image);
    this.image.body.collideWorldBounds = true;
}

Player = function() {
	var x = game.world.centerX -25;
	var y = game.world.centerY -25;
	
	this.left = game.input.keyboard.addKey(Phaser.KeyCode.A)
	this.right = game.input.keyboard.addKey(Phaser.KeyCode.D)
	this.up = game.input.keyboard.addKey(Phaser.KeyCode.W)
	this.down = game.input.keyboard.addKey(Phaser.KeyCode.S)
	this.fireButton = game.input.keyboard.addKey(Phaser.KeyCode.SPACEBAR);

	this.health = 10;
	this.image = game.add.sprite(x, y, 'player');
	this.image.anchor.setTo(0.5, 0.5)
	game.physics.arcade.enable(this.image);
	this.image.body.collideWorldBounds = true;
	
	this.weapon = game.add.weapon(30, 'playerBullet');
	this.weapon.bulletKillType = Phaser.Weapon.KILL_WORLD_BOUNDS;
	this.weapon.bulletSpeed = 600;
    this.weapon.fireRate = 100;
    this.weapon.trackSprite(this.image, 0, 0, true);
};

function enemyKill(bullet, enemy) { 
	enemy.kill();
}

 

 

 

If the players bullets(player.weapon.bullets) collide with the enemy(enemy.image) the function enemyKill should be executed as a callback:

function update() {
	//Collision
	game.physics.arcade.collide(player.image, enemy.image, null, null, null);
	game.physics.arcade.collide(player.weapon.bullets, enemy.image, enemyKill, null, null);

The collision signal works fine. However, the function will kill the bullet when it has enemy.kill() in it and will kill the enemy when it has bullet.kill().

function enemyKill(bullet, enemy) { 
	enemy.kill();
}

This doesnt makes sense to me, since the API Documentation says on the callback:

"An optional callback function that is called if the objects collide. The two objects will be passed to this function in the same order in which you specified them, unless you are colliding Group vs. Sprite, in which case Sprite will always be the first parameter."

 

Could someone help me out?

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.