HaxeFlixel：将图形叠加到单个 Sprite 中

Question

我有代码通过拉动每个单独的身体/服装项目并以特定顺序覆盖它来生成玩家头像精灵表。 本质上，我是在尝试通过将衣物叠放在一起将它们组合成一个整体。

但最终输出的只是最后一件画出来的衣服。

这是我用来做这件事的两段代码：

public function new(_username:String) 
{
    super();

    itemArray = new Array<String>();
    itemArray[0] = "Body";
    itemArray[1] = "Shoes";
    this.pixels = new BitmapData(Std.int(itemRect.width), Std.int(itemRect.height));

    for (itemName in itemArray)
    {
        //this.pixels.draw(prepareItem(itemName).pixels);
        var itemSprite:FlxSprite = prepareItem(itemName);
        stamp(itemSprite);
    }
}

private function prepareItem(assetName:String):FlxSprite
{
    var assetSprite:FlxSprite = new FlxSprite();
    assetSprite.loadGraphic("assets/images/" + assetName + ".png");

    assetSprite.pixels.threshold(assetSprite.pixels, itemRect, new Point(0, 0), "==", 0xFF00FF00);
    assetSprite.pixels.threshold(assetSprite.pixels, itemRect, new Point(0, 0), "==", 0xFFFF0000);

    return assetSprite;
}

如您所见，我尝试使用draw() 将像素绘制到现有的BitmapData 上，并且我还尝试标记从衣服图像生成的精灵。

我附上一个例子来阐明我的目标。注意鞋子是如何在身体上分层的。但是按照我目前的代码，鞋子完全取代了身体。

Answer 1

但最终输出的只是最后一件画出来的衣服。

使用您的代码，我实际上看到两个资产被叠加 - 我猜根据您使用的资产，这可能并不明显。

解决方法很简单：您需要在 stamp() 调用中偏移后续精灵，例如如果你想垂直堆叠资产，像这样：

var currentY = 0;
for (itemName in itemArray)
{
    var itemSprite:FlxSprite = prepareItem(itemName);
    stamp(itemSprite, 0, currentY);
    currentY += Std.int(itemSprite.height);
}