Question

var meteors;
var invader1;
var config = {
    type: Phaser.AUTO,
    width: 800,
    height: 500,
    // backgroundColor: "#5f2a55",
    physics: {
        default: 'arcade',
        arcade: {
            gravity: { y: 1 },
            debug: true
        }
    },
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

var game = new Phaser.Game(config);

//var group={};
function preload() {
    this.load.spritesheet('fire', 'meteor.png', {
        frameWidth: 32,
        frameHeight: 32
    });
    this.load.image('ground', 'platform.png');
}

function create() {
    //meteors = game.add.group();

    ground = this.physics.add.staticImage(400, 470, 'ground');
    ground.setDisplaySize(790, 50);
    ground.setSize(790, 50);
    ground.setOffset(-190, -8);

    meteors = this.physics.add.group({
        key: 'fire',
        frames: this.anims.generateFrameNumbers('fire', { start: 0, end: 6 }),
        repeat: 13,
        setXY: { x: 32, y: 100, stepX: 40 }
    });

    this.physics.add.collider(meteors, ground);
}

function update() {
    console.log(meteors);
}

<!DOCTYPE html>
<html lang="en">
    <head>
        <script src="https://cdn.jsdelivr.net/npm/phaser@3.15.1/dist/phaser-arcade-physics.min.js"></script>

        <style>
            canvas {
                margin: auto;
                border: 5px solid rgb(185, 184, 184);
                border-radius: 3px;
            }
        </style>
    </head>
    <body>
        <script src="tests.js"></script>
    </body>
</html>

我只是从第3阶段开始，我想创建一个模拟流星的方法，我设法创建了流星，并且它们确实按计划落到了地面上，但是我无法对流星进行动画处理。 ...流星的Spritesheet确实有效，我已经对其进行了测试，并且可以正常工作，因此我无法为一组Sprite（流星）设置动画。下面的代码基本上是从“使您的第一个游戏在Phaser中”复制而来的。流星精灵存储在称为“流星”的数组中。我没有添加“ this.anims.play（“ fire”）“，因为它使所有内容崩溃了。

meteors = this.physics.add.group({
    key: 'fire',
    frames: this.anims.generateFrameNumbers('fire', { start: 0, end: 6 }),
    repeat: 13,
    setXY: { x: 32, y: 100, stepX: 40 }
});

this.physics.add.collider(meteors, ground);

我想在phaser.js中一次移动多个精灵

0 个答案: