PixiJS 更改图形对象颜色的最佳方法是什么？

Question

我试图让一个简单的方形对象根据不同的条件闪烁绿色、蓝色和红色。我知道在 PixiJS 中没有直接的方法来更改 Graphics 对象的颜色。目前，我创建了三个相同的图形对象，除了颜色。通过重叠这些对象并调整可见性，我能够完成闪烁的动画。

我想知道是否有更好的方法来“改变”颜色而不是用可见性欺骗它。

我当前的代码：

let square_red = new PIXI.Graphics();
square.beginFill(red, opacity);
square.lineStyle(lineStyle);
square.drawRect(0, 0, width, height);
square.position.set(x, y);

let square_green = new PIXI.Graphics();
square.beginFill(green, opacity);
square.lineStyle(lineStyle);
square.drawRect(0, 0, width, height);
square.position.set(x, y);

let square_blue = new PIXI.Graphics();
square.beginFill(blue, opacity);
square.lineStyle(lineStyle);
square.drawRect(0, 0, width, height);
square.position.set(x, y);

square_red.visible = true;
square_green.visible = false;
square_blue.visible = false;

Answer 1

您可以创建一个白色圆圈并更改其色调。

const circle = new PIXI.Graphics();
circle.beginFill(0xffffff);
circle.drawCircle(0, 0, 100);
circle.endFill();

circle.tint = 0xff0000;