This is a migrated thread and some comments may be shown as answers.

Display a form by doubl clicking on a RadDiagramShape

5 Answers 178 Views
Diagram, DiagramRibbonBar, DiagramToolBox
This is a migrated thread and some comments may be shown as answers.
Tom
Top achievements
Rank 1
Veteran
Tom asked on 16 Sep 2020, 10:56 PM

I am using a RadDiagram control to place custom RadDiagramsShapes on it (C#). One of my requirements is to display a Form by double-clicking on a Shape. I followed the rationale of https://www.telerik.com/forums/assigning-raddiagramshape-mouseclick-eventhandler-programmatically, but I have not been capable of implementing the necessary event handler. I checked the documentation and looked for examples that could help me. However, I have not found anything useful to solve this issue.

I am just starting in winForms and C#, so I would be very grateful if you could help me with this problem.

Thank you.

5 Answers, 1 is accepted

Sort by
0
Nadya | Tech Support Engineer
Telerik team
answered on 18 Sep 2020, 02:02 PM

Hello, Tom,

RadDiagram offers a ShapeDoubleClicked event which is triggered when the user double clicks the shape. You can handle this event and show the form that you want. You can see the result in the attached gif file. 

 public RadForm1()
 {
     InitializeComponent();
     RadDiagramShape starShape = new RadDiagramShape()
     {
         Text = "",
         Shape = new StarShape(),
         BackColor = System.Drawing.Color.LimeGreen,
         IsEditable = false
     };
     starShape.Position = new Telerik.Windows.Diagrams.Core.Point(400, 100);
     radDiagram1.AddShape(starShape);
     this.radDiagram1.ShapeDoubleClicked += this.RadDiagram1_ShapeDoubleClicked;
 }

private void RadDiagram1_ShapeDoubleClicked(object sender, ShapeRoutedEventArgs e)
{
    RadForm form = new RadForm();
    form.Show();
}

I hope this helps. Should you have other questions do not hesitate to contact me. 

Regards,
Nadya
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Tom
Top achievements
Rank 1
Veteran
answered on 19 Sep 2020, 12:28 AM

Thank you very much, Nadya. Your answer confirmed my assumption and solved my doubt. But, If you don't mind, I would like to ask you how to connect RadDiagramShapes by overlapping them. The shapes were created through buttons, without using the toolbox; thus, the ragDropService_PreviewDragDrop event is not accessible.

I am not sure if I must use the DragDrop, MouseDown, MouseUp, and MouseMove events of the RadDiagram (https://docs.telerik.com/devtools/winforms/controls/diagram/drag-and-drop/ole-drag-and-drop).

Again, I am very grateful for your help. Thank you.

0
Nadya | Tech Support Engineer
Telerik team
answered on 21 Sep 2020, 01:24 PM

Hello, Tom,

According to the provided information, it seems that you have RadDiagramShapes that are created programmatically in the code and you want to connect them. You should use RadDiagramConnection to connect shapes. RadDiagramConnection is basically an object that connects zero, one, or two shapes. 

You can use its extensive API to configure its source and target points or shapes. You can choose from a list of predefined cap types thus customizing the start and endpoint of the connection to better fit in your application scenario. You can also control the type of connection using the ConnectionType property, add custom content, and customize the overall look and feel of the items. I would recommend you to have a look at the following article where the connections are described: https://docs.telerik.com/devtools/winforms/controls/diagram/diagram-items/connections/connections 

Different connection types and examples are shown here: https://docs.telerik.com/devtools/winforms/controls/diagram/diagram-items/connections/connection-types 

OLE drag and drop is the standard MS drag/drop service and is used to perform drag and drop operation with RadDiagram. For example, dragging a shape from one diagram and drop it to another. You can refer to the following MSDN article for more information about drag and drop: https://docs.microsoft.com/en-us/dotnet/desktop/winforms/advanced/walkthrough-performing-a-drag-and-drop-operation-in-windows-forms?view=netframeworkdesktop-4.8 

So, if your requirement is to create connections between the shapes you have it is not necessary to use drag-drop events. You can check our Demo >> RadDiagram examples as well. 

I hope this information is useful. If you need any further assistance please let me know.

Regards,
Nadya
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

0
Tom
Top achievements
Rank 1
Veteran
answered on 30 Sep 2020, 12:17 AM

Thank You very much Nadja. I read those links, but it is not clear to me which event, if there is some one, I should use to create those connections. I would be extremely thankful if you could elaborate a bit more on this.

Thank you for your help.

0
Nadya | Tech Support Engineer
Telerik team
answered on 02 Oct 2020, 02:38 PM

Hello, Tom,

In order to create a connection, it is necessary to create a new instance of the RadDiagramConnection class. To connect two shapes you should just specify the Source and the Target properties and the shapes will be connected. Please refer to the following code snippet that demonstrates this:

 public RadForm1()
 {
     InitializeComponent();
     RadDiagramShape starShape = new RadDiagramShape()
     {
         Text = "",
         Shape = new StarShape(),
         BackColor = System.Drawing.Color.LimeGreen,
         IsEditable = false
     };
     starShape.Position = new Telerik.Windows.Diagrams.Core.Point(400, 100);
     radDiagram1.AddShape(starShape);

     RadDiagramShape starShape2 = new RadDiagramShape()
     {
         Text = "",
         Shape = new StarShape(),
         BackColor = System.Drawing.Color.LimeGreen,
         IsEditable = false
     };
     starShape2.Position = new Telerik.Windows.Diagrams.Core.Point(200, 100);
     radDiagram1.AddShape(starShape2);

     RadDiagramConnection connection1 = new RadDiagramConnection() { Name = "connection1" };
     connection1.Source = starShape2;
     connection1.Target = starShape;
     radDiagram1.Items.Add(connection1);
 }

I hope this helps. Let me know if I can assist you further.

Regards,
Nadya
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

Tags
Diagram, DiagramRibbonBar, DiagramToolBox
Asked by
Tom
Top achievements
Rank 1
Veteran
Answers by
Nadya | Tech Support Engineer
Telerik team
Tom
Top achievements
Rank 1
Veteran
Share this question
or