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

SymbolPaletteItem as Node with ports and image

Hello, I am actually doing some customization on Node within the symbolpalette (eg. adding input and output ports, assigning them color etc). I need to add the content of the SymbolPaletteItem as Node with ports (Input and Output port) and also in that Node, I need to show the image with some text and also change the orientation of to display the image and text vertically in SymbolPalette. Now, when we drag and drop the custom SymbolPaletteItem, the dropped will contain the Input and Output ports and also image.

19 Replies

RA Ranjitha Amirthalingam Syncfusion Team February 20, 2015 11:23 AM UTC

Hi Amruta,

Thanks for using Syncfusion products.

Requirement: Dropped Node containing Image with text and ports (Input, output)

We have a support to achieve your requirement. We have provided a sample to represent this. Please refer to the sample from the following link

Sample Link:

Symbolpalette_135618.zip

Sample Details:

In the given sample, we have added image and text in a stackpanel, the stackpanel is then added to the content of the Node (SymbolPaletteItem).  

If our solution is different from your requirement, please share /sample/video/description of your requirement. So that, we can work towards fulfilling your requirements.

Please let us know if you require further assistance on this,

Regards,                  

Ranjitha A





AM amruta February 23, 2015 04:46 AM UTC

Hi Ranjitha,
Thanks for the solution, but still i have some queries

1. I want fixed port means now we can move the ports i want them fix in position
2. Can we expand and collapse symbol palette groups
3. Run time connection, dont want to drag and drop the connections


AM amruta February 23, 2015 12:33 PM UTC

Hi,

I am attaching image which show some of my requirements which will help you to understand my queries

Attachment: Picture1_2e16320c.rar


RA Ranjitha Amirthalingam Syncfusion Team February 24, 2015 12:34 PM UTC

Hi Amruta,

Thanks for providing Screenshot to represent your requirement

Please find the response to your queries as below

S.No

Query

Response

1 & 3

I want fixed port means now we can move the ports, i want them fix in position.

Run time connection, don’t want to drag and drop the connections

We have a support to achieve your requirement .We have created simple sample to represent this. Please refer to the sample from the following link.

Sample Link:

Sample Details:

We have added the image with text under Custom (group name) of the symbol palette.

Runtime Connection:

Requirement: “Drawing connections at runtime without drag and drop the connector from symbol palette”

We have achieved your requirement by using EnablleDrawingTools and DrawingMode property of Diagram View. Please refer to the sample from the above link.

2

Can we expand and collapse symbol palette groups

We don’t have support “to expand the symbol palette groups”. We have considered your requirement as feature request. In order to have a better follow up we have created new incident #135774 for this feature. Please make use of this incident for future updates.

Please let us know if you require further assistance on this,

Regards,

Ranjitha A




RA Ranjitha Amirthalingam Syncfusion Team February 24, 2015 01:08 PM UTC

Hi Amruta,

Sorry for the inconvenience caused.

Please refer the sample from the following link

Sample Link:
symbolplte_118278.zip

 

Please let us know if you require further assistance on this

Regards,

Ranjitha A.




AM amruta February 25, 2015 04:59 AM UTC

Thank you ranjitha for your support.

I tried that solution previously.

1. I want auto connector when mouseover on ports of node, i tried but it is not working property.

2. I need to expand and collapse the symbolpalettegroups so can we solve this problem with groupbar; 
    2.1. can we drag and the items from groupbar to diagram control
    2.2. can we set ports to groupbar items


RA Ranjitha Amirthalingam Syncfusion Team February 26, 2015 12:36 PM UTC

Hi Amruta,

Please find the response to your queries as below,

S.No

Query

Response

1

I want auto connector when mouseover on ports of node, i tried but it is not working property.

We have some suggestions to achieve your requirement. Please refer to the suggestion as below.

Suggestion #1:

We have achieved your requirement “to draw line connector while moving the mouse on ports of node”. Please refer to the code snippet

Code Snippet:

void diagramView_NodeDrop(object sender, NodeDroppedRoutedEventArgs evtArgs)

        {

           if(evtArgs.DroppedNode!=null)

           {

             

               Node n = (evtArgs.DroppedNode as Node);

               foreach(ConnectionPort p in n.Ports)

               {

                   p.MouseEnter += p_MouseEnter;

               }

         }

}

void p_MouseEnter(object sender, MouseEventArgs e)

        {

            LineConnector line = new LineConnector();          

            line.ConnectorType = ConnectorType.Straight;

            line.ConnectionHeadPort = (sender as ConnectionPort);

            line.HeadNode = (sender as ConnectionPort).Node;

            line.EndPointPosition = new Point((sender as ConnectionPort).Node.OffsetX + 20, (sender as ConnectionPort).Node.OffsetY - 20);

            diagramModel.Connections.Add(line);

        }

Suggestion #2:

