Actionscript 3 AS3使用画笔绘制线PNG图像图案

此功能存在于Adobe Illustrator或Painter等桌面程序中

您可以选择一个画笔，它是图像的图案。开始在画布上绘制时，将显示从一组不同大小和旋转的图像创建的线（或任何图案）。大概是我在图片中描绘的（红线是画笔运动的路径）

---

是否已经有用于此效果的库，或者如何最好地实现此效果？

侦听

MouseEvent。在绘图画布上单击鼠标

，一旦触发，添加一个

事件。输入\u FRAME

开始绘图。绘图本身非常简单-在每一帧上，您都会获取mouseX和mouseY值，并在画布上的确切位置添加PNG图像，并对该特定图像进行任何变换（缩放、旋转、alpha）。下面是一个简单的例子：

private var PatternPNG:Class;
private var canvas:Sprite;

private function init() {
  canvas = new Sprite();
  addChild(canvas);
  canvas.graphics.beginFill(0xFFFFFF);
  canvas.graphics.drawRect(0,0,CANVAS_WIDTH,CANVAS_HEIGHT);
  canvas.graphics.endFill();
  canvas.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
}
private function onMouseDown(e:Event):void
{
  canvas.removeEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
  canvas.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
  canvas.addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
private function onMouseUp(e:Event):void
{
  canvas.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
  canvas.removeEventListener(MouseEvent.MOUSE_UP, onMouseUp);
  canvas.removeEventListener(Event.ENTER_FRAME, onEnterFrame);
}
private function onEnterFrame(e:Event):void
{
  var patternPiece:DisplayObject = new PatternPNG();
  patternPiece.rotation = Math.random() * 360;
  patternPiece.alpha = Math.random();
  patternPiece.scaleX = patternPiece.scaleY = 0.2 + Math.random() * 0.8;
  patternPiece.x = mouseX;
  patternPiece.y = mouseY;
  canvas.addChild(patternPiece);
}

---

小心，在enterFrame循环中添加子项很快就会用精灵填满你的记忆。您应该在bitmapData（bitmapData.draw（））中复制画布，在位图中显示它，并在每次迭代时清空画布。我建议在MouseUp中（笔划后）将画布绘制为位图，因为在每个帧上绘制也可能会耗费大量资源。或者至少在某些点（例如，当画布有100个或更多子对象时）。