SF Diagram - Port to port connection restrictions.

[Srikanth]

Hi Team,

Is there a way to restrict port to port connections in SfDiagram.

For example, If would like to allow only red to red and green to green port connections. Is there a way to achive this using SfDiagram ?

Thanks,

Sri.

[Karkuvel Rajan Shanmugavel]

Hi Srikanth, 

 

We have a virtual method ‘ValidateConnection’ to override the connection behaviour. This method contains the source and target information in its arguments. You change the source and target as you wish, in your case please set target port to null if it an invalid connection. 

 

We have provided you code example , sample and documentation link to know more about them. Please follow the code example , sample link and Documentation link below. 

 

Code Example: 

 

//Method to Validate whether create connection or Not 

 

        protected override void ValidateConnection(ConnectionParameter args) 

        { 

            //Necessary Conditions before create or nullify the connection 

 

            if ((args.Connector as ConnectorViewModel).SourcePort != null && (args.Connector as ConnectorViewModel).TargetPort != null) 

            { 

                if (((args.Connector as ConnectorViewModel).SourcePort as Customport).Color != ((args.Connector as ConnectorViewModel).TargetPort as Customport).Color) 

                { 

                    args.TargetPort = null; 

                } 

            } 

        } 

 

Sample Link: http://www.syncfusion.com/downloads/support/forum/130254/ze/Validate_Connection589987054 

  

Documentation Link: https://help.syncfusion.com/wpf/sfdiagram/interaction#customization-and-validation-on-connector-ends 

 

Regards, 

Karkuvel Rajan.S 

[Srikanth]

Hi Rajan,

Thanks for your response. Let me make the requirement more clear. 

Above Redport, Greenport are inherited from 'NodePortViewModel'. The requirement is to allow connection only between similar color ports (in this case, red to red and green to green). When someone try to make connection between different ports (for example red to green), it should not allow or show the below connection preview.

Appreciate your support.

Thanks,

Sri.

[Karkuvel Rajan Shanmugavel]

Hi Srikanth, 

We have analysed your requirement. We have modified the code in the validate connection method in the sample provided on the last response. Please refer modified code example and sample link below. 

Code Example: 

        //Method to Validate whether to Create connection or Not 

        protected override void ValidateConnection(ConnectionParameter args) 

        { 

            var con = args.Connector as ConnectorViewModel; 

            if (args.TargetPort != null) 

            { 

                //For getting source and target port 

                var target = args.TargetPort as Customport; 

                var source = con.SourcePort as Customport; 

 

                //To validate sourceport color and targetport color 

                if (target.Color != source.Color) 

                { 

                    //Set targetport and targetnode as null 

                    args.TargetPort = null; 

                    args.TargetNode = null; 

                } 

            } 

        } 

 

        //Here args provided the necessary information of TargetPort,SourceNode,TargetNode based on the connection creation. 

Sample Link: http://www.syncfusion.com/downloads/support/forum/137361/ze/Validate_Connection1858545046 

Regards, 

Karkuvel Rajan.S