Phaser 3中使用圆形进行物理分组。

Question

Phaser 3中使用圆形进行物理分组。

3

我对Phaser还比较新，正在按照这个教程进行学习：https://www.codecaptain.io/blog/game-development/shooting-bullets-phaser-3-using-arcade-physics-groups/696

不过，我想让Laser变成一个简单的圆形，而不是一个Sprite，所以我尝试了以下代码：

export class Laser extends Phaser.Physics.Arcade.Body {
    constructor(scene: Phaser.Scene, x: number, y: number) {
        const c = new Phaser.GameObjects.Ellipse(scene, x, y, 25, 25, 0x00ff00);

        super(scene.physics.world, c);
    }
}

这只是抛出了以下错误 Uncaught TypeError: child.addToDisplayList is not a function。

我是否遗漏了一些基础知识？我似乎只能使用 Phaser.Physics.Arcade.Sprite 或 Phaser.Physics.Arcade.Image。不可能只有由多个矩形或圆组成的物理对象吗？

- Mike

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- winner_joiner · Accepted Answer

你已经接近成功了，只需要将"Laser"GameObject添加到场景中，然后将GameObject添加到物理世界中，它就可以工作了。

你只需要进行一些微小的调整，就可以让它按照预期工作。

(更新代码)这里有一个简短的可运行演示：

document.body.style = 'margin:0;';

class Laser extends Phaser.Physics.Arcade.Body {
    constructor(scene, x, y) {
        
        // add object to the scene, so that it can be displayed
        const c = scene.add.ellipse( x, y, 25, 25, 0x00ff00);
        
        // create the actual body
        super(scene.physics.world, c);
        
        // add Body to world
        scene.physics.add.existing(c)
    }
}

class Laser2 extends Phaser.GameObjects.Ellipse {
    constructor(scene, x, y) {
        super(scene, x, y, 25, 25, 0xff0000);
        
        //give the GameObject a Physics body
        scene.physics.add.existing(this)
    }
}

var config = {
    type: Phaser.AUTO,
    width: 536,
    height: 183,
    physics: {
        default: 'arcade',
        arcade: {            
            gravity:{ y: 100 },
            debug: true
        }
    },
    scene: {
        create
    },
    banner: false
}; 

function create () {
    this.add.text(10,10, 'Falling balls- red are from a Group')
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});

    // create a laser
    let laser = new Laser(this, 50, 50)
    
    // create second  laser with a phaser group
    let group = this.physics.add.group({  classType: Laser2});
    
    group.createMultiple({max: 30})
      
    let groupBall = group.create(150, 10)
    
    // Or simply like this
    // groupBall.body.setVelocityY (150)
    groupBall.body.setVelocity(0, 150)
    
    let groupBall2 = group.create(200, 10)
    
    groupBall2.body.setVelocityY(200)
      
}

new Phaser.Game(config);

<script src="//cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"></script>

警告：如果您没有使用 sprite 或 image，而是使用了一个 physics-group，请注意，因为不能使用组对象的所有属性。查看文档以确保安全。