填充移動的圓錐體形狀不起作用，

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()以來已經繪製的內容，並再次決定沒有任何內容需要填寫。