Environment: W2K, VS.NET
This application shows how the drag and drop features in C# could be used to
create a simple board game or whatever. I didn’t put any type of game in
the application in order to keep the source code simple. The application
just lets you move the dots around the board. It allows highlighting
a tile when you drag over it, doesn’t allow dragging onto a tile with a dot,
and the cursor changes depending on whether or not you can drop the dot.
Code
There are two classes in this project: smDragDropTest and smTile.
smDragDropTest inherits from System.Windows.Forms.Form and is used for the main form. In order to allow the drag and drop to register properly you must mark your main with [STAThread] if that isn’t there it will throw an exception.
public class smDragDropTest :
System.Windows.Forms.Form
smTile inherits from System.Windows.Forms.PictureBox and is used for the board tiles
public class smTile :
System.Windows.Forms.PictureBox
smDragDropTest dynamically creates the smTiles on the form to create
a board.
// Initialize the grid grid = new smTile[MAX_GRID_SIZE, MAX_GRID_SIZE]; // Initialize each tile in the grid for (int row = 0; row < MAX_GRID_SIZE; row++) { for (int col = 0; col < MAX_GRID_SIZE; col++) { try { // Create the tile grid[row,col] = new smTile(); // Set the location for the tile xSpot = (col * IMAGE_WIDTH) + BORDER_OFFSET; ySpot = (row * IMAGE_HEIGHT) + BORDER_OFFSET; grid[row,col].Location = new Point(xSpot, ySpot); // Add the tile to the form this.Controls.Add(grid[row,col]); } catch { // Just catch an exception, no error handling yet System.Console.WriteLine( "Exception caught for tile[{0}, {1}]", row, col); } } }
The smTile constructor loads the images and sets up the event handlers. We are going to handle the mouse down, drag enter, drag leave, and drag drop events. In order for an object to allow dragging you must set the AllowDrop property to true. To see what each event handler does you can look at the code, it is pretty straight forward.
filledImage = new System.Drawing.Bitmap("dotBox.jpg"); emptyImage = new System.Drawing.Bitmap("emptyBox.jpg"); overImage = new System.Drawing.Bitmap("overBox.jpg"); this.MouseDown += new MouseEventHandler(OnMouseDown); this.DragEnter += new DragEventHandler(OnDragEnter); this.DragDrop += new DragEventHandler(OnDragDrop); this.DragLeave += new EventHandler(OnDragLeave); this.AllowDrop = true;
To start the dragging process we use the OnMouseDown event. All you have to do is call DoDragDrop.
public void OnMouseDown( object sender, MouseEventArgs e) { // Only allowing dragging if there is an item if (hasItem) { // Start the dragging process DragDropEffects effect = DoDragDrop( this.Image, DragDropEffects.Copy); // Check to see if the image was dropped somewhere if (effect != DragDropEffects.None) { // It was dropped so remove the item RemoveItem(); } } }
In order to use custom cursors and not the default drag and drop cursors you must override OnGiveFeedback. Once you do that it is your job to change the cursors when you need to.
protected override void OnGiveFeedback(
GiveFeedbackEventArgs gfbEvent)
{
// Allow us to use our own cursors when dragging
gfbEvent.UseDefaultCursors = false;
};
In OnDragEnter we check to see if the correct data is being dragged into the box by using the GetDataPresent(DataFormats.Bitmap) from the DragEventArgs. If it is the right kind of data we set the Effect property of DragEventArgs to whatever effect you want. In this case we are dragging around Bitmaps and allowing them to be copied. Since we handle the images ourselves we don’t really care about the data, we are just using it for a place holder to give use the drag and drop functionality.
// Check to see if we can handle what is being dragged
if (e.Data.GetDataPresent(DataFormats.Bitmap)) {// Change the cursor to a hand
this.Cursor = Cursors.Hand;// Lets it know what effects can be done
e.Effect = DragDropEffects.Copy;// Change the image
this.Image = overImage;
}
Well that is about it. Hopefully someone finds it helpful.