Flash AS3:带有 copyPixels 的打字机效果
Flash AS3: Typewriter effect with copyPixels
我正在制作基于 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) 制作单独的对象并将它们添加到每一帧的场景中。
感谢您的宝贵时间。
或者,您不需要重新绘制整个字符串。您可以在其末尾绘制更多字符。我将按如下方式实现它:给位图文本字段一个字符串,它应该每帧绘制一次。它清除,然后在每次进入帧事件时它只将绘制的字符串的长度加 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 的游戏,并且正在构建自定义字体系统。它是这样工作的: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) 制作单独的对象并将它们添加到每一帧的场景中。
感谢您的宝贵时间。
或者,您不需要重新绘制整个字符串。您可以在其末尾绘制更多字符。我将按如下方式实现它:给位图文本字段一个字符串,它应该每帧绘制一次。它清除,然后在每次进入帧事件时它只将绘制的字符串的长度加 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"
}