AS3.0绘图API:
/** * * *-------------------* * | *** 绘图API *** | * *-------------------* * * 编辑修改收录:fengzi(疯子、wu341、wgq341) * * 不会写代码,我是代码搬运工。 * * 联系方式:QQ(493712833)。 * * 随 笔: https://www.cnblogs.com/fengziwu/ * * 版权协议:请自觉遵守LGPL协议,欢迎修改、复制、转载、传播给更多需要的人。 * 免责声明:任何因使用此软件导致的纠纷与软件/程序开发者无关。 * 日 期: 2019.05.08 * * * ------------------ Example -------------------- * * var s:Sprite=new Sprite() addChild(DrawingUtil.drawDashed(s,new Point(0,0),new Point(300,300))) */ package fengzi.drawing { import flash.display.Sprite; import flash.geom.Point; import flash.display.LineScaleMode; import flash.display.CapsStyle; import flash.display.GradientType; import flash.geom.Matrix; import flash.display.SpreadMethod; import flash.display.InterpolationMethod; public class DrawingUtil extends Sprite { public function DrawingUtil() { // constructor code } /*** * drawDashed 虚线 * @param sprite Sprite对象 * @param beginPoint 起始点坐标 new Point(0,0) * @param endPoint 终点坐标 new Point(100,100) * @param width 虚线短线的长度 * @param height 虚线的粗细 * @param grap 虚线短线之间的间隔 * @param color 虚线颜色 * @param alpha 颜色透明度 ***/ public static function drawDashed(sprite:Sprite,beginPoint:Point,endPoint:Point,grap:Number=2,width:Number=6,height:Number=1,color:uint=0xff00ff,alpha:Number=1.0):void { sprite.graphics.clear(); if (! beginPoint || ! endPoint || width <= 0 || grap <= 0) { return; } sprite.graphics.lineStyle(height,color,alpha,false,LineScaleMode.NONE,CapsStyle.NONE); var Ox:Number = beginPoint.x; var Oy:Number = beginPoint.y; var radian:Number = Math.atan2(endPoint.y - Oy,endPoint.x - Ox); var totalLen:Number = Point.distance(beginPoint,endPoint); var currLen:Number = 0; var x:Number,y:Number; while (currLen <= totalLen) { x = Ox + Math.cos(radian) * currLen; y = Oy + Math.sin(radian) * currLen; sprite.graphics.moveTo(x,y); currLen += width; if (currLen > totalLen) { currLen = totalLen; } x = Ox + Math.cos(radian) * currLen; y = Oy + Math.sin(radian) * currLen; sprite.graphics.lineTo(x,y); sprite.graphics.endFill(); currLen += grap; } } /*** * drawRect 矩形 * @param sprite Sprite对象 * @param x X坐标 * @param y Y坐标 * @param w 宽度 * @param h 高度 * @param bgColor 填充颜色(值为0无填充) * @param lineColor 边框颜色(值为0无边框) * @param a 透明度(0-1) * @param px 边框粗细(px) ***/ public static function drawRect(sprite:Sprite,x:Number,y:Number,w:Number,h:Number,bgColor:uint=0xff00ff,lineColor:uint=0,a:Number=1,px:Number=1):void { sprite.graphics.clear(); if (lineColor!=0) { sprite.graphics.lineStyle(px,lineColor,a); } if (bgColor!=0) { sprite.graphics.beginFill(bgColor,a); } sprite.graphics.drawRect(x, y, w, h); sprite.graphics.endFill(); } /*** * drawRoundRectComplex 圆角矩形 * @param sprite Sprite对象 * @param x X坐标 * @param y Y坐标 * @param w 宽度 * @param h 高度 * @param radiusTL 左上角圆角半径 * @param radiusTR 右上角圆角半径 * @param radiusBL 左下角圆角半径 * @param radiusBR 右下角圆角半径 * @param bgColor 填充颜色(值为0无填充) * @param lineColor 边框颜色(值为0无边框) * @param a 透明度(0-1) * @param px 边框粗细(px) ***/ public static function drawRoundRectComplex(sprite:Sprite,x:Number,y:Number,w:Number,h:Number,radiusTL:Number=3,radiusTR:Number=8,radiusBL:Number=3,radiusBR:Number=8,bgColor:uint=0xff00ff,lineColor:uint=0,a:Number=1,px:Number=1):void { sprite.graphics.clear(); if (lineColor!=0) { sprite.graphics.lineStyle(px,lineColor,a); } if (bgColor!=0) { sprite.graphics.beginFill(bgColor,a); } sprite.graphics.drawRoundRectComplex(x, y, w, h,radiusTL,radiusTR,radiusBL,radiusBR); sprite.graphics.endFill(); } /*** * drawCircle 圆形 * @param sprite Sprite对象 * @param x X坐标 * @param y Y坐标 * @param r 半径 * @param bgColor 填充颜色(值为0无填充) * @param lineColor 边框颜色(值为0无边框) * @param a 透明度(0-1) * @param px 边框粗细(px) ***/ public static function drawCircle(sprite:Sprite,x:Number,y:Number,r:Number,bgColor:uint=0xff00ff,lineColor:uint=0,a:Number=1.0,px:Number=1):void { sprite.graphics.clear(); if (lineColor!=0) { sprite.graphics.lineStyle(px,lineColor,a); } if (bgColor!=0) { sprite.graphics.beginFill(bgColor,a); } sprite.graphics.drawCircle(x, y, r); sprite.graphics.endFill(); } /*** * drawEllipse 椭圆 * @param sprite Sprite对象 * @param x X坐标 * @param y Y坐标 * @param w 宽度 * @param h 高度 * @param bgColor 填充颜色(值为0无填充) * @param lineColor 边框颜色(值为0无边框) * @param a 透明度(0-1) * @param px 边框粗细(px) ***/ public static function drawEllipse(sprite:Sprite,x:Number,y:Number,w:Number,h:Number,bgColor:uint=0xff00ff,lineColor:uint=0,a:Number=1.0,px:Number=1):void { sprite.graphics.clear(); if (lineColor!=0) { sprite.graphics.lineStyle(px,lineColor,a); } if (bgColor!=0) { sprite.graphics.beginFill(bgColor,a); } sprite.graphics.drawEllipse(x, y, w,h); sprite.graphics.endFill(); } /*** * drawSector 绘制扇形 * @param sprite Sprite对象 * @param x 圆心角x * @param y 圆心角y * @param r 半径 * @param angle 绘制角度 * @param startAngle 起始角度 * @param color 填充颜色(值为0无填充) * @param lineColor 边框颜色(值为0无边框) * @param a 透明度(0-1) * @param px 边框粗细(px) ***/ public static function drawSector(sprite:Sprite,x:Number=200,y:Number=200,r:Number=100,angle:Number=90,startAngle:Number=-135,color:uint=0xff0000,lineColor:uint=0,a:Number=1.0,px:Number=1):void { sprite.graphics.clear(); if (lineColor!=0) { sprite.graphics.lineStyle(px,lineColor,a); } if (color!=0) { sprite.graphics.beginFill(color,a); } sprite.graphics.moveTo(x,y); angle = Math.abs(angle) > 360 ? 360:angle; var n:Number = Math.ceil(Math.abs(angle) / 45); var angleA:Number = angle / n; angleA = angleA * Math.PI / 180; startAngle = startAngle * Math.PI / 180; sprite.graphics.lineTo(x + r * Math.cos(startAngle),y + r * Math.sin(startAngle)); for (var i:int = 1; i <= n; i++) { startAngle += angleA; var angleMid:Number = startAngle - angleA / 2; var bx:Number = x + r / Math.cos(angleA / 2)* Math.cos(angleMid); var by:Number = y + r / Math.cos(angleA / 2) * Math.sin(angleMid); var cx:Number = x + r * Math.cos(startAngle); var cy:Number = y + r * Math.sin(startAngle); sprite.graphics.curveTo(bx,by,cx,cy); } if ((angle != 360)) { sprite.graphics.lineTo(x,y); } sprite.graphics.endFill(); } /*** * drawStar 多角星 * @param sprite Sprite对象 * @param vertex 顶点 角的个数 * @param radius 半径 * @param color 填充颜色(值为0无填充) * @param lineColor 边框颜色(值为0无边框) * @param a 透明度(0-1) * @param px 边框粗细(px) ***/ public static function drawStar(sprite:Sprite,vertex:int=5,radius:int=100,color:uint=0xff0000,lineColor:uint=0,a:Number=1.0,px:Number=1):void { sprite.graphics.clear(); if ((vertex >= 2)) { sprite.graphics.clear(); if (lineColor!=0) { sprite.graphics.lineStyle(px,lineColor,a); } if (color!=0) { sprite.graphics.beginFill(color,a); } //初始点 sprite.graphics.moveTo(radius,0); //循环 vertex*2 需要经过的顶点数; for (var i:int = 1; i < vertex * 2; i++) { //半径 var radius2:Number = radius; //求模,余数不等于0,这里其实就是奇、偶数的判断 if (i % 2 != 0) { //i为奇数的时候半径减半 radius2 = radius / 2; } //当前角度 var angle:Number = Math.PI * 2 / (vertex * 2) * i; //点的坐标(通过角度与半径计算每一个顶点的坐标) sprite.graphics.lineTo(Math.cos(angle) * radius2,Math.sin(angle) * radius2); } //结束画图 sprite.graphics.endFill(); //移动图形坐标; sprite.x = sprite.y = radius; } } /*** * drawPolygon 正多边形 * @param sprite Sprite对象 * @param segments 边的个数大于2 * @param radius 半径 * @param color 填充颜色,16进制,为0的时候不填充 * @param line 边线粗细 * @param lineColor 边线颜色,16进制,为0的时候不填充边线 ***/ public static function drawPolygon(sprite:Sprite,segments:uint=5,radius:Number=100,color:uint=0xff0000,line:Number=1.0,lineColor:uint=0):void { sprite.graphics.clear(); if (segments >= 3) { if (lineColor!=0) { sprite.graphics.lineStyle(line,lineColor,1); } //初始点; sprite.graphics.moveTo(radius,0); //填充颜色; if (color>0) { sprite.graphics.beginFill(color); } //循环 segments 需要经过的顶点数; for (var i:int = 1; i < segments; i++) { //当前角度 var angle:Number = Math.PI * 2 / segments * i; //点的坐标(通过角度与半径计算每一个顶点的坐标) sprite.graphics.lineTo(Math.cos(angle) * radius,Math.sin(angle) * radius); } //结束画图 sprite.graphics.endFill(); //移动图形坐标; sprite.x = sprite.y = radius; } } /*** * drawTriangle 等边(腰)三角形 * @param sprite Sprite对象 * @param angle 顶角度数<180 * @param r 顶角邻边长度 * @param fillColor 填充颜色,16进制,为0的时候不填充 * @param frameColor 边框颜色,16进制,为0的时候不填充边线 ***/ public static function drawTriangle(sprite:Sprite,angle:Number=60,r:Number=100,fillColor:uint=0xff0000,frameColor:uint=0xffff00) { sprite.graphics.clear(); var _angle:Number = angle * ((2 * Math.PI) / 360);//这里得到是弧度,即30度对应的弧度数 if (frameColor!=0) { sprite.graphics.lineStyle(1,frameColor); } if (fillColor!=0) { sprite.graphics.beginFill(fillColor); } sprite.graphics.moveTo(0,0); sprite.graphics.lineTo(r,0); sprite.graphics.lineTo(r * Math.cos(_angle),r * Math.sin(_angle)); sprite.graphics.lineTo(0,0); sprite.graphics.endFill(); sprite.rotation = (180 - angle) / 2; /* 1、等腰三角形可以看做其两腰交叉的那个点在一个圆的圆心,那么其他两个顶点则在这个圆上,假设圆心坐标为(0,0),圆的半径为r,两腰夹角为Q,可得另个顶点坐标为(r,0),最后个顶点坐标为(r*cosQ,r*sinQ); 2、等边三角形可看做两腰夹角为60度的等腰三角形,只需知道边长,即可按照上面的方法画出 3、如果已知条件为 两腰夹角Q,底边长度d,那么两腰的长度即圆的半径r 为d*Math.PI/(2*Q),再按照上面的方法也可画出; 4、如果知道等腰三角形的腰长r 和底边长d 也可求出; 假设两腰夹角为x ,沿顶点画出等腰三角形的垂直平分线,可看出sin(x/2)=(d/2)/r,可求出夹角Q=(Math.asin((d/2)/r))/2,再按照上面的方法也可画出。 */ } /*** * drawGradientFill 矩形渐变填充(可扩展其他图形) * @param sprite Sprite对象 * @param w 宽 * @param h 高 * @param colors 填充颜色数组 [0xff00ff,0xffffff,0xffffff,0xff00ff],也可以2、3...个参数 * @param alphas 对应颜色的透明度0-1 [0,1,1,0]对应填充颜色数组 * @param ratios 对应颜色的偏移0-255 [0,80,160,255]填充颜色数组 * @param direction 渐变类型,默认true(水平渐变),false(垂直渐变) * @param type 渐变填充,默认true(线性填充),false(放射填充) ***/ public static function drawGradientFill(sprite:Sprite,w:Number,h:Number,colors:Array,alphas:Array,ratios:Array,direction:Boolean=true,type:Boolean=true):void { sprite.graphics.clear(); var matrix:Matrix=new Matrix(); if (direction) { matrix.createGradientBox(w,h,0,0,0); } else { matrix.createGradientBox(w,h,Math.PI/2,0,0); } if (type) { sprite.graphics.beginGradientFill(GradientType.LINEAR, colors, alphas, ratios, matrix); } else { sprite.graphics.beginGradientFill(GradientType.RADIAL, colors, alphas, ratios, matrix); } //可扩展其他图形 sprite.graphics.drawRect(0, 0, w,h); sprite.graphics.endFill(); //圆角矩形(x,y,宽,高,圆角半径) //graphics.drawRoundRect(0,0,w,h,5); //圆角矩形(x,y,宽,高,左上角圆角半径,右上角圆角半径,左下角圆角半径,右下角圆角半径) //graphics.drawRoundRectComplex(0, 0, w,h,8,8,5,5) } } }