共用方式為


Xamarin.Forms 圖形:路徑標記語法

Xamarin.Forms 路徑標記語法可讓您在 XAML 中精簡指定路徑幾何。 語法會指定為 屬性的 Path.Data 字串值:

<Path Stroke="Black"
      Data="M13.908992,16.207977 L32.000049,16.207977 32.000049,31.999985 13.908992,30.109983Z" />

路徑標記語法是由選擇性 FillRule 值和一或多個圖形描述所組成。 此語法可以表示為:<Path Data="[fillRule] figureDescription [figureDescription] * " ... />

在此語法中:

  • fillRule 是選擇性 Xamarin.Forms.Shapes.FillRule 的 ,指定幾何是否應該使用 EvenOddNonzero FillRuleF0 是用來指定 EvenOdd 填滿規則,而 F1 則用來指定 Nonzero 填滿規則。 如需填滿規則的詳細資訊,請參閱 Xamarin.Forms 圖形:填滿規則
  • figureDescription 代表由行動命令、繪製命令和選擇性關閉命令所組成的圖形。 move 命令會指定圖形的起點。 繪製命令會描述圖形的內容,而選擇性的 close 命令會關閉該圖。

在上述範例中,路徑標記語法會使用move命令指定起點 (M)、使用line命令的一系列直線 ,L並使用 close 命令關閉路徑 (Z)。

在路徑標記語法中,命令前後不需要空格。 此外,兩個數位不必以逗號或空格分隔,但只有在字串明確時,才能達成此目的。

提示

路徑標記語法與可調整向量圖形 (SVG) 影像路徑定義相容,因此它可用於從 SVG 格式移植圖形。

雖然路徑標記語法適用於在 XAML 中取用,但可以藉由ConvertFromInvariantString叫用 類別中的方法,將它轉換成Geometry程式代碼中的 PathGeometryConverter 物件:

Geometry pathData = (Geometry)new PathGeometryConverter().ConvertFromInvariantString("M13.908992,16.207977 L32.000049,16.207977 32.000049,31.999985 13.908992,30.109983Z");

移動命令

move 命令會指定新圖形的起點。 此命令的語法為: M startPointm startPoint

在此語法中,startPoint 是一種Point結構,可指定新圖形的起點。 如果您在移動命令之後列出多個點,則會繪製線條到這些點。

M 10,10 是有效移動命令的範例。

繪製命令

繪製命令可以由數個圖形命令組成。 下列繪圖命令可供使用:

  • 線條 (Ll)。
  • 水平線 (Hh)。
  • 垂直線 (Vv)。
  • 橢圓形弧線 (Aa)。
  • 立方貝塞爾曲線 (Cc)。
  • 二次方貝塞爾曲線 (Qq)。
  • 平滑立方貝氏曲線 (Ss)。
  • 平滑二次方貝塞爾曲線(Tt)。

每個繪製命令都會以不區分大小寫的字母指定。 當連續輸入多個相同類型的命令時,可以省略重複的命令項目。 例如 L 100,200 300,400 ,相當於 L 100,200 L 300,400

線命令

行命令會在目前點與指定的結束點之間建立直線。 此命令的語法為: L endPointl endPoint

在這裡語法中, endPointPoint 表示該行終點的 。

L 20,30L 20 30 為有效命令的範例。

如需建立直線做為 PathGeometry 物件的資訊,請參閱 建立LineSegment

水平線命令

水平線命令會在目前點與指定的 x 座標之間建立水平線。 此命令的語法為: H xh x

在此語法中, xdouble ,表示線條終點的 x 座標。

H 90 為有效水平線命令的範例。

垂直線命令

垂直線命令會在目前點與指定的 y 座標之間建立垂直線。 此命令的語法為: V y 或 v y

在此語法中, ydouble ,表示線條終點的 Y 座標。

V 90 為有效垂直線命令的範例。

橢圓形弧線命令

橢圓形弧線命令會在目前點與指定的終點之間建立橢圓形弧線。 此命令的語法為: A size rotationAngle isLargeArcFlag sweepDirectionFlag endPointa size rotationAngle isLargeArcFlag sweepDirectionFlag endPoint。

在此語法中:

  • sizeSize表示弧線 x 與 y 半徑的 。
  • rotationAngledouble表示橢圓形旋轉的 ,以度為單位。
  • isLargeArcFlag 如果弧線的角度應該是 180 度或更大,則應該設定為 1,否則將它設定為 0。
  • sweepDirectionFlag 如果弧線是以正角度方向繪製,則應該設定為 1,否則將它設定為 0。
  • endPointPoint是繪製弧線的 。

A 150,150 0 1,0 150,-150 是有效橢圓弧線命令的範例。

如需建立橢圓形弧形做為 PathGeometry 對象的資訊,請參閱 建立ArcSegment

立方貝塞爾曲線命令

立方貝塞爾曲線命令會使用兩個指定的控制點,在目前點與指定的終點之間建立立方貝塞爾曲線。 此命令的語法為: C controlPoint1 controlPoint2 endPointc controlPoint1 controlPoint2 endPoint。

在此語法中:

  • controlPoint1 代表 Point 曲線的第一個控制點,決定曲線的開始正切值。
  • controlPoint2Point ,表示曲線的第二個控制點,決定曲線的結束正切值。
  • endPointPoint ,表示繪製曲線的點。

C 100,200 200,400 300,200 是有效立方貝塞爾曲線命令的範例。

如需將立方貝塞爾曲線建立為 PathGeometry 對象的相關信息,請參閱 建立 BezierSegment

二次方貝塞爾曲線命令

二次方貝塞爾曲線命令會使用指定的控制點,在目前點與指定的終點之間建立二次方貝塞爾曲線。 此命令的語法為: Q controlPoint endPointq controlPoint endPoint

在此語法中:

  • controlPointPoint 表示曲線控制點的 ,決定曲線的開始和結束正切值。
  • endPointPoint ,表示繪製曲線的點。

Q 100,200 300,200 為有效二次方貝茲曲線命令的範例。

如需建立二次方貝塞爾曲線作為 PathGeometry 對象的資訊,請參閱 建立二次方貝齊爾Segment

平滑立方貝塞爾曲線命令

平滑的立方貝塞爾曲線命令會使用指定的控制點,在目前點與指定的終點之間建立立方貝塞爾曲線。 此命令的語法為: S controlPoint2 endPoints controlPoint2 endPoint。

在此語法中:

  • controlPoint2Point ,表示曲線的第二個控制點,決定曲線的結束正切值。
  • endPointPoint ,表示繪製曲線的點。

假設第一個控制點是上一個命令第二個控制點的反映,相對於目前點。 如果沒有先前的命令,或上一個命令不是立方貝塞爾曲線命令或平滑的立方貝塞爾曲線命令,則會假設第一個控制點與目前點相吻合。

S 100,200 200,300 是有效的平滑立方貝塞爾曲線命令範例。

平滑二次方貝塞爾曲線命令

平滑二次方貝塞爾曲線命令會使用控制點,在目前點與指定的終點之間建立二次方貝塞爾曲線。 此命令的語法為: T endPointt endPoint

在此語法中, endPoint 是 , Point 表示繪製曲線的點。

控制點會假設為 (相對於目前的點) 上一個命令之控制點的反映。 如果沒有上一個命令,或上一個命令不是二次方貝塞爾曲線或平滑二次方貝塞爾曲線命令,則會假設控制點與目前點相吻合。

T 100,30 是有效的平滑二次方貝塞爾曲線命令範例。

關閉命令

close 命令會結束目前的圖形,並建立一行,將目前點連接到圖形的起點。 因此,此命令會在最後一個區段與圖的第一個區段之間建立線條聯結。

close 命令的語法為: Zz

其他值

除了標準數值,您也可以使用下列區分大小寫的特殊值:

  • Infinity 表示 double.PositiveInfinity
  • -Infinity 表示 double.NegativeInfinity
  • NaN 表示 double.NaN

此外,您也可以使用不區分大小寫的科學表示法。 因此, +1.e17 是有效的值。