Phaser3：如何创建带有文本的图形？

Question

我在我的 Angular 项目中使用 Phaser3，到目前为止我设法创建了一个图形方块和一个文本。然而，将它们分开对待似乎很复杂和平凡。有没有一种方法可以创建一个允许我将图形形状和文本集成在一起的对象？

这是我当前的代码：

    this.graphics = this.add.graphics();
    this.graphics.lineStyle(1,0xff0000);
    this.graphics.fillStyle(0x02455f, .5);
    this.graphics.strokeRect(100,200,250,250);
    this.graphics.fillRect(100,200,250,250);
    this.helloWorld = this.add.text(
      225,
      300,
      "Hello World", {
        font: "40px Arial",
        color: "#ffffff"
      }
    );

上面的代码创建了一个正方形和一个文本，我将它们放置在彼此靠近的位置，这是它的样子： What the code has shown

我想将其视为独立的事物，但当它按原样编码时我不能，是否有更好的选择来创建允许我添加两种样式的单个对象？

Answer 1

我建议使用Phaser.GameObjects.Container

A Container Game Object.

A Container, as the name implies, can 'contain' other types of Game Object. When a Game Object is added to a Container, the Container becomes responsible for the rendering of it.

[...]

If you modify a transform property of the Container, such as Container.x or Container.rotation then it will automatically influence all children as well.

Phaser3：如何创建带有文本的图形？

Phaser3: How to create a Graphic with text?

angularjs

typescript

phaser-framework