如何在中心小精灵中缩放(翻转).js

Question

我想从中心翻转Pixi.js中的DisplayObjectContainer。我发现缩放到 -1 适用于翻转，但我无法让它从中心这样做，就像您对精灵使用锚点一样。我还找到了这个链接，它解释了我在WebGL方面要做的事情，但当然，我正在尝试在Pixi的更高层次上做到这一点。有什么想法吗？

谢谢

Answer 1

我想你有几个选择，保持高水平。希望有一个适合您的特定情况。

1：翻转容器，然后偏移位置：

container.scale.x *= -1;
container.position.x = centerX - container.scale.x * containerWidth / 2;

请参阅此工作示例：http://codepen.io/ianmcgregor/pen/BmbHe

2：将内容居中置于 DisplayObjectContainer 中：

var content = new PIXI.Sprite(texture);
content.position.x = 0 - content.width / 2;
container.addChild(content);
container.scale.x *= -1;

3：使用精灵代替 DisplayObjectContainer。这种方法的缺点是它需要有纹理。