Drag / Drop functionality for Tree View

[Brainsaw]

Hello community,

as suggested by CuteAlien in my thread about my editor (Y.A.I.S.E.) I tried to implement drag / drop function for the Tree View. It works as far as I can tell, but I have the habit (or weakness) to rarely see any side-effects of what I implement (would save me a lot of work ). Here is what I have changed:

New GUI events:

• new GUI event "EGET_TREEVIEW_NODE_DRAG" which is fired when a node is dragged (i.e. left button is down and mouse is no longer on the node dragged)
• new GUI event "EGET_TREEVIEW_NODE_WILL_DROP": this is fired right before the actual movement in the tree happens. Listening to this event and calling the new method "cancelNodeDrag" will cancel dragging. This way dropping a node can be prevented
• new GUI event "EGET_TREEVIEW_NODE_DROP": an event triggered when the actual drop happens
• last new GUI event: "EGET_TREEVIEW_DRAG_CANCELED" is fired when dragging is canceled, i.e. when the programmer cancels the drag with the method mentioned before or when the node is dropped on a node which isn't possible, i.e. one of it's own children

In the "IGUITreeView" interface I have added three new virtual methods:

• draggingAllowed(bool): by default drag / drop is not active, it needs to be activated calling this method
• cancelNodeDrag(void): tell the tree that you don't want the dragging which is in progress to continue
• getNodeAt(position2di): get the tree node underneath the mouse. This method doesn't need to be exposed, but I think it might be handy for many people

In the implementation of the tree view I have done these changes:

• The "CGUITreeViewNode" got a new method "addChildNode" which takes a node given as parameter and adds it as a child of the current node
• Added new members "Dragged" (the node which is dragged), "DragCandidate" (the node clicked on which might be dragged later on) and "AllowDragDrop", a flag to (de)activate the functionality. For the next points I assume that the flag is "true"
• if a left mouse click is detected the node under the mouse pointer becomes the "DragCandidate"
• if the mouse is moved and hovers another node of the tree the "DragCandidate" becomes the "Dragged" member, "DragCandidate" is reset to "0". The event "EGET_TREEVIEW_NODE_DRAG" is fired and the "LastEventNode" member is set to the dragged node
• if the left mouse button is left up and "Dragged" is not "0" the following happens:
  • the node underneath the mouse cursor becomes the "dropCandidate"
  • if the "dropCandidate" equals the dragged node nothing happens, dragging is canceled silently
  • if the "dropCandidate" is a child of "Dragged" dragging is canceled and a "EGET_TREEVIEW_DRAG_CANCELED" event is fired. "Dragged" is reset to "0". The dragged node is "LastEventNode". This does also happen if the node is not dropped on another node.
  • if "Dragged" is still set (not "0") a "EGET_TREEVIEW_NODE_WILL_DROP" is triggered. The "LastEventNode" member is set to the drop target. Now the developer of the app can cancel the dragging if necessary
  • if "Dragged" is still set (not "0") the dragged node is moved and becomes a child of the drop target. A "EGET_TREEVIEW_NODE_DROP" event is fired with the drop node as "LastEventNode"

I have uploaded the diffs to https://dustbin-online.de/download/TreeViewDragDrop.zip.

Now it's up to you: what did I not think of, what did I break, what doesn't work? I think I'll give my changes a try next weekend and include it into "Y.A.I.S.E.".

[CuteAlien]

Cool. Will test soon. On first view interface sounds pretty good to me.

Not sure if EGET_TREEVIEW_DRAG_CANCELED should be called when users calls cancelNodeDrag. I think events are usually not send when users do the action - otherwise users might want to add code in the handler to exclude the case where the cancel was caused by the coder, but that info isn't available. While it's always easy to run the same code which you run in the event-handler in another place.

Some bikeshedding comments:
- Irrlicht uses Allman indention/bracket style, not K&R style. Please try to make it look like the other Irrlicht code.
- Mostly (except in the few cases which messed it up) all setter functions start with set so it should be setDraggingAllowed (or setAllowDragging or setCanDrag).

More comments likely after testing ;-)

[Brainsaw]

I was also not sure on whether or not to send the Cancel event when the user cancels - this only informs him of what he's doing.

I was trying to follow the code style I saw, but it's completely different from mine . I guess I can get used to it.

Looking forward to some more comments.

[CuteAlien]

Which tool did you use to create the patch? Seems to not be an svn patch, so I'm not sure right now what tool to use to apply it automatically (could do manually, but I'd prefer not to...). Or if you have full files in some open repository I could just copy them over (have no other changes to those files right now anyway).

[Brainsaw]

As I don't have SVN installed on my system at the moment I have downloaded a dump on Monday and used WinMerge to compare. I have however uploaded the complete files to http://forumdata.dustbin-online.de/TreeViewDragDrop.zip, this package also includes the little app I have written do develop the update (test_main.cpp).

Edit: and sorry for the code formatting. I need to find out if Visual Studio allows per-project code formatting settings

[CuteAlien]

Ah, always nice to have a test! Still have to test a bit more and look at code, but at least test works without obvious problems.
What's missing mainly right now is a bit feeback. Partly tricky because we don't switch cursors inside Irrlicht, I guess that part can be done by handling events (and maybe even better as it may be easier then for users to control cursors).
Maybe we could attach the node to the cursor? Probably a bit tricky (and risks of it getting stuck etc).
Or maybe avoid selection while drag&drop and instead draw some "target" line.
And one change that could mabye be done without too much trouble and could help a bit: Select the dropped element after placement and open the node above it (I think there should be enough functions for that by now, I remember I needed something similar when I used the treenode).

I'll find some more time soon.

[Brainsaw]

Thanks for the feedback, I'll try to look into it again in the next couple of days. At the moment my day-time job has me pretty exhausted after work, so I don't think I'll do anything before the weekend.

I also though about some better feedback, e.g. having the text of the dragged node attached to the cursor.

[Brainsaw]

I have uploaded a new version to the link in the original post: If a node is now dragged it is displayed at the cursor. I used two colors of the skin, EGDC_WINDOW as background and EGDC_BUTTON_TEXT as text color. I thought it may look weird that way but I think it does rather look natural.

[CuteAlien]

Nice. I'll check it out.