填充移动的圆锥体形状不起作用，

Question

我正在使用Flash API绘制稍后将作为激光束工作的移动圆锥体形状。然而即使形状没有间隙，我也无法填充它。

下面是我得到的当前结果，并按照以下顺序绘制，如数字所示。

Link to current result

之前，这一切我开始的beginFill（...），并结束这一切，所有的线路已经延伸后，与endFill（）。

如前所述，圆锥体的移动将在稍后用作效果（每个点之间我将淡化线条样式）。因此，我所做的是为每个OnEnterFrame事件存储点并根据这些点绘制线条（1 & 2）。激光束有一个方向。

如果它是静态的，我画它这个它的工作原理（在onEnterFrame事件）以下方式：

    graphics.clear(); 
     graphics.lineStyle(3, 0xFF0000); 
     graphics.beginFill(0xFFFFFF); 

     var dx:Number = end.x - source.x; 
     var dy:Number = end.y - source.y; 

     var angle:Number = Math.atan2(dy, dx); 

     var endX1:Number = end.x + 20 * Math.cos(angle - 90); 
     var endY1:Number = end.y + 20 * Math.sin(angle - 90); 
     var endX2:Number = end.x + 20 * Math.cos(angle + 90); 
     var endY2:Number = end.y + 20 * Math.sin(angle + 90); 


     graphics.lineStyle(3, 0xFFFFFF); 
     graphics.moveTo(source.x, source.y); 
     graphics.lineTo(endX1, endY1); 

     graphics.moveTo(source.x, source.y); 
     graphics.lineTo(endX2, endY2); 
     graphics.lineTo(endX1, endY1); 
     graphics.endFill(); 

话虽这么说，这样一来我不画4号线（如在图片中显示）。

我用尽了想法，形状显然是封闭的，但填充不起作用。这里是我为“移动”锥效果的OnEnterFrame事件的完整代码。这里

public function update():void 
    { 
     /* 
     graphics.clear(); 
     //graphics.lineStyle(3, 0xFF0000); 
     graphics.beginFill(0xFFFFFF); 
     //graphics.moveTo(source.x, source.y); 
     //graphics.lineTo(end.x, end.y); 
     */ 
     var dx:Number = end.x - source.x; 
     var dy:Number = end.y - source.y; 

     var angle:Number = Math.atan2(dy, dx); 

     var endX1:Number = end.x + 20 * Math.cos(angle - 90); 
     var endY1:Number = end.y + 20 * Math.sin(angle - 90); 
     var endX2:Number = end.x + 20 * Math.cos(angle + 90); 
     var endY2:Number = end.y + 20 * Math.sin(angle + 90); 

     /* 
     graphics.lineStyle(3, 0xFFFFFF); 
     graphics.moveTo(source.x, source.y); 
     graphics.lineTo(endX1, endY1); 

     graphics.moveTo(source.x, source.y); 
     graphics.lineTo(endX2, endY2); 
     graphics.lineTo(endX1, endY1); 
     graphics.endFill(); 

     return; 
     */ 

     var x:Number = currentPoint.x; 
     var y:Number = currentPoint.y; 
     var x2:Number = currentPoint2.x; 
     var y2:Number = currentPoint2.y; 

     points[0].x = x; 
     points[0].y = y; 

     points2[0].x = x2; 
     points2[0].y = y2; 


     //:: Interpolate Current Point 
     currentPoint = Point.interpolate(new Point(endX1, endY1), source, progress); 
     currentPoint2 = Point.interpolate(new Point(endX2, endY2), source, progress); 


     //:: Add new point with properties 
     if (progress < 1.0) 
     { 
      points.splice(1, 0, {x: x, y: y, life: getTimer(), thickness: 2 + (20 * progress)}); 
      points2.splice(1, 0, {x: x2, y: y2, life: getTimer(), thickness: 2 + (20 * progress)}); 
     } 

     //:: Line 1 
     graphics.clear(); 
     graphics.lineStyle(3, 0xFFFFFF, 1); 
     graphics.beginFill(0xFF0000); 

     graphics.moveTo(x, y); 

     for (var i:int = 1; i < points.length; i++) 
     { 
      //:: Point dead, remove it 
      if (getTimer() - points[i].life > lifetime) 
      { 
       points.splice(i--, 1); 
      } 
      //:: Update point life and draw graphics 
      else 
      { 
       var currentLife:Number = (getTimer() - points[i].life); 
       var perc:Number   = Math.abs(1 - (currentLife/lifetime)); 

       //graphics.lineStyle(3, 0xFFFFFF, perc); 

       //:: Prev point 
       var px:Number = points[i - 1].x; 
       var py:Number = points[i - 1].y; 

       graphics.lineTo(px, py);          
      } 
     } 


     //:: Line 2 
     graphics.beginFill(0xFFFFFF); 
     graphics.moveTo(x2, y2); 

     for (var i:int = 1; i < points2.length; i++) 
     { 
      //:: Point dead, remove it 
      if (getTimer() - points2[i].life > lifetime) 
      { 
       points2.splice(i--, 1); 
      } 
      //:: Update point life and draw graphics 
      else 
      { 
       var currentLife:Number = (getTimer() - points2[i].life); 
       var perc:Number   = Math.abs(1 - (currentLife/lifetime)); 

       //graphics.lineStyle(3, 0xFFFFFF, perc); 

       //:: Prev point 
       var px:Number = points2[i - 1].x; 
       var py:Number = points2[i - 1].y; 

       graphics.lineTo(px, py);          
      } 
     } 



     //:: Close 3 & 4 
     if (points.length > 1) 
     { 
      graphics.moveTo(points[points.length-2].x, points[points.length-2].y); 
      graphics.lineTo(points2[points2.length-2].x, points2[points2.length-2].y); 
     } 

     graphics.moveTo(x, y); 
     graphics.lineTo(x2, y2); 
     graphics.endFill(); 



     //:: Progress 
     progress += progressSpeed;  
     if (progress >= 1.0) progress = 1.0; 

该代码是非常安全的解释。如果您需要更多信息，我会提供！

在此先感谢！

Answer 1

我相信你的问题发生是因为你正在移动绘图位置两次，这是令人困惑的Flash应该填补什么。

通常情况下，当我绘制这样的形状时，我在开始时只做一次调用moveTo()，然后从当前的终点画出每一行。当您绘制每条线时，“当前终点”会发生变化。我建议你修改代码，以便它绘制这样的事情：

moveTo(startX, startY); 
lineTo(endX1, endY1); 
lineTo(endX2, endY2); 
lineTo(endX3, endY3); 
lineTo(startX, startY); 

我认为正在发生的事情是，当你作出这样的第二个呼叫到moveTo() Flash尝试，以填补任何先前已绘制。但是因为你只绘制了2行，所以没有什么可填写的。它重置它的状态（关于应该填充的内容），然后再绘制另外一行或两行。当您致电endFill()时，它只会查看自上次moveTo()以来已经绘制的内容，并再次决定没有任何内容需要填写。