We have achieved your requirement by using EnablleDrawingTools and Drawing Mode property of Diagram View. Please refer to the Video from the following link.

Video Link:
118278_video.zip

If our suggestions are different from your requirement, please share video/sample to represent your requirement. So that, we can work towards fulfilling your requirements

2

I need to expand and collapse the symbolpalettegroups so can we solve this problem with groupbar; 

   

2.1. can we drag and the items from groupbar to diagram control

   

2.2. can we set ports to groupbar items

Yes, we have support to drag and drop the items from the other items control to diagram control and also set ports to them. We have provided sample to represent this. Please refer to the sample from the following link

Sample Link
symbolplte_118278.zip

Sample Details:

In the given sample, we have drag and drop the items from the groupbar to the diagram control and also set ports for the groupbar items.

Please let us know if you require further assistance on this,

Regards,

Ranjitha A




AM amruta February 27, 2015 04:33 AM UTC

Hi Ranjitha,

Thank you for your support by may be symbolplte.zip has not loaded propery can you please resend it.


RA Ranjitha Amirthalingam Syncfusion Team March 2, 2015 04:33 AM UTC

Hi Amruta,

 

Sorry for the inconvenience caused.

Please refer to the sample from the following link

Sample Link:
symbolplte_118278.zip

 

Please let us know if you require further assistance on this

Regards,

Ranjitha A




AM amruta March 3, 2015 04:48 AM UTC

Thank you so much Ranjitha, It was really helpful for us... 


AM amruta March 3, 2015 01:51 PM UTC

hi,

Can we add context menu to diagram control


AM amruta March 4, 2015 05:51 AM UTC

Sorry for such a question. It was some code that did not let context menu open.


RA Ranjitha Amirthalingam Syncfusion Team March 4, 2015 07:01 AM UTC

Hi Amruta,

Requirement: Support to add ContextMenu to the Diagram Control

We have support to add ContextMenu to the Diagram Control. We have created simple sample to represent this. Please refer to the sample and the video from the following link

Sample Link:
ContextMenu_118278.zip

Video Link:
Video_118278.zip

Sample Details:

In the given sample, we have added ContextMenu to the Node and Diagram View.

 

For more information, please refer to the following online help documentation link

Link: http://help.syncfusion.com/ug/wpf/documents/customizethecontextm.htm

 

Please let us know if you require further assistance on this,

Regards,

Ranjitha A.




AM amruta March 5, 2015 07:02 AM UTC

auto connectors should not have null head or tail node


RA Ranjitha Amirthalingam Syncfusion Team March 6, 2015 07:25 AM UTC

Hi Amruta,

Requirement: LineConnector needs to validate head and tail node

We have a support to achieve your requirement by using Events of DiagramView. The ConnectorDragStart and ConnectorDragEnd events are used to validate the Properties of the Connector. We have also represent this validation scenario in our dashboard sample (“InPort and OutPort demo”).Please refer to our Dashboard sample from the following link

Link: Dashboard->WPF->Diagram->Editable Diagram->InPort OutPort Demo

Please let us know if you require further assistance on this,

Regards,

Ranjitha A




SG Stratos Geroulis September 30, 2016 10:19 PM UTC

Hello,

I used the provided code in the first reply and I am having a problem. When I add an extra node to the code and then add it to the diagram like so "diagram.Model.Nodes.Add(n2)" it is added but it cannot be moved, selected, resized or interacted with in any way, where if I drag and drop a node to the diagram it's fully functional. Do I have to invalidate something or add it to another collection? Or maybe add it in another way?

Thank you,
Stratos

Attachment: Symbolpalette_135618_38d00f9a.zip


RA Ranjitha Amirthalingam Syncfusion Team October 3, 2016 12:48 PM UTC

Hi Stratos, 
 
Reported Issue: Unable to drag/resize the Node. 
 
Thanks for sharing sample to represent the issue. We have modified the sample to resolve the reported issue. Please refer to the sample from the following link: 
 
 
Sample Changes: 
In the sample, we have modified the IsHitTestVisible property of the newly added Node as True. By default, IsHitTestVisible property of the Node as True. In order to restrict node movement inside the Palette, we have set the IsHitTestVisible property of the Node as False. Since, we have added the node as content to the SymbolPaletteItem.  
 
Regards, 
Ranjitha A. 



SG Stratos Geroulis October 3, 2016 02:10 PM UTC

Hello,

This makes total sense. It works as expected. I knew it was something very simple like that.

Thank you for the excellent support!
Stratos


RA Ranjitha Amirthalingam Syncfusion Team October 4, 2016 04:57 AM UTC

Hi Stratos,  
 
 
Thanks for your update. 
 
Please let us know if you require further assistance on this. 
 
 
Regards, 
Ranjitha A. 


Loader.
Live Chat Icon For mobile
Up arrow icon