パス・マークアップ構文

パスについては、「 WPF での図形と基本描画の概要 」と「 ジオメトリの概要」で説明しますが、このトピックでは、Extensible Application Markup Language (XAML) を使用してパス ジオメトリをよりコンパクトに指定するために使用できる強力で複雑なミニ言語について詳しく説明します。

[前提条件]

このトピックを理解するには、 Geometry オブジェクトの基本的な機能について理解している必要があります。 詳細については、「ジオメトリの概要」を参照してください。

StreamGeometry と PathFigureCollection Mini-Languages

WPF には、幾何学的パスを記述するためのミニ言語を提供する 2 つのクラス ( StreamGeometry と PathFigureCollection) が用意されています。

• StreamGeometryのGeometryプロパティやClip要素のUIElementプロパティなど、Data型のプロパティを設定する場合は、Pathミニ言語を使用します。 次の例では、属性構文を使用して StreamGeometryを作成します。

  <Path Stroke="Black" Fill="Gray"
        Data="M 10,100 C 10,300 300,-200 300,100" />
  

• PathFigureCollectionのFigures プロパティを設定するときは、PathGeometryミニ言語を使用します。 次の例では、属性構文を使用して、PathFigureCollectionをPathGeometryのために作成します。

  <Path Stroke="Black" Fill="Gray">
    <Path.Data>
      <PathGeometry Figures="M 10,100 C 10,300 300,-200 300,100" />
    </Path.Data>
  </Path>
  

前の例からわかるように、2 つのミニ言語は非常に似ています。 PathGeometryを使用できる状況では常にStreamGeometryを使用できるため、どれを使用する必要がありますか? 作成後にパスを変更する必要がない場合は StreamGeometry を使用します。パスを変更する必要がある場合は PathGeometry を使用します。

PathGeometryオブジェクトとStreamGeometryオブジェクトの違いの詳細については、「ジオメトリの概要」を参照してください。

空白に関する注意事項

簡潔にするために、以降の構文セクションには 1 つのスペースが表示されますが、1 つのスペースが表示されている場所でも複数のスペースを使用できます。

実際には、2 つの数値をコンマまたは空白で区切る必要はありませんが、結果の文字列が明確な場合にのみ行うことができます。 たとえば、 2..3 は実際には "2" と "3" の 2 つの数値です。 同様に、 2-3 は "2" と "-3" です。 コマンドの前後にスペースは必要ありません。

構文

StreamGeometryの拡張アプリケーション マークアップ言語 (XAML) 属性の使用構文は、省略可能なFillRule値と 1 つ以上の図の説明で構成されます。

PathFigureCollectionの拡張アプリケーション マークアップ言語 (XAML) 属性の使用構文は、1 つ以上の図の説明で構成されます。

ムーブ命令

新しい図形の始点を指定します。

大文字の M は、 startPoint が絶対値であることを示します。小文字の m は、 startPoint が前のポイントへのオフセットであることを示します。存在しない場合は (0,0)。 移動コマンドの後に複数の点を一覧表示すると、線コマンドを指定した場合でも、その点に線が描画されます。

描画コマンド

描画コマンドは、複数の図形コマンドで構成できます。 次の図形コマンドを使用できます。線、水平線、垂直線、3 次ベジエ曲線、2 次ベジエ曲線、滑らかな 3 次ベジエ曲線、滑らかな 2 次ベジエ曲線、楕円円弧。

各コマンドは、大文字または小文字を使用して入力します。大文字は絶対値を示し、小文字は相対値を示します。そのセグメントの制御ポイントは、前の例の終点を基準にしています。

ラインコマンド

現在の点と指定した終点の間に直線を作成します。 l 20 30 および L 20,30 は、有効な 行 コマンドの例です。

大文字の L は、 endPoint が絶対値であることを示します。小文字の l は、 endPoint が前のポイントへのオフセットであることを示します。存在しない場合は (0,0)。

水平線コマンド

現在の点と指定した x 座標の間に水平線を作成します。 H 90 は、有効な水平線コマンドの例です。

大文字の H は、 x が絶対値であることを示します。小文字の h は、 x が前のポイントへのオフセットであることを示します。存在しない場合は (0,0)。

垂直線コマンド

現在の点と指定した y 座標の間に垂直線を作成します。 v 90 は、有効な垂直線コマンドの例です。

大文字の V は、 y が絶対値であることを示します。小文字の v は、 y が前のポイントへのオフセットであることを示します。存在しない場合は (0,0)。

[3 次ベジエ曲線] コマンド

指定した 2 つのコントロール ポイント (controlPoint1 と controlPoint2) を使用して、現在のポイントと指定した終点の間に 3 次ベジエ曲線を作成します。 C 100,200 200,400 300,200 は、有効な曲線コマンドの例です。

二次ベジエ曲線コマンド

指定したコントロール ポイント (controlPoint) を使用して、現在のポイントと指定した終点の間に 2 次ベジエ曲線を作成します。 q 100,200 300,200 は、有効な 2 次ベジエ曲線コマンドの例です。

スムーズな3次のベジェ曲線コマンド

現在の点と指定した終点の間に 3 次ベジエ曲線を作成します。 1 番目の制御ポイントは、現在のポイントに対する前のコマンドの 2 番目の制御ポイントの反射であると見なされます。 前のコマンドがない場合、または前のコマンドが 3 次ベジエ曲線コマンドまたはスムーズ 3 次ベジエ曲線コマンドでない場合は、最初の制御点が現在の点と一致していると仮定します。 2 番目の制御点(曲線の終点の制御点)は、 controlPoint2 で指定されます。 たとえば、 S 100,200 200,300 は、有効なスムーズな 3 次ベジエ曲線コマンドです。

スムーズ 2次ベジエ曲線のコマンド

現在の点と指定した終点の間に 2 次ベジエ曲線を作成します。 コントロール ポイントは、現在のポイントに対する前のコマンドの制御ポイントのリフレクションと見なされます。 前のコマンドがない場合、または前のコマンドが 2 次ベジエ曲線コマンドまたはスムーズ 2 次ベジエ曲線コマンドでない場合、制御点は現在の点と一致します。

楕円円弧コマンド

現在の点と指定した終点の間に楕円円弧を作成します。

閉じるコマンド

現在の図形を終了し、現在のポイントを図形の始点に接続する線を作成します。 このコマンドは、図の最後のセグメントと最初のセグメントの間に線結合 (コーナー) を作成します。

ポイント構文

(0,0) が左上隅である点の x 座標と y 座標を記述します。

特殊値

標準の数値の代わりに、次の特殊な値を使用することもできます。 これらの値では、大文字と小文字が区別されます。

Infinity Double.PositiveInfinityを表します。

-Infinity Double.NegativeInfinityを表します。

NaN は Double.NaNを表します。

科学的表記を使用することもできます。 たとえば、+1.e17 は有効な値です。

こちらも参照ください

• Path
• StreamGeometry
• PathGeometry
• PathFigureCollection
• WPF の 図形と基本的な描画に関する概要
• ジオメトリの概要
• 使い方に関するトピック