Flash AS3：带有 copyPixels 的打字机效果

Question

我正在制作基于 Flash AS3 的游戏，并且正在构建自定义字体系统。它是这样工作的：BitmapData class 从库 (FontSource) 中获取一个 PNG 文件，在给定字符串中的每个字符之间循环，然后从函数 (getOffset) 中获取图像中的 x、y、宽度和高度)，然后使用 copyPixels 绘制自定义字体文本。

代码如下：

public function draw(str) {
    var png = new FontSource(480, 32);
    var offsets;
    var char;
    var rect;
    var x;
    var y;

    this.lock();
    for (var i = 0; i < str.length; i++) {
        char = str.substr(i, 1);
        offsets = getOffsets(char);

        rect = new Rectangle(offsets[0], offsets[1], offsets[2], offsets[3]);
        this.copyPixels(png, rect, new Point(x, y));
        x += offsets[2];
    }

    this.unlock();
}

现在，这里的问题是：我正在基于 ENTER_FRAME 事件构建打字机效果 class；每个新帧，一个新字符被添加到一个字符串中。所以，我想问一下这些方法中哪一种在性能方面做得更好：

1) 调用 draw() 重绘整个 BitmapData 每帧。

2) 制作一个 alpha 蒙版并在每一帧扩展它的宽度。

3) 制作单独的对象并将它们添加到每一帧的场景中。

感谢您的宝贵时间。

Answer 1

或者，您不需要重新绘制整个字符串。您可以在其末尾绘制更多字符。我将按如下方式实现它：给位图文本字段一个字符串，它应该每帧绘制一次。它清除，然后在每次进入帧事件时它只将绘制的字符串的长度加 1，并且只绘制一个字符。为此，只需在 class 中保存更多数据即可。例如：

public class BTF extends Sprite {
    private var str:String;
    private var source:FontSource; // set once!
    private var bd:BitmapData; // the one that'll get drawn
    private var lastIndex:int;
    private var lastX:int; // coords to draw next symbol to
    // assuming Y is always 0 - adjust per font
    public function BTF(source:FontSource,width:int,height:int) {
        this.source=source;
        bd=new BitmapData(width,height,0x00808080,true); // check if I didn't mix up parameters
        addChild(new Bitmap(bd)); // make it be drawn on your BTF
    }
    ... // rest of class skipped
    public function onEnterFrame(e:Event):void { 
        if (lastIndex>=str.length) return; // drawn all text already
        var c:char=str.charAt(lastIndex++); // get next char to draw
        var r:Rectangle=source.getOffsets(c); // you need to specify source for that - it's font that gives you bounds
        bd.copyPixels(source.fontBitmapData,r,new Point(lastX,0)); // draw that char
        lastX+=r.width; // move "cursor"
    }

Flash AS3：带有 copyPixels 的打字机效果

Flash AS3: Typewriter effect with copyPixels

actionscript-3

flash

flash-cs3