<img src="http://t.cbsimg.net/i/z/200606/how_110x85.jpg" align="right" border="0" height="85" hspace="5" vspace="5" width="110" />Windows users have grown accustomed to the Drag-n-Drop convention, where you click on an item and drag it to another location/program to either move, copy, or modify it. If you are an <a href="http://www.techrepublic.com/5264-1-0.html?query=application%20development" target="_blank">application developer</a> for the Windows environment using the <a href="http://www.techrepublic.com/search/search/Microsoft+.NET+Framework.html?t=11&s=0&o=0" target="_blank">.NET Framework</a>, you need to know how to program Drag-n-Drop functionality.
Windows users have grown accustomed to the Drag-n-Drop convention, where you click on an item and drag it to another location/program to either move, copy, or modify it. If you are an application developer for the Windows environment using the .NET Framework, you need to know how to program Drag-n-Drop functionality.
This blog post is also available in PDF form in a TechRepublic download, which includes a sample Visual Studio project file with all of the sample code mentioned.
The Drag eventsThere are two main events we will be using to implement drag-n-drop. These events are DragEnter and DragDrop. Both of these events will be set on the target object that the user will be dragging other objects to. In our case this target object is a panel called pnlDragTo. This is a normal C# Panel control placed onto a normal Form. This form and control are shown in Figure A.
C# Panel control on a normal Form
The pnlDragTo control is near the top of the form and is dark gray. To enable users to drag objects to this panel we need to do three things:
- Set the AllowDrop property of the control to True -- if this isn't set the user will not be able to drop objects onto the control.
- Set up an event handler for the DragEnter event -- This event will be used to determine if the object being dragged onto the panel is supported by the panel's drag drop functionality.
- Set up an event handler for the DragDrop event -- This event is fired when a user drops an object onto the panel.
Handling the DragEnter event
The DragEnter event is fired any time the user is dragging an object over your panel. You could use this event for many different things. For example you could use this in conjunction with the DragLeave and DragDrop events to change the color of the panel as a user drags objects over it. This is a neat UI trick that is used by many applications to alert the user that they can drop objects into a component.We'll keep it simple though and use the DragEnter event as an opportunity to examine the object that the user is dragging onto our panel. To do this we will use the DragEventArgs object that is sent to our event handler to see if the data for the object the user is dragging corresponds to a file. The code for this is shown in Figure B.
The call to e.Data.GetDataPresent is what tells us what kind of data we are dealing with. In this case, we want to know if the data corresponds to a file being placed into our panel. To do this we send the FileDrop value of the DataFormats object to the GetDataPresent method. If the data corresponds to a file the GetDataPresent method will return true, else it will return false.
If a true value is returned from GetDataPresent we set the effect to Move, else we set the effect to None. Doing this gives the user a visual alert to indicate that the object can or cannot be dropped into our panel.
Handling the DragDrop eventThe next event we will work with is the DragDrop event. This event is fired when the user releases the mouse button and the object is "dropped" onto our panel. Generally this event is used to examine the object which was dropped and perform some type of functionality on it. For this article we will use the DragDrop event to determine if the object being dropped is a file, and if it is, display the information associated with the file. The code for this is shown in Figure C and the output is shown in Figure D.
Output file information
As you can see we use the same GetDataPresent method here that we used in the DragEnter event. This is because we need to examine the object being dropped and make sure that it is of the correct type.
If the object is of the correct type we call the DragEventArgs.Data.GetData method and tell it we're looking for FileDrop data. This GetData method returns an array of strings. Using a string array allows the program to handle multiple files being dropped at the same time. Each string within the array is the full path to a file that was included in the drop.
We then loop through the array and get the information for each of the files included within the array. This is done by creating a new FileInfo object for each file and accessing the needed properties.
Other types of drag-n-drop
While the code shown handles files, it is just as easy to implement drag-n-drop for other types of objects. To do this simple replace DataFormats.FileDrop with whatever type of object you want to accept.