[ActionScript 3.0] 动态绘制扇形实例（拖拽绘制）

  1 package

  2 {

  3     import flash.display.Shape;

  4     import flash.display.Sprite;

  5     import flash.events.MouseEvent;

  6     

  7     /**

  8      * @author Frost.Yen

  9      * @E-mail [email protected]

 10      * @create 2015-7-13 上午11:14:16

 11      *

 12      */

 13     [SWF(width="800",height="600")]

 14     public class DrawSectorTest extends Sprite

 15     {

 16         private var _sector:Sprite;

 17         private var _dragSp:Sprite;

 18         private var _radian:Number;//弧度

 19         private const _radius:uint = 100;//半径

 20         private const _angle:Number = 60;//初始角度

 21         public function DrawSectorTest()

 22         {

 23             _sector = new Sprite();

 24             _dragSp = new Sprite();

 25             _sector.x = _dragSp.x = stage.stageWidth*0.5;

 26             _sector.y = _dragSp.y = stage.stageHeight*0.5;

 27             this.addChild(_sector);

 28             this.addChild(_dragSp);

 29             

 30             

 31             _dragSp.graphics.beginFill(0,.2);

 32             _dragSp.graphics.drawRect(0,-5,_radius,10);

 33             _dragSp.graphics.endFill();

 34             

 35             drawSector(_sector,0,0,_radius,_angle,0);

 36             _dragSp.rotation = _angle;

 37             _dragSp.addEventListener(MouseEvent.MOUSE_DOWN,onDragDown);

 38         }

 39         private function onDragDown(e:MouseEvent):void

 40         {

 41             stage.addEventListener(MouseEvent.MOUSE_MOVE,onDragMove);

 42             stage.addEventListener(MouseEvent.MOUSE_UP,onDragOut);

 43         }

 44         private function onDragMove(e:MouseEvent):void

 45         {

 46             _dragSp.rotation = Math.atan2(_dragSp.parent.mouseY - _dragSp.y,_dragSp.parent.mouseX - _dragSp.x) * 180 / Math.PI ;

 47             _radian = (_dragSp.rotation) * Math.PI / 180;

 48             /**这是关键，因为rotation的区间是[0,180][0,-180],如果直接用_dragSp.rotation会导致拖拽绘制扇形错误*/

 49             if (_dragSp.rotation > 180){

 50                 _radian = _radian + Math.PI;

 51             }

 52             if (_radian < 0){

 53                 _radian = _radian + 2 * Math.PI;

 54             }

 55             drawSector(_sector,0,0,_radius,_radian*180/Math.PI,0);

 56         }

 57         private function onDragOut(e:MouseEvent):void

 58         {

 59             stage.removeEventListener(MouseEvent.MOUSE_MOVE,onDragMove);

 60             stage.removeEventListener(MouseEvent.MOUSE_UP,onDragOut);

 61             

 62         }

 63         /**

 64          * 绘制扇形

 65          * @param    mc 承载扇形的对象

 66          * @param    x 圆心角x

 67          * @param    y 圆心角y

 68          * @param    r 半径

 69          * @param    angle 绘制角度

 70          * @param    startFrom 起始角度

 71          * @param    color 填充颜色

 72          * @param    hasFrame 是否填充边框

 73          */

 74         private function drawSector(sp:Sprite,x:Number=0,y:Number=0,r:Number=100,angle:Number=60,startAngle:Number=0,color:Number=0xff0000,hasFrame:Boolean=true):void {

 75             sp.graphics.clear();

 76             if(hasFrame) {

 77                 sp.graphics.lineStyle(0,0xffff00);

 78             }

 79             sp.graphics.beginFill(color,1);

 80             sp.graphics.moveTo(x,y);

 81             angle=(Math.abs(angle)>360)?360:angle;

 82             var n:Number=Math.ceil(Math.abs(angle)/45);

 83             var angleA:Number=angle/n;

 84             angleA=angleA*Math.PI/180;

 85             startAngle=startAngle*Math.PI/180;

 86             sp.graphics.lineTo(x+r*Math.cos(startAngle),y+r*Math.sin(startAngle));

 87             for (var i:int=1; i<=n; i++) {

 88                 startAngle+=angleA;

 89                 var angleMid:Number=startAngle-angleA/2;

 90                 var bx:Number=x+r/Math.cos(angleA/2)*Math.cos(angleMid);

 91                 var by:Number=y+r/Math.cos(angleA/2)*Math.sin(angleMid);

 92                 var cx:Number=x+r*Math.cos(startAngle);

 93                 var cy:Number=y+r*Math.sin(startAngle);

 94                 sp.graphics.curveTo(bx,by,cx,cy);

 95             }

 96             if (angle!=360) {

 97                 sp.graphics.lineTo(x,y);

 98             }

 99             sp.graphics.endFill();

100         }

101     }

102 }