Path.Data Property

Definition

Namespace:

Windows.UI.Xaml.Shapes

Gets or sets a Geometry that specifies the shape to be drawn.

public:
 property Geometry ^ Data { Geometry ^ get(); void set(Geometry ^ value); };

Geometry Data();

void Data(Geometry value);

public Geometry Data { get; set; }

var geometry = path.data;
path.data = geometry;

Public Property Data As Geometry

<Path>
  <Path.Data>
    singleGeometry
  </Path.Data>
</Path>
- or -
<Path Data="moveAndDrawCommands"/>

Property Value

Geometry

A description of the shape to be drawn.

Examples

The following example uses a Path to draw an ellipse.

<Canvas> 
  <Path Fill="Gold" Stroke="Black" StrokeThickness="1">
    <Path.Data>
      <EllipseGeometry Center="50,50" RadiusX="50" RadiusY="50" />
    </Path.Data>
  </Path> 
</Canvas>

In XAML, you can also use Move and draw commands syntax as the value for the Data property. This example uses this syntax to specify the shape of a Path.

<Canvas>
  <Path Stroke="DarkGoldenRod" StrokeThickness="3"
    Data="M 100,200 C 100,25 400,350 400,175 H 280"/>
</Canvas>

The Data attribute string begins with the move to command, indicated by "M", which establishes a start point for the path in the coordinate system of the Canvas. Strings in the Move and draw commands syntax are case-sensitive and determine whether commands use relative (offset) or absolute coordinates. The first segment is a cubic Bezier curve beginning at (100,200) and ending at (400,175), drawn using the two control points (100,25) and (400,350).

The second segment begins with an absolute horizontal line to command "H", which specifies a line drawn from the preceding subpath's endpoint (400,175) to a new endpoint (280,175). Because it is a horizontal line to command, the value specified is an x-coordinate.

See also

• Move and draw commands syntax