WPF/C#: Get the endpoint of the a dynamic path and add an object to it

Question

Hi,

I am looking for way to get the endpoint of a dynamic path and add on object to it - similar to this kind of pattern:

where the red circle is where the endpoint of the given path is located. take note that the path is created thus, instead of this:

<Path x:Name="path" Data="M621,508 L582.99987,518.00011 569.99976,550.00046 511.9996,533.00032 470.9995,509 485.99953,491.99981" Margin="469,0,0,168" Stretch="Fill" Stroke="Black" StrokeThickness="4" Height="62" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="154" Visibility="Hidden"/>

I made use of this:

<Path Stroke="Black" x:Name="path1" Data="{Binding MyProperty1}"  Margin="0" StrokeThickness="4"/>

where I get the path data from a database.

Any suggestions/comments?

PS. I am trying to place an object/image (moving or non-moving) at the endpoint of the path.

Answer 1

Hm, reiterating my comments above, presumably you have something like this

public class PathViewModel 
{
    public ObservableCollection<Point> Points { get; private set; }
    PathViewModel ()
    {
        Points = new ObservableCollection<Point> ();
    }
}

simply extend this model by implementing INotifyPropertyChanged, and creating an explicit property for last point in path,

public class PathViewModel : INotifyPropertyChanged
{
    private static readonly PropertyChangedEventArgs OmegaPropertyChanged = 
        new PropertyChangedEventArgs ("Omega");

    // returns true if there is at least one point in list, false
    // otherwise. useful for disambiguating against an empty list
    // (for which Omega returns 0,0) and real path coordinate
    public bool IsOmegaDefined { get { return Points.Count > 0; } }

    // gets last point in path, or 0,0 if no points defined
    public Point Omega 
    { 
        get 
        { 
            Point omega;
            if (IsOmegaDefined)
            {
                omega = Points[Points.Count - 1];
            }
            return omega;
        } 
    }

    // gets points in path
    public ObservableCollection<Point> Points { get; private set; }

    PathViewModel ()
    {
        Points = new ObservableCollection<Point> ();
    }

    // interfaces

    #region INotifyPropertyChanged Members

    public event PropertyChangedEventHandler PropertyChanged;

    #endregion

    // private methods

    private void Points_CollectionChanged (
        object sender,
        NotifyCollectionChangedEventArgs e)
    {
        // if collection changed, chances are so did Omega!
        if (PropertyChanged != null)
        {
            PropertyChanged (this, OmegaPropertyChanged);
        }
    }

}

the only thing worth noting is firing the property changed event when the collection changes. this notifies WPF that the model has changed.

Now, in Xaml land,

<!-- assumes control's DataContext is set to instance of PathViewModel -->
<Path 
    Stroke="Black" 
    x:Name="path1" 
    Data="{Binding Path=Points}"  
    Margin="0" 
    StrokeThickness="4"/>
<!-- or whatever control you like, button to demonstrate binding -->
<Button 
    Content="{Binding Path=Omega}" 
    IsEnabled="{Binding Path=IsOmegaDefined}"/>

Ok, so IsEnabled above won't hide the image\button, but binding to Visibility is a simple matter of either a) changing our view model to expose a visibility property, or b) binding to a value converter that converts our boolean to a visibility enum.

Hope this helps! :)