次の方法で共有

方法 : 2 次ベジエ曲線を作成する

  • [アーティクル]

2 次ベジエ曲線を作成する方法を次の例に示します。 2 次ベジエ曲線を作成するには、PathGeometry、PathFigure、および QuadraticBezierSegment の各クラスを使用します。

使用例

次の例では、2 次ベジエ曲線を (10,100) から (300,100) まで描画します。 曲線の制御点は (200,200) です。

[xaml]

Extensible Application Markup Language (XAML) では、属性の構文を使用してパスを記述できます。

<Path Stroke="Black" StrokeThickness="1" 
  Data="M 10,100 Q 200,200 300,100" />

[xaml]

(この属性構文は、実際には PathGeometry の軽量バージョンである StreamGeometry を作成します。 詳細については、「パス マークアップ構文」のページを参照してください。)

XAML では、オブジェクト要素構文を使用して 2 次ベジエ曲線を描画することもできます。 次の例は、前の XAML の例と同じです。

<Path Stroke="Black" StrokeThickness="1">
  <Path.Data>
    <PathGeometry>
      <PathGeometry.Figures>
        <PathFigureCollection>
          <PathFigure StartPoint="10,100">
            <PathFigure.Segments>
              <PathSegmentCollection>
                <QuadraticBezierSegment Point1="200,200" Point2="300,100" />
              </PathSegmentCollection>
            </PathFigure.Segments>
          </PathFigure>
        </PathFigureCollection>
      </PathGeometry.Figures>
    </PathGeometry>
  </Path.Data>
</Path>

この例は、より大きなサンプルの一部です。サンプル全体については、ジオメトリのサンプルを参照してください。

参照

処理手順

方法 : 楕円の円弧を作成する

方法 : 3 次ベジエ曲線を作成する