Drag and Drop Without Creating a New Shape Instance

[Tim]

Hi there! 

I have a RadDiagram project that I'm currently working on and need a bit of advice on the best approach. Currently, I am listing out an ObservableCollection called CurrentExampleItems and binding it to an ItemsControl, and the DataTemplate is a UserControl of a CustomShape. I'd like to allow users to drag the UserControl from the StackPanel and have it drop on the grid, but to not create a copy. The idea being that there is only one of these ExampleItems that can be placed on the Grid, so if its on the grid, I dont want to show it in the StackPanel.

All examples I've played with our developed include the OnDragInitialize function to create a duplicate object based on the source, but I think I'd have to do something slightly different to enable this.

Any thoughts?

<StackPanel Background="White" x:Name="stackExampleItems" Orientation="Vertical" telerik:DragDropManager.AllowCapturedDrag="True" >
                    <ItemsControl ItemsSource="{Binding CurrentExampleItems}" >
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <local:ExampleItemView DataContext="{Binding }"   />
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </StackPanel>

[Tina Stancheva]

Hello Tim,

In order to implement your scenario you will need to create entirely customized drag/drop operation. For that purpose you can use the DragDropManager. You can take a look at its GettingStarted tutorial that can take you through the basic steps required to describe a custom drag and drop operation.

Also, as the ItemsControl displays a collection of business items, I'd recommend using a data-binding approach with RadDiagram as well. This means that you will have to bind the GraphSource property of the control to a business collection. This way your drag and drop implementation will work only with the business data. The DataBinding article in the RadDiagram documentation provides more information regarding the GraphSource property so please have a look at it as well.

For your convenience I attached a sample solution demonstrating the described approach. Please have a look at it and let us know if we can further assist you.

Regards,
Tina Stancheva
Telerik

[Tim]

Thanks Tina! I had it 90% of the way there, but your code really helped me get it correct. Much appreciated.

[Tim]

Hi Tina,

Actually, there is one small issue using this functionality that I can't get to the bottom of.

I have this Drag and Drop solution for items (as you described), but I also have a panel where I can drag in RadDiagramContainerShapes. If I drag an item onto the diagram first, then drag it into a RadDiagramContainer shape, everything works as expected. However, if I try dragging the item directly into the RadDiagramContainerShape, the OnDiagramDrop function is never triggered.

I've tried adding DragDropManager.AddDropHandler(diagramContainerShape, OnDiagramDrop) on the Diagram Shapes when I drag them in...but that doesn't seem to ever be triggered either.

[Miro Miroslavov]

Hi Tim,
Since the RadDiagramContainerShape is handling the Drop operation separately, you should handle the drop on the container as well - as you tried actually. But since the ContainerShape is handling the event, you should add the handler with the third argument "true":

DragDropManager.AddDropHandler(containerShape, OnDrop, true);

This means that you will handle the "handled" events too.
Please let us know if this works for you.

Regards,
Miro Miroslavov
Telerik