How to build PathGeometry using C#?

Question

I have the following XAML in Windows Phone 8.1 app running with Windows Runtime:

<Canvas Name="drawSplice"
        Grid.Row="1"
        Grid.Column="0"
        Height="80"
        Width="80"
        Background="White">

        <Path Stroke="Black"
                      StrokeThickness="2"
                      Data="M 10,10 C 10,50 65,10 65,70" />
</Canvas>

It gives me the following shape:

enter image description here

My question is how to generate such instance of path class using C#?

Windows.UI.Xaml.Shapes.Path path = new Windows.UI.Xaml.Shapes.Path();

//path.Data = "";

path.StrokeThickness = 3;
path.Stroke = new SolidColorBrush(Colors.Black);
Drawer.Children.Add(path);

score 1 · Answer 1 · answered Jun 04 '15 at 03:40

You can use a XamlReader to parse and load a Xaml object from your string. You'll need a full Xaml object to read in the path data, not just the data itself:

// The path data we want to create
string pathXaml = "M 10,10 C 10,50 65,10 65,70";

// A Xaml container for the path object.
// This could also set other properties like Stroke and StrokeThickness
string xaml = "<Path " +
"xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'>" +
"<Path.Data>" + pathXaml + "</Path.Data></Path>";

// Read the Xaml string into a Path object
Windows.UI.Xaml.Shapes.Path path = XamlReader.Load(xaml) as Windows.UI.Xaml.Shapes.Path;

// Set other properties we skipped above
path.StrokeThickness = 3;
path.Stroke = new SolidColorBrush(Colors.Blue);

// Add it to our Canvas
drawSplice.Children.Add(path);

You could also build the path up from objects. The Path.Data is a PathGeometry, which contains a PathFigure (in your case one, but it could be more), which contains PathSegments (in your case a single BezierSegment). Using markup is easier. To see how this works you can create a Path from markup or XamlLoader and then examine its collections to see how it's built up.

Note that the path in your Xaml doesn't match the image you included. The given Xaml path is a cubic Bezier rather than an ellipse. If you want an ellipse you can use an Ellipse, or build the Path from an EllipseGeometry or ArcSegments.

score 1 · Answer 2 · answered Jun 04 '15 at 04:16

You can use this. It will be helpful for you.

string data = "M 10,10 C 10,50 65,10 65,70";
        string xaml = "<Path xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' Data='" + data + "'/>";
        var LoadPath = Windows.UI.Xaml.Markup.XamlReader.Load(xaml); 
        Windows.UI.Xaml.Shapes.Path path = LoadPath as Windows.UI.Xaml.Shapes.Path;
        path.StrokeThickness = 3;
        path.Stroke = new SolidColorBrush(Windows.UI.Colors.Black);
        drawSplice.Children.Add(path);

score 1 · Accepted Answer · answered Jun 04 '15 at 05:41

1

I have use the following technique:

var b = new Binding
{
   Source = "M 10,10 C 10,50 65,10 65,70"
};
BindingOperations.SetBinding(path, Path.DataProperty, b);

and it is working perfectly on Windows Phone 8.1.

answered Jun 04 '15 at 05:41

gotqn

42,737
46
157
243

How to build PathGeometry using C#?

3 Answers3