We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Port Label

What is the best way to display a label for a given port?

I currently have a label on the connector, but we have a use case where ports should be labeled even when there is no connector present.

Thanks!

13 Replies

SC Saranya Chandrasekaran Syncfusion Team November 24, 2014 09:10 AM UTC

Hi Jeremy,

Based on your query “What is the best way to display a label for a given port?", We have created simple sample to achieve your requirement. Please refer to the attached sample.

Sample Details:

In our sample, we have override the ControlTemplate of the ConnectionPort to display ConnectionPort with Label.

Please let us know if you require further assistance on this

Regards,

Saranya C


Attachment: ConnectionPortasLabel_879c529d.zip


JB Jeremy Branham November 30, 2014 02:42 AM UTC

Thank you. This is what I needed.


SC Saranya Chandrasekaran Syncfusion Team December 1, 2014 09:53 AM UTC

Hi Jeremy,

Thanks for the update.

Please let us know if need further assistance on this.

Regards,

Saranya C



MK Michael Katsarakis January 23, 2017 03:17 PM UTC

Hallo,

this sample is not nice. You don't see the port label.
The thext is inside the port and the port is normally to small.
I want to display the port label because not all the ports are same.
one Y port can only connected wit on Y port a X port with a Xport..

A way to overcome this is a Tooltip... but this means waist of time.

Regards
Michael



KR Keerthivasan Ramamoorthy Syncfusion Team January 24, 2017 01:31 PM UTC

Hi Michael, 
Requirement:” Need to display ConnectionPort with Label”. 
As we don’t have a label support for the ConnectionPort. In order to achieve the above requirement, we override the ControlTemplate of the ConnectionPort to display the ConnectionPort with Label in that sample and also we need a support to override the width and height of the label. 
 
Note: 
Could you please provide more details like screenshot/video to achieve your requirement at the earliest? 
 
Regards, 
Keerthivasan R. 



MK Michael Katsarakis January 25, 2017 10:07 AM UTC

Hallo,
            addPort(node, 70, 70, "Text in connectionPort is longer ");
            addPort(node, 120, 120, "smalltext");    
this Label Text is not full vissible.

See image..

Regards
Michael

Attachment: 00_2fcdb95.7z


MK Michael Katsarakis January 25, 2017 10:12 AM UTC

A label outside of port could be nice!

see image

Attachment: 00_c4abcba1.7z


KR Keerthivasan Ramamoorthy Syncfusion Team January 26, 2017 04:45 AM UTC

Hi Michael, 
As we updated earlier, we don’t have a label support for the ConnectionPort. In order to achieve to Show the ConnectionPort with Label, we override the ControlTemplate of the ConnectionPort to display the ConnectionPort with Label in that sample and set the Width and Height as double.Nan to ConnectionPort. We have provided a code example to represent this. Please refer the code example as below. 
 
Code Example: 
//Add Port to Node 
private ConnectionPort addPort(Node node, Int32 p1, Int32 p2,string text) 
{ 
ConnectionPort port = new ConnectionPort(node, new Point(p1, p2)); 
port.IsHitTestVisible = true; 
port.Style = this.Resources["style"] as Style; 
port.Tag = text; 
port.Width = double.NaN; 
port.Height = double.NaN; 
port.Node = node; 
node.PortVisibility = PortVisibility.AlwaysVisible; 
node.Ports.Add(port); 
return port; 
} 
 
 
  
Note:  
If the provided information not meet your requirement. Please provide more details like screenshot/video to achieve your requirement at the earliest. 
 
 
Regards, 
Keerthivasan R. 



MK Michael Katsarakis January 26, 2017 08:31 AM UTC

Hallo,

if you don't outcomment the:
port.Width = double.NaN; 
port.Height = double.NaN;
you can see the port text, but you cannot see the port.  '*)%*

It is ok if you say: "we don’t have a label support for the ConnectionPort"
I thing that is a very important thing. If i want to make a connection want to know
what kind of connection points i have. Of course i could solve this problem with
the help of tooltips.. propertyboxes etc. But clicking around is not so nice..

Regards
Michael







SS Suresh Shanmugam Syncfusion Team January 30, 2017 10:22 AM UTC

Hi Michael, 

We have prepared the sample based on your
requirement by overriding the ConnectionPort template and please find the sample in the below location. 
 

Regards, 
Suresh Shanmugam
 



MK Michael Katsarakis February 1, 2017 08:09 PM UTC

Hallo Jeremy,

Nice! I have as well orthogonal connectors.
I am not quite happy because if i put the :
            LineConnector connector = new LineConnector();
            connector.HeadNode = node;
            connector.TailNode = node1;
            connector.ConnectionHeadPort = port;
            connector.ConnectionTailPort = port2;

            connector.FirstSegmentLength = 20;
            connector.LastSegmentLength = 20;


... the label is crossed out!

See attachment

Regards
Michael

Attachment: Port_Label_452f4bbe.7z


MK Michael Katsarakis February 2, 2017 08:59 AM UTC

Hallo Sureth,

I have create an incident.
https://www.syncfusion.com/support/directtrac/incidents/172047

There are some more extensions about the ports.

Thanks
Michael


SS Suresh Shanmugam Syncfusion Team February 2, 2017 10:22 AM UTC

Hi Micheal, 

Please find the response for your queries as below, 

Query 
Response 
 
Nice! I have as well orthogonal connectors.
I am not quite happy because if i put the :
            LineConnector connector = new LineConnector();
            connector.HeadNode = node;
            connector.TailNode = node1;
            connector.ConnectionHeadPort = port;
            connector.ConnectionTailPort = port2;

            connector.FirstSegmentLength = 20;
            connector.LastSegmentLength = 20;


... the label is crossed out!
 
 
 
Reported issue : Connector is overlapped on label 
 
We don’t have support to avoid the connector overlapping on Label. If you avoid to this, please change the position of the TextBlock in the sample side. 
 
Following code snippet it used to change the position of the Label.  
 
 
<TextBlock Name="txtBlock" Margin="-10,10,0,0"                                                                                                   
                    Text="{BindingPath=DerivedName,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type                     
                  local:CustomConnectionPort}}}"/> 
 
 
 
I have create an incident. 
https://www.syncfusion.com/support/directtrac/incidents/172047

There are some more extensions about the ports.
 
 
 
We will update the response to your query in the respective incident – #172047.  Please follow up the incident for further updates. 

 
Regards, 
Suresh Shanmugam 


Loader.
Live Chat Icon For mobile
Up arrow icon