as3 画五角星算法

as3 画五角星算法
阅读：10次   时间：2012-03-22 19:08:16   字体：[大 中 小]



使用as3语言动态绘制五角星，主要难点在于动态转换五角星各个边得角度。

代码如下：

function drawStar():void
  {
   var m:MovieClip=new MovieClip();

   var radius:Number = 50;
   var color:uint = 0xFFFF00;
   m.graphics.lineStyle(5,0xFF0000);
   m.graphics.moveTo(radius,0);
   m.graphics.beginFill(color);

   for (var i:int=1; i<11; i++)
   {
    var radius2:Number = radius;
    if (i % 2 > 0)
    {
     radius2 = radius / 2;
    }
    var angle:Number = Math.PI * 2 / 10 * i;
    m.graphics.lineTo(Math.cos(angle)*radius2,Math.sin(angle)*radius2);
   }
   m.x = 200;
   m.y = 200;
   addChild(m);
  }

上面的代码是直接绘制五角星，不能设置各种参数。

下面的方法可以设置绘图的各种参数的行数，代码如下：

drawShape(graphics:Graphics, x:Number, y:Number,  innerRadius:Number, outerRadius:Number, points:Number = 5, angle:Number=90 ):void
  {
   graphics.clear();
         graphics.lineStyle(borderThickness,borderColor,borderAlpha);
         if(backgroundAlpha > 0)
         {
          graphics.beginFill(backgroundColor, backgroundAlpha);
         }
         var count:int = Math.abs(points);
         if (count>=2)
         {
              
             // calculate distance between points
             var step:Number = (Math.PI*2)/points;
             var halfStep:Number = step/2;
           
             // calculate starting angle in radians
             var start:Number = (angle/180)*Math.PI;
             graphics.moveTo(x+(Math.cos(start)*outerRadius), y-(Math.sin(start)*outerRadius));
               
             // draw lines
             for (var i:int=1; i<=count; i++)
             {
                 graphics.lineTo(x+Math.cos(start+(step*i)-halfStep)*innerRadius,
                 y-Math.sin(start+(step*i)-halfStep)*innerRadius);
                 graphics.lineTo(x+Math.cos(start+(step*i))*outerRadius,
                 y-Math.sin(start+(step*i))*outerRadius);
             }
         }
         if(backgroundAlpha > 0)
         {
          graphics.endFill();
         }
  }