Cómo: Crear una curva Bézier cuadrática

  • Artículo

En este ejemplo se muestra cómo crear una curva Bézier cuadrática. Para crear una curva Bézier cuadrática, use las clases PathGeometry, PathFigure y QuadraticBezierSegment.

Ejemplo

En los ejemplos siguientes, se dibuja una curva Bézier cuadrática de (10,100) a (300,100). La curva tiene un punto de control de (200,200).

En el lenguaje XAML, se puede utilizar la sintaxis de atributo para describir un trazado.

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

Tenga en cuenta que esta sintaxis de atributo crea realmente un elemento StreamGeometry versión más ligera de PathGeometry. Para obtener más información, consulte la página Sintaxis de marcado de trazados.

En XAML, también puede dibujar una curva Bézier cuadrática mediante la sintaxis de elementos de objeto. El siguiente ejemplo es equivalente al ejemplo anterior de 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>

Este ejemplo forma parte de un ejemplo más extenso; para obtener el ejemplo completo, vea Ejemplo de geometrías.

Vea también