moveToObject sprite animation on Phaser 3

user_13213357 0
Viewed 73

I have a character that has a click to point movement. I'm using MoveToObject I want to implement an animation to the sprite based on the direction it's moving similar to this code snippet below

if (this.cursors.left.isDown)
{
    this.player.setVelocity(-speed, 0)
    this.player.play('left-walk', true)
}
else if (this.cursors.right.isDown)
{
    this.player.setVelocity(speed, 0)
    this.player.play('right-walk', true)
}
else if (this.cursors.up.isDown)
{
    this.player.setVelocity(0, -speed)
    this.player.play('up-walk', true)
}
else if (this.cursors.down.isDown)
{
    this.player.setVelocity(0, speed)
    this.player.play('down-walk', true)
}

I'm guessing getting the current angle of the sprite but I can't seem to make it work. Thank you

phaser-framework javascript
1 Answers

I have solved the following problem. Thank you!

 angles = Phaser.Math.Angle.BetweenPoints(avatar, target)
        var newAngles = Phaser.Math.RadToDeg(angles)
        console.log(newAngles)

        if (avatar.body.speed > 0)
        {
            if(newAngles <= -45 && newAngles >= -135) {
            avatar.anims.play('back', true)
            } else if (newAngles <= 45 && newAngles >= -45) {
                avatar.flipX = true
                avatar.anims.play('side', true)
            } else if (newAngles <= 135 && newAngles >= 45) {
                avatar.anims.play('front', true)
            } else if (newAngles <= 225 && newAngles >= 135) {
                avatar.flipX = false
                avatar.anims.play('side', true)
            }
            
            
            
            if (distance < 4)
            {
                avatar.anims.pause()
                avatar.body.reset(target.x, target.y);                
            }
        }
user_132133570
Related