如何在OpenFL中将变换应用于图形

Question

我正在将一个JavaScript库转换为Haxe。在这个库中，有一个由许多形状构成的动画效果。所以我使用OpenFL库来渲染形状。

但现在我遇到了转型的技术问题。一些形状具有子形状，因此它的变换也应该应用于子形状。例如，请想象shapeC附在shapeB上，shapeB和shapeD也附在shapeA上。在这种情况下，shapeB，shapeD应该由transformA和它们自己的变换转换，shapeC也应该由transformA，transformB和transformC转换。

要实现这一点，在一个图形中渲染相同的水平形状并将父变换应用于该图形是一个很好的解决方案吗？ （在上面的示例中，将shapeB和shapeD渲染为一个图形，并将transformA应用于该图形）

我认为从所有父变换计算最终变换并不是一个很好的优化解决方案，并将其应用于该形状的所有顶点。请为我提供最佳的渲染解决方案。任何建议都将受到欢迎。

如果这个问题有任何疑惑，请原谅我，让我检查一下。

Answer 1

你可以使用Sprite类：

var parentShape = new Sprite ();
parentShape.graphics.beginFill (0xFF0000);
parentShape.graphics.drawRect (0, 0, 100, 100);

var childShape = new Sprite ();
childShape.graphics.beginFill (0x00FF00);
childShape.graphics.drawCircle (0, 0, 50);
childShape.x = 200;
childShape.y = 200;

parentShape.addChild (childShape);
addChild (parentShape);

每个形状都将使用自己的canvas元素，因此如果您创建了许多形状，您可以决定在准备好时将其展平为单个图像。这可以使用cacheAsBitmap或bitmapData.draw

parentShape.cacheAsBitmap = true;

...要么

removeChild (parentShape);

var bitmapData = new BitmapData (Math.ceil (parentShape.width), Math.ceil (parentShape.height), true, 0);
bitmapData.draw (parentShape);
var bitmap = new Bitmap (bitmapData);
addChild (bitmap);