show line between siblings when drag/dropping items to indicate target in treeview

Posted on 2010-09-24
Last Modified: 2013-11-26
During drag and drop of an item in a treeview:
How can our windows forms application show a line between siblings to indicate that the user can drop the item between siblings
Question by:joachim58
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
LVL 86

Expert Comment

by:Mike Tomlinson
ID: 33757362
Without more details...try something like the below out...

*It only allows "leaf nodes" to be dragged and they can only be dropped on other "leaf nodes".  It also assumes that the leaf nodes are NOT in the root of the TreeView. probably has some quirks left in it but it may give you some ideas:
Public Class Form1

    Private LastNode As TreeNode

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        TreeView1.AllowDrop = True
        TreeView1.HideSelection = False
    End Sub

    Private Sub TreeView1_MouseMove(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles TreeView1.MouseMove
        If e.Button = Windows.Forms.MouseButtons.Left Then
            Dim tn As TreeNode = TreeView1.GetNodeAt(e.X, e.Y)
            If Not IsNothing(tn) AndAlso tn.Nodes.Count = 0 Then
                LastNode = Nothing
                TreeView1.SelectedNode = tn
                Dim data As New DataObject("MyTreeNode", tn)
                TreeView1.DoDragDrop(data, DragDropEffects.Move)
            End If
        End If
    End Sub

    Private Sub TreeView1_DragEnter(ByVal sender As Object, ByVal e As System.Windows.Forms.DragEventArgs) Handles TreeView1.DragEnter
        e.Effect = IIf(e.Data.GetDataPresent("MyTreeNode"), DragDropEffects.All, DragDropEffects.None)
    End Sub

    Private Sub TreeView1_DragOver(ByVal sender As Object, ByVal e As System.Windows.Forms.DragEventArgs) Handles TreeView1.DragOver
        Dim tn As TreeNode = TreeView1.GetNodeAt(TreeView1.PointToClient(Cursor.Position))
        Dim sourceNode As TreeNode = e.Data.GetData("MyTreeNode")
        If Not IsNothing(tn) AndAlso tn.Nodes.Count = 0 AndAlso Not (tn Is sourceNode) Then
            If Not (tn Is LastNode) Then
                Using G As Graphics = TreeView1.CreateGraphics
                    G.DrawLine(Pens.Red, tn.Bounds.Left, tn.Bounds.Bottom, tn.Bounds.Right, tn.Bounds.Bottom)
                End Using
                LastNode = tn
            End If
            e.Effect = DragDropEffects.All
            e.Effect = DragDropEffects.None
            If Not IsNothing(LastNode) Then
            End If
            LastNode = Nothing
        End If
    End Sub

    Private Sub TreeView1_DragDrop(ByVal sender As Object, ByVal e As System.Windows.Forms.DragEventArgs) Handles TreeView1.DragDrop
        Dim tn As TreeNode = e.Data.GetData("MyTreeNode")
        If Not IsNothing(LastNode) Then
            If Not IsNothing(LastNode.Parent) Then
                LastNode.Parent.Nodes.Insert(LastNode.Parent.Nodes.IndexOf(LastNode) + 1, tn)
            End If
        End If
    End Sub

End Class

Open in new window


Author Comment

ID: 33813546
Thank for the idea and the code that handles a part of our problem.

We need a  solution where the "insert between siblings" is additional functionality on top of the normal drag / drop (where you drop nodes as subnodes). Do you think it will be possible to implement that together, and do you think it will be possible to enhance aour solution so we can drag nodes between nodes that are not leave nodes?
Or does your experience concerning treeview enhancements say: better solution would be for example: show a dialog and ask "drop as sibling or child?"
LVL 86

Expert Comment

by:Mike Tomlinson
ID: 33813954
I only put the leaf node limitation on there to make it easier on me.  I'm pretty sure it could be modified to handle other scenarios...

Just didn't want to have to deal with situations such as if you attempt to drag a grandparent into a grandchild, what is supposed to happen then?

Can you give an example of how "deep" the nodes can go and if there are any constraints on relationships between nodes (other than parent/child).
Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now


Author Comment

ID: 33820929
What we'd like to have is advice if trying to add additional functionality to the treeview is easy or should better be avoided.

We implemented a visual feedback about where a node will be placed (child / sibling) by rendering a horizontal line between (="sibling") or a caret beneath (="as child") the nodes. But we noticed, that that changing "between siblings" and "as child" when the user moves the mouse ober nodes is not really a thing that the treeview designers had in mind.

We have 3 types of nodes: From "root" to "leave":
chapter -  structure as deep as necessary, here we have the "as child" or "as sibling" problem
articlegroup - must have a chapter as a parent
order number - must have an articlegroup as a parent

LVL 86

Accepted Solution

Mike Tomlinson earned 250 total points
ID: 33832083
If it was "easy" then it would be built-in already...   =\

So you have:


Can you explain more about what can be moved to what?...or what cannot be moved to what?

I really don't know if this should be avoided or not...I'd have to really understand what your app does and how the data relates to each other!  Maybe there is a better way to allow the user to re-arrange the data?  Maybe there is a better control or combination of controls that can display the data?  I can't see the "big picture" so I can't really recommend anything...

Author Comment

ID: 33887035
Sorry, i had an influenza and could not work on this task,
meanwhile the problem is solved.
thank you.

Featured Post

PeopleSoft Has Never Been Easier

PeopleSoft Adoption Made Smooth & Simple!

On-The-Job Training Is made Intuitive & Easy With WalkMe's On-Screen Guidance Tool.  Claim Your Free WalkMe Account Now

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

For those of you who don't follow the news, or just happen to live under rocks, Microsoft Research released a beta SDK ( for the Xbox 360 Kinect. If you don't know what a Kinect is (http:…
A long time ago (May 2011), I have written an article showing you how to create a DLL using Visual Studio 2005 to be hosted in SQL Server 2005. That was valid at that time and it is still valid if you are still using these versions. You can still re…
Come and listen to Percona CEO Peter Zaitsev discuss what’s new in Percona open source software, including Percona Server for MySQL ( and MongoDB (…
If you’ve ever visited a web page and noticed a cool font that you really liked the look of, but couldn’t figure out which font it was so that you could use it for your own work, then this video is for you! In this Micro Tutorial, you'll learn yo…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question