How to add UserControl to SfDiagram?

[Özgür]

Hello,

Can custom UserControl be added to SfDiagram? For example, can usercontroller items such as Button, TextBox, Chart be added to SfDiagram in Stencil?

There is an example in the link below, but the example does not work properly. Dragging items from the Stencil onto the Diagram is not added to the Diagram.It's also a CustomControl, not a UserControl.

https://github.com/SyncfusionExamples/WPF-Diagram-Examples/tree/master/Samples/Stencil/UserControlsInStencil

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

Sorry for the inconvenience caused. We have prepared a simple sample to achieve your requirement. In the sample, we have used custom node to render a UserControl as its ContentTemplate. Please find the sample in below attachment.

Regards,

Karkuvel Rajan S

Attachment: Forum182144_128a41e2.zip

[Özgür]

Thank you for the answer. The ComboBox in the dragged CustomNode in the demo does not work properly. Sometimes the choice can be made, sometimes not. I don't understand why.

My second question is when we want the Symbol in the Stencil to look different when a UserControl is added.

Is it correct to set the ContentTemplate, I made an example by adding to the demo below. Could you please check?

Attachment: Forum182144_e7ae6364.rar

[Özgür]

I prepared an example below showing what I want to do, but unfortunately I could not add an element to the Diagram.

I want to drag a UserControl with its default settings to the home screen. I wasn't sure how to do it?

Attachment: WpfApp9_d6dc1bf4.rar

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

Please find the response for your requirement in the below table.

Query	Response
when we want the Symbol in the Stencil to look different when a UserControl is added.   Is it correct to set the ContentTemplate, I made an example by adding to the demo below. Could you please check?	Yes, we have to set the ContentTemplate to give a different look to the item in the Stencil. The shared sample codes are fine and like that only we can achieve your requirement.
I prepared an example below showing what I want to do, but unfortunately I could not add an element to the Diagram.   I want to drag a UserControl with its default settings to the home screen. I wasn't sure how to do it?	We have validated the reported issue in the sample and fixed the issue in sample level. Please find the modified changes below.             ObservableCollection<NodeViewModel> _items = new ObservableCollection<NodeViewModel>();           public ObservableCollection<NodeViewModel> Items         {             get => _items;             set => SetProperty(ref _items, value);         }

Regards,

Karkuvel Rajan S

[Özgür]

Thank you for your answer. So, will there be a fallback regarding the ComboBox Item selection problem in the example you provided? It looks like a bug.

[Özgür]

I was able to add UserControl to Diagram successfully but how can I access UserControl's ViewModel. There is no TextControlViewModel at all as I have added a NodeViewModel. Also, as I mentioned above, the ComboBox cannot be selected seems to be a bug. Aşağıdaki demoyu kontrol edebilirsiniz

In some alternative scenarios that I want to create with the ViewModel, dragging from Stencil to Diagram does not occur. How to create a UserControl with its ViewModel in SfDiagram? How can I access the corresponding ViewModel for this generated Node?

Attachment: WpfApp9_da89fca8.rar

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

Please find the response for your requirement in the below table.

Query	Response
The ComboBox cannot be selected seems to be a bug	We are able to reproduce the reported issue. We will validate this issue and update you with more details on May 11, 2023.
There is no TextControlViewModel at all as I have added a NodeViewModel.    In some alternative scenarios that I want to create with the ViewModel, dragging from Stencil to Diagram does not occur. How to create a UserControl with its ViewModel in SfDiagram? How can I access the corresponding ViewModel for this generated Node?	To get the ViewModel of the UserControl after drag and drop, please use a custom property in CustomNode to set and get the ViewModel of the UserControl. We have prepared a simple sample for your requirement. In the sample we have used CustomContent class as DataContext or ViewModel class for the UserControl and set the CustomContent class in KnownTypes to serialize it. Please find the sample in below attachment.

Regards,

Karkuvel Rajan S

Attachment: Forum182144_Updated_e85c8c10.zip

[Özgür]

You said you would do an update on the 11th. Any progress on the matter?

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

Sorry for the inconvenience caused. We have found the root cause of the reported issue. Currently, we are working on the fix that will work for all the cases. We will update you with more details on May 18, 2023.

Regards,

Karkuvel Rajan S

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

We have confirmed the reported issue as a bug from our side. We will update you with more details of the bug report before EOD.

Regards,

Karkuvel Rajan S

[Özgür]

Thank you for the information, waiting for your reply.

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

We have considered the reported issue as bug from our end. We will fix the reported issue and include the same in our upcoming weekly NuGet which will be available on June 6, 2023.

To know more about the bug report please follow the below feedback link.

Feed Back link: Focus issue occurs in the Content Elements of the Node in WPF | Feedback Portal (syncfusion.com)

We will appreciate your patience until then.

Regards,

Karkuvel Rajan S

[Karkuvel Rajan Shanmugavel]

Hi Ozgur,

Reported issue: Unbale to edit the Content elements in Node.

We are glad to announce that our weekly NuGet was rolled out successfully. We have included the fix for the reported issue in this weekly NuGet.

NuGet Version: 21.2.9 

NuGet Link: https://www.nuget.org/packages/Syncfusion.SfDiagram.WPF/

Regards,

Karkuvel Rajan S