SUMMARY
This step-by-step article describes how to perform a drag-and-drop operation with tree nodes between two
TreeView controls in a Visual C# application.
Requirements
The following list outlines the recommended hardware, software, network infrastructure, and service packs that you need:
- Visual C# .NET or Visual C# 2005
This article assumes that you are familiar with the following topics:
- Windows Forms TreeView control
- Windows Forms event handling
Description of the technique
The
TreeView control provides three drag-and-drop events that you must handle:
- ItemDrag: This event is raised from the source TreeView control as soon as the user starts to drag the tree node. When this occurs, call the DoDragDrop method to initiate the drag-and-drop procedure.
- DragEnter: After you initiate the drag-and-drop operation, you must handle the DragEnter event in the destination TreeView control. This event occurs when the user drags the TreeNode object from the source TreeView control to a point in the bounds of the destination TreeView control. The DragEnter event enables the destination TreeView control to specify whether the drag operation is valid for this control. The code sample in this article enables only the move operation.
- DragDrop: The last event to handle is the DragDrop event of the destination TreeView control. This event occurs when the TreeNode object that is dragged has been dropped on the destination TreeView control. To handle this event, retrieve the TreeNode object, and add the object to the destination TreeView control. The code sample uses the Data object to retrieve the data.
The code sample in this article guarantees that a
TreeNode object has been dragged to the destination
TreeView control. The
GetData method of the
Data object retrieves the node that is dragged from the source control. The
GetNodeAt method determines where this node is dropped on the destination control. After you determine the position, add the source node as a child of the destination node. Because this sample performs a move operation, the last step is to remove the source node from the original
TreeView control.
Steps to create the sample
- Create a new Windows Application in Visual C#. By default, a form that is named Form1 is created.
Note The code should be changed in Visual Studio 2005. When you create a Windows Forms project, Visual C# adds one form to the project by default and calls it Form1. The two files that represent the form are called Form1.cs and Form1.designer.cs. You write your code in Form1.cs; the designer.cs file is where the Windows Forms Designer writes the code that implements all the actions that you performed by dragging and dropping controls from the Toolbox.
For more information about the Windows Forms Designer in Visual C# 2005, visit the following Microsoft Web site: - Use the toolbox to add two TreeView controls to Form1. By default, TreeView1 and TreeView2 are created.
- To allow the TreeView controls to be dragged and dropped, change the AllowDrop property of both TreeView1 and TreeView2 to True in the Properties window.
- Double-click Form1 to generate the method handler for Form1's Load event. Add the following code to populate the two TreeView controls with TreeNode objects and to define the event handlers:
private void Form1_Load(object sender, System.EventArgs e)
{
TreeNode ParentNode1;
TreeNode ParentNode2;
ParentNode1 = treeView1.Nodes.Add("tv1");
ParentNode1.Nodes.Add("tv1FirstChild");
ParentNode1.Nodes.Add("tv1SecondChild");
ParentNode1.Nodes.Add("tv1ThirdChild");
ParentNode1.Nodes.Add("tv1FourthChild");
ParentNode1.Expand();
ParentNode2 = treeView2.Nodes.Add("tv2");
ParentNode2.Nodes.Add("tv2FirstChild");
ParentNode2.Nodes.Add("tv2SecondChild");
ParentNode2.Expand();
this.treeView1.ItemDrag += new System.Windows.Forms.ItemDragEventHandler(this.treeView_ItemDrag);
this.treeView2.ItemDrag += new System.Windows.Forms.ItemDragEventHandler(this.treeView_ItemDrag);
this.treeView1.DragEnter += new System.Windows.Forms.DragEventHandler(this.treeView_DragEnter);
this.treeView2.DragEnter += new System.Windows.Forms.DragEventHandler(this.treeView_DragEnter);
this.treeView1.DragDrop += new System.Windows.Forms.DragEventHandler(this.treeView_DragDrop);
this.treeView2.DragDrop += new System.Windows.Forms.DragEventHandler(this.treeView_DragDrop);
}
- Add the following method handler to handle the ItemDrag event of either TreeView1 or TreeView2, depending on the direction of the drag operation. This code initiates a move operation on the item that is being dragged.
private void treeView_ItemDrag(object sender,
System.Windows.Forms.ItemDragEventArgs e)
{
DoDragDrop(e.Item, DragDropEffects.Move);
}
- Add the following method handler to handle the DragEnter event of TreeView1 or TreeView2, depending on the direction of the drag operation:
private void treeView_DragEnter(object sender,
System.Windows.Forms.DragEventArgs e)
{
e.Effect = DragDropEffects.Move;
}
- Add the following method to the Form1 class so that it immediately follows the method that you added in the previous step:
private void treeView_DragDrop(object sender, System.Windows.Forms.DragEventArgs e)
{
TreeNode NewNode;
if(e.Data.GetDataPresent("System.Windows.Forms.TreeNode", false))
{
Point pt = ((TreeView)sender).PointToClient(new Point(e.X, e.Y));
TreeNode DestinationNode = ((TreeView)sender).GetNodeAt(pt);
NewNode = (TreeNode)e.Data.GetData("System.Windows.Forms.TreeNode");
if(DestinationNode.TreeView != NewNode.TreeView)
{
DestinationNode.Nodes.Add((TreeNode) NewNode.Clone());
DestinationNode.Expand();
//Remove Original Node
NewNode.Remove();
}
}
}
- Build and run the project. Drag nodes from one TreeView control to the other. Note that the node is removed from the source control and is added as a child node in the destination control.
Notes
The sample that is provided in this article is intended for demonstration purposes only. Therefore, the sample only illustrates how to use the
TreeView control in a simplified scenario. To keep the sample small, several scenarios are not considered. For example, the code does not let you perform a drag-and-drop operation with nodes in the same
TreeView control.
The code also does not handle the scenario in which a user does not drop the object on a particular node in the destination
TreeView control. To handle this scenario, test whether the
DestinationNode is null; if it is, you can add the object that is being dragged to the root of the
TreeView control, and so on.