Path drawing and data binding Path drawing and data binding wpf wpf

Path drawing and data binding


The main thing you'll need for the binding is a converter that turns your points into Geometry which the path will need as Data, here is what my one-way converter from a System.Windows.Point-array to Geometry looks like:

[ValueConversion(typeof(Point[]), typeof(Geometry))]public class PointsToPathConverter : IValueConverter{    #region IValueConverter Members    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)    {        Point[] points = (Point[])value;        if (points.Length > 0)        {            Point start = points[0];            List<LineSegment> segments = new List<LineSegment>();            for (int i = 1; i < points.Length; i++)            {                segments.Add(new LineSegment(points[i], true));            }            PathFigure figure = new PathFigure(start, segments, false); //true if closed            PathGeometry geometry = new PathGeometry();            geometry.Figures.Add(figure);            return geometry;        }        else        {            return null;        }    }    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)    {        throw new NotSupportedException();    }    #endregion}

Now all that is really left is to create an instance of it and use it as the converter for the binding. What it might look like in XAML:

<Grid>    <Grid.Resources>        <local:PointsToPathConverter x:Key="PointsToPathConverter"/>    </Grid.Resources>    <Path Data="{Binding ElementName=Window, Path=Points, Converter={StaticResource ResourceKey=PointsToPathConverter}}"          Stroke="Black"/></Grid>

If you need the binding to update automatically you should work with dependency properties or interfaces like INotifyPropertyChanged/INotifyCollectionChanged

Hope that helps :D


Also you can try it this way:

public static class PathStrings{    public const string Add = "F1 M 22,12L 26,12L 26,22L 36,22L 36,26L 26,26L 26,36L 22,36L 22,26L 12,26L 12,22L 22,22L 22,12 Z";}

Then in the resource create a PathString

<Window.Resources>    <yourNamespace:PathStrings x:Key="pathStrings"/></Window.Resources>

then bind it this way:

<Path Stroke="Black" Fill="Black"       Data="{Binding Source={StaticResource pathStrings}, Path=Add}"></Path>