Share via

  • Article

PathFigure

Microsoft Silverlight will reach end of support after October 2021. Learn more.

Represents a subsection of a geometry, a single connected series of two-dimensional geometric segments.

<PathFigure   ...>
  oneOrMorePathSegments
</PathFigure>

XAML Values

Value

Description

oneOrMorePathSegments

One or more of the following object elements that derive from PathSegment: ArcSegment, BezierSegment, LineSegment, PolyBezierSegment, PolyQuadraticBezierSegment, or QuadraticBezierSegment. Object elements defined here become members of the Segments collection when scripting accesses the Segments property at run time.

Managed Equivalent

PathFigure

Remarks

The defining property of a PathFigure object is its StartPoint, because it specifies the point from which the first contained line segment starts.

If you want a geometry in which various figures are not connected to one another, you would specify multiple PathFigure objects, each with different StartPoint values, in the PathFigureCollection.

For more information on basic concepts, see Geometries. Note that the Geometries topic is written primarily for users of the managed API, and may not have code examples or specific information that address the JavaScript API scenarios.

Example

The following example creates a simple PathGeometry object composed of a single PathFigure with a LineSegment and displays it by using a Path element. The PathFigure object's StartPoint value is set to 10,20, and a LineSegment is defined with an end point of 100,130. The following illustration shows the PathGeometry created by this example.

A PathGeometry that contains a single LineSegment

Diagonal line.

<Canvas  
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"> 
  
  <Path Stroke="Black" StrokeThickness="1">
    <Path.Data>
      <PathGeometry>
        <PathGeometry.Figures>
          <PathFigure StartPoint="10,20">
            <PathFigure.Segments>
              <LineSegment Point="100,130"/>
            </PathFigure.Segments>
          </PathFigure>
        </PathGeometry.Figures>
      </PathGeometry>
    </Path.Data>
  </Path> 
</Canvas>

This following example uses multiple segments in a PathFigure.

A PathGeometry

Pathfigure

<Canvas  
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"> 
  
  <Path Stroke="Black" StrokeThickness="1" >
    <Path.Data>
      <PathGeometry>
        <PathGeometry.Figures>
          <PathFigure StartPoint="10,50">
            <PathFigure.Segments>
              <BezierSegment
                Point1="100,0"
                Point2="200,200"
                Point3="300,100"/>
              <LineSegment Point="400,100" />
              <ArcSegment
                Size="50,50" RotationAngle="45"
                IsLargeArc="True" SweepDirection="Clockwise"
                Point="200,100"/>
            </PathFigure.Segments>
          </PathFigure>
        </PathGeometry.Figures>
      </PathGeometry>
    </Path.Data>
  </Path> 
</Canvas>

See Also

Reference

PathGeometry

PathSegment