How to make GameObject push another GameObject

[emily2278]

Hello, I just started learning Phaser 3, 2 days ago so I am very new.

I am currently using the latest version of Phaser 3, developing using webpack and npm to bundle and serve to a Firefox browser.

Right now, I'm trying to create a game where the main character (ninja) is being controlled by the user's cursor. How I have done this, is basically when the cursor moves, the character sprite will move along with it.

this.input.on('pointermove', function (pointer) {
            this.ninja.x = pointer.x;
            this.ninja.y = pointer.y;
}, this);

this.ninja.body.setAllowGravity(false);

Right now I also have a small frog character on the platform, and I want to make it such that the user can use the cursor (ninja) to push the frog. However, the 2 GameObjects (frog and ninja) simply overlap and there is no "pushing" physics occurring.

• I have enabled physics and gravity in the game config
• I have added physics to the respective sprites
• I have added colliders for both the ninja and the frog

Here is the code for the above mentioned things that I have added

this.frog = this.physics.add.sprite(400, 400, 'frog');
this.frog.setCollideWorldBounds(true);

this.ninja = this.physics.add.sprite(game.config.width / 2 - 16, game.config.height / 2 - 16, 'ninja');
this.ninja.body.setAllowGravity(false);
this.ninja.setCollideWorldBounds(true);

this.physics.add.collider(this.ninja, this.frog);

Below is a screenshot of what I have so far, basically the large sideways frog is the ninja, and the small box at the bottom is a small frog, and I want the ninja to be able to push the frog, however the colliders just overlap and no "pushing" occurs.

Does anyone know if there is any way to make it such that: floating GameObjects controlled by the cursor are able to push other GameObjects in the scene?

Edited May 14, 2021 by raniceyue
Add more code details for clarity and to get better help

[Horizonicblue]

You need to add sprites using physics and add collider for the two sprites.

Check this simple example it should help you resolve your issue https://phaser.io/examples/v3/view/physics/arcade/circular-body

Also try to post more of your code for better insight

[emily2278]

8 hours ago, Horizonicblue said:

You need to add sprites using physics and add collider for the two sprites.

Check this simple example it should help you resolve your issue https://phaser.io/examples/v3/view/physics/arcade/circular-body

Also try to post more of your code for better insight

Hi sir,

Thank you so much for the feedback. I have amended the post accordingly to include more code details.

I have actually implemented all the things in the simple example, but am unable to get the same results. I am not sure if it has something to do with the ninja's position always following the cursor's position.

[Horizonicblue]

Yes you are right the cursor's position is directly assigned to ninja and maybe that's making it ignore collision.

I would suggest use something like 

this.ninja.body.velocity.copy(pointer.velocity).scale(5);

or

this.physics.moveToObject(ninja, pointer, 240);

inside the pointer move function instead of directly assigning x/y values and see if that serves your purpose (also try adjusting speed values as per your need)