先来看下效果:
实现的代码主要应用了Bitmap操作,主要步骤是:
1. 生成BitmapData和Bitmap
2. 克隆BitmapData
3. 使它淡出并模糊
4. 绘制黑色圆形的笔刷
5. 应用Matrix变换笔刷,放大并根据鼠标的水平位置旋转
6. 将克隆的BitmapData绘制到BitmapData
7. 循环以上步骤
package { import flash.display.Bitmap; import flash.display.BitmapData; import flash.display.Shape; import flash.display.Sprite; import flash.display.StageAlign; import flash.display.StageScaleMode; import flash.events.Event; import flash.filters.BitmapFilterQuality; import flash.filters.BlurFilter; import flash.geom.ColorTransform; import flash.geom.Matrix; import flash.geom.Point; public class WashPainting extends Sprite { private var w:Number = 480; private var h:Number = 480; private var bmpd:BitmapData; private var bmp:Bitmap; private var canvas:BitmapData; private var flagRotation:Number = 0; private const fadeTransform:ColorTransform = new ColorTransform(1, 1, 1, 1, 2, 2, 2, 0); private const blurFilter:BlurFilter = new BlurFilter(2, 2, BitmapFilterQuality.LOW); private var xpos:Number = w/2; private var ypos:Number = h/2; private var vx:Number = 0; private var vy:Number = 0; private const spring:Number = 0.012; private const friction:Number = 0.89; private var brush:Shape = new Shape(); private var mat:Matrix; [SWF(width="800",height="600")] public function WashPainting() { stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; bmpd = new BitmapData(w, h, false, 0x000000); bmp = new Bitmap(bmpd); addChild(bmp); addEventListener(Event.ENTER_FRAME, onEnterframe); } public function onEnterframe(e:Event):void { if (canvas) canvas.dispose(); canvas = bmpd.clone(); flagRotation = -(stage.mouseX - 240) / 280; // 淡出 canvas.colorTransform(canvas.rect, fadeTransform); canvas.applyFilter(canvas, canvas.rect, new Point(), blurFilter); // 绘制笔刷 vx += (stage.mouseX - xpos) * spring; vy += (stage.mouseY - ypos) * spring; vx *= friction; vy *= friction; xpos += vx; ypos += vy; var radiusOffset:Number = Math.sqrt(vx * vx + vy * vy); var radius:Number = Math.min(40, 360 / radiusOffset); brush.graphics.clear(); brush.graphics.beginFill(0x000000); brush.graphics.drawCircle(xpos, ypos, radius); brush.graphics.endFill(); canvas.draw(brush); //变换 mat = new Matrix(); mat.translate(-240, -240); mat.scale(1.005, 1.005); mat.rotate(Math.PI / 180 * flagRotation); mat.translate(240, 240); //绘制到bitmapdata bmpd.draw(canvas, mat); } } }
转载请注明:陈童的博客 » 应用AS3实现的水墨笔触