Connection Style

2 posts, 0 answers
  1. Mike
    Mike avatar
    13 posts
    Member since:
    Dec 2010

    Posted 10 Jan 2014 Link to this post

    I would like to have connections styled depending on the nodes they are connecting.

    For example, I have node types A, B.  All connections from A -> A, A -> B, B -> A will be ConnectionStyle1.  All connections for B -> B will be ConnectionStyle2.

    I am currently using the MVVM implementation of DiagramGraphSouce and it is working very well.  I am also using StyleSelector for both Connection and Shape.

    Attempting this from within the ConnectionStyleSelector does not work as the item.Target is always null (the connection has not been established with the Target yet).

    Clearly the easy solution is for ConnectionStyleSelector to be called both BEFORE and AFTER the link is established, allowing me to detect Source and Target are of type B and return the necessary style.  No such luck.

    I tried from within DiagramGraphSource.AddLink() which is called after the connection is established.  There are SourceCapType and TargetCapType properties that would fulfill my styling requirement.  Unfortunately, setting these properties does nothing.

    Finally I tried using ConnectionManipulationCompleted() where I am able to manipulate the connection ends.  Alas, there is no way to retrieve the VM of the nodes involved in the Source and Target of the connection, so there is no way to tell what node types I'm actually connecting.  

    I thought of actually creating a VM for my connections (not just the nodes), but that seems like a lot of effort for something that sounds like it should be very easy to accomplish.

    Am I missing something?

  2. Pavel R. Pavlov
    Pavel R. Pavlov avatar
    1237 posts

    Posted 15 Jan 2014 Link to this post

    Hello Mike,

    Instead using the ConnectionStyleSelector you can define one Style targeting the RadDiagramConnection and bind the properties that you need to change to properties exposed by your ViewModel. In your particular case you need to bind the TargetCapType and the SourceCapType properties of the RadDiagramConnection to your custom properties.

    Furthermore, you can subscribe to the PropertyChanged event of your custom link and change the TargetCapType and the SourceCapType properties when the target shape is of type B. You can use similar to this code:

    public class MyLink : LinkViewModelBase<MyNode>
        public MyLink()
            this.PropertyChanged += MyLink_PropertyChanged;
        void MyLink_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
            if (e.PropertyName == "Target")
                //your custom logic goes here
    Please give this approach a try and let me know if you need any further assistance.

    Pavel R. Pavlov
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
Back to Top