2010-04-14 104 views
1

我試圖讓這個SVG形狀(忽略彩色背景,只是X形)X(關閉)形狀

Close SVG Path

,但沒有插圖,也不會知道如何使用它。

有人可以幫助一般的想法,或指向我的替代品。我在flex中使用它。

回答

1

這樣做的便宜和簡單的方法是獲得一張方格紙並標出一個16x16(或其他尺寸)正方形塊。沿着塊的頂部和左側寫入數字0-15,每個數字對應一個小方塊。

然後畫出你的身影(這裏是一個X),從其中一個方格開始,並且不要從紙上擡起你的筆,繼續它的輪廓直到你回到起點。 (這不一定是完美的,或者甚至是非常好的繪圖。)

接下來,製作一條線改變方向的點的列表。這些是您將用於繪圖的節點。

讓我們使用這種方法在大塊左上角繪製一個簡單的向下指向的三角形。從0,0開始,直到0,7,此時您轉動並繼續行到3,3,然後再次轉動並繼續回到0,0並停止。現在

,你有一個點的數組:

[new Point(0,0), new Point(0,3), new Point(3,3), new Point(0,0)]; 

使用圖形的方法,對象,你可以做到以下幾點:

private function drawInvertedTriangle():void { 
    var aryPoints:Array = [ 
      new Point(0,0) 
     , new Point(0,3) 
     , new Point(3,3) 
     , new Point(0,0)]; 
    var bgColor:uint = 0x0000CC; // darkish blue 
    var child:Shape = new Shape(); 
    child.graphics.beginFill(bgColor); 
    child.graphics.moveTo(aryPoints[0].x, aryPoints[0].y); 
    for (var i:int=1; i<aryPoints.length; i++) { 
     var pt:Point = aryPoints[i]; // for clarity in this sample 
     child.graphics.lineTo(pt.x, pt.y) 
    } 
    child.graphics.endFill(); 
    addChild(child); 
} 

我硬編碼您的積分到該方法,但是您可以輕鬆地將aryPoints作爲該函數的參數,在這種情況下,它將繪製任何形狀,其中至少有3個元素的數組。

現在,爲了繪製X,您需要先使用graphics.drawRoundRect()方法,然後在其上繪製X.使用Graphics類調查gradientFill和其他可用的工具。

+0

看起來這或多或少是我必須要做的。感謝您的努力。 – danke 2010-04-14 17:11:55