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

Limit drop to existing Nodes

3 Answers 35 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
ManniAT
Top achievements
Rank 2
ManniAT asked on 15 Jul 2013, 11:41 AM
Hi,

my approach (using MVVM) is something like your "OrgChart" example.

Assume this example, where you start with the CEO predefined.
Then from a list the user can drag employees to  the chart.
Employees can change their position (by being dragged to a different "chief / leader").
Every Employee is assigned to another one.
There are kind of employees which may not "rule" others (let's say trainees). These employees can't act as "drop destination"

So the rules are:
- One node is fixed (CEO)
- the user must drop the new / existing Node on an existing one
- depending on the node type dropping is enabled or not (Visual feedback should be provided - like containers do)

After a drop operation I recalculate the Org-Model add / remove connectors and redraw the chart.

Is there an easy way to achieve this?

Manfred

3 Answers, 1 is accepted

Sort by
0
Zarko
Telerik team
answered on 18 Jul 2013, 11:13 AM
Hi Manfred,
I'm not sure what do you mean by "easy way" but there's a way to achieve this. There are two ways to do this:
1) The easier way is to use DiagramContainerShapes because they already handle dropping in them and using the CommandExecuted event you can determine if it's a container drop or a drop somewhere else. Also you could use the IsDropEnabled property to enable/disable dropping.
2) Inherit our DiagramShapes and implement the IDragDropAware interface, this way you'll be able to handle the dnd of another shapes into them and add some custom logic for this.
For the fixed (CEO) shape you could use the PreviewDrag event and just handle it if you're trying to drag the CEO. The problem at the moment is that the RadDiagram doesn't support DnD from outside of it in MVVM scenarios. You could add our DropHandlers but this will be additional work and after the upcoming SP (next week) the Diagram will support this scenarios out of the box.
I've attached a very simple project demonstrating the first approach so could you please take a look and if you have further questions feel free to ask.

Regards,
Zarko
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0
ManniAT
Top achievements
Rank 2
answered on 19 Jul 2013, 07:08 AM
Hi Zarko,

thank you for the answer and the sample.
I already implemented your second idea and it works (almost) like intended.

First I tried to inherit the container - but the lack of routing and connectors as well as layout (I use networklayout) brought me to solution two.
Implementing IDropAware was pretty easy and by using DragDropManager I also managed to drop new Items from a RadGrid.

My Problem (therefore I wrote almost above) - is styling of the node.
If I keep the existing style everything works fine.
If I provide my own (extracted via Blend) I loose connector adorner and so forth (no longer theme aware)
I started a thread about it here http://www.telerik.com/community/forums/wpf/diagram/thema-aware-styling-with-connectors.aspx

I'd like to have my own style since I want to visualize possible drop operation - but since the "styling problem" is solved I stay with visual feedback via DnD cursor.

I'm curious about the upcoming "external DnD support" - maybe it makes the things a bit easier.

Thanks
Manfred
0
Accepted
Zarko
Telerik team
answered on 22 Jul 2013, 04:12 PM
Hi Manfred,
Could you please my answer from this thread - it explains the problem with the extracted style.
As for the "external DnD support" - after the service pack you'll be able to handle the DragInitialize event of the DragDropManager (for ListBox, Toolbox, ToolBar and etc.) and do something like this:
private void OnDragInitialized(object sender, DragInitializeEventArgs e)
{
    var container = e.OriginalSource as ListBoxItem;
    if (container != null)
    {
        var item = this.listBox.ItemContainerGenerator.ItemFromContainer(container) as NodeViewModelBase;
 
        var dragInfo = new DiagramDropInfo(new Size(60, 40), SerializationService.Default.SerializeItems(new List<IShape>() { new RadDiagramShape() { Content = item.Content } }));
        e.Data = dragInfo;
        e.AllowedEffects = DragDropEffects.All;
    }
}
(note: in the RadDiagramShape you can set whatever properties you like)
And when you drop this element in the RadDiagram the DeserializeNode method of your ISerializableGraphSource will be called with the deserialized RadDiagramShape so you could reconstruct your business object from its properties. This way you'll be able to transfer any information you want between the drag source and the RadDiagram.
I hope I was able to help you and if you have further questions please feel free to ask.

Regards,
Zarko
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
Tags
Diagram
Asked by
ManniAT
Top achievements
Rank 2
Answers by
Zarko
Telerik team
ManniAT
Top achievements
Rank 2
Share this question
or