javascript Phaser 3 动画

Question

我正在尝试在 Phaser 3 中制作一个简单的游戏。我有一个玩家类，我在我的 gameScene 的 create 函数中调用它。

播放器类：

class Player extends Phaser.Physics.Arcade.Sprite {
    constructor(scene, x, y, key, frame) {

        super(scene, x, y, key, frame);
        //the scene this game object will be added to

        this.scene = scene;
        //movement speed
        this.velocity = 500;
        //enable physics
        this.scene.physics.world.enable(this);
        //collisions with objects and player fix
        this.setImmovable(false);
        //bigger player
        this.setScale(2.5);
        //fix screen borders
        this.setCollideWorldBounds(true);
        //add player
        this.scene.add.existing(this);

        this.scene.cameras.main.startFollow(this);


        this.setVisible(true);
        // this.anims.create({
        //     key: 'walk-left',
        //     repeat: 0,
        //     frameRate: 10,
        //     frames: this.anims.generateFrameNames('playersoldier', {start: 3, end: 5})
        // });




    }
    update(cursors) {
        //controls
        if (cursors.left.isDown) {
            this.body.setVelocityX(-this.velocity);
            // this.walkLeft();

        } else if (cursors.right.isDown){
            this.body.setVelocityX(this.velocity);
        }

        if (cursors.up.isDown) {
            this.body.setVelocityY(-this.velocity);
        } else if (cursors.down.isDown){
            this.body.setVelocityY(this.velocity);
        }
    }

//     walkLeft(){
//         this.playersoldier = this.add.sprite(100, 100, 'playersoldier', 3);
//         this.playersoldier.setScale(5);
//         this.anims.create({
//             key: 'walk-left',
//             repeat: 0,
//             frameRate: 10,
//             frames: this.anims.generateFrameNames('playersoldier', {start: 3, end: 5})
//         });
//         this.playersoldier.play('walk-left', true);
//     }
 }

这些我在 Gamescene 文件中的 mz create 函数中调用。

    createPlayer(){
        this.player = new Player(this, 500, 100, 'playersoldier');
    }

    createInput(){
        this.cursors = this.input.keyboard.createCursorKeys();
    }

我只是不能让它移动:(有一些注释代码，它不起作用。并抛出错误说，我不能调用 .sprite 等。当我单独尝试动画时。没有播放器和控件，它工作正常. 我只是不知道如何将它实现到播放器对象。 有什么建议么？ 如果有任何有用的建议，我会很高兴。

非常感谢您的宝贵时间。

Answer 1

好吧，我终于找到了解决方案。如果有人会遇到这个问题。 您所要做的就是将super.update{} 添加到您想要动画的播放器类的更新函数中。 scene.anims.create({}) 在构造函数本身中被调用。在更新功能中，当按下键时，您将添加this.scene.anims.play('animation')

class Player extends Phaser.Physics.Arcade.Sprite {
    constructor(scene, x, y, key, frame) {

        super(scene, x, y, key, frame);
        //the scene this game object will be added to

        var klic = key;

        this.scene = scene;
        this.velocity = 500;
        this.scene.physics.world.enable(this);
        this.setImmovable(false);
        this.setScale(2.5);
        this.setCollideWorldBounds(true);
        this.scene.add.existing(this);

        scene.anims.create({
            key: 'player-left',
            frames: scene.anims.generateFrameNames(klic, {
                frameRate: 0,
                start: 3,
                end: 5,
                repeat: -1
            }),
        })

        scene.anims.create({
            key: 'player-down',
            frames: scene.anims.generateFrameNames(klic, {
                frameRate: 0,
                start: 0,
                end: 2,
                repeat: -1
            }),
        })

        scene.anims.create({
            key: 'player-right',
            frames: scene.anims.generateFrameNames(klic, {
                frameRate: 0,
                start: 6,
                end: 8,
                repeat: -1
            }),
        })

        scene.anims.create({
            key: 'player-up',
            frames: scene.anims.generateFrameNames(klic, {
                frameRate: 0,
                start: 9,
                end: 11,
                repeat: -1
            }),
        })

        this.scene.cameras.main.startFollow(this);


        this.setVisible(true);

    }

    update(cursors) {
        super.update
        {
            this.body.setVelocity(0);
            //controls

            if (cursors.left.isDown) {
                this.body.setVelocityX(-this.velocity);
                this.anims.play('player-left', true);

            } else if (cursors.right.isDown) {
                this.body.setVelocityX(this.velocity);
                this.anims.play('player-right', true);
            }

            if (cursors.up.isDown) {
                this.body.setVelocityY(-this.velocity);
                this.anims.play('player-up', true);
            } else if (cursors.down.isDown) {
                this.body.setVelocityY(this.velocity);
                this.anims.play('player-down', true);
            }
        }
    }
 }

这就是它现在的样子，它正在工作:)