I am looking for a way to be able to use the wpf Path element to draw a path that will represent a route on the map. I have the Route class that contains a collection of vertices and would like to use it for binding. I don't really know how to even start.. Any hints?
Add a comment
|
2 Answers
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
5 Comments
kubal5003
Awesome. I've written converters before, but somehow I couldn't have figured it out. I was thinking about using DataTemplates or styles or something like this, but this is a great solution. Thank you.
brunnerh
@PortlandRunner: It is just a property of type
Point[], debugging individual bindings is not the scope of this answer.brunnerh
@PortlandRunner: Then i do not understand what it is you are asking for, what is there more to say than it being a point array?
Wachid Susilo
@AutomateThis You should not remove comments. Lol
Automate This
@WachidSusilo - Oh look, another one was removed ;-)
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>
answered Sep 21, 2017 at 17:35
Hossein Narimani Rad
32.7k19 gold badges92 silver badges121 bronze badges
1 Comment
kubal5003
Thanks, I was struggling with this for the last 6 years :)