Drag and drop images in C#

[Drag and drop images]

This example shows how to drag and drop images in C#. The example Drag and drop text in C# explains basic drag and drop operations. See that example for the fundamentals.

One of the first things you must do before implementing drag and drop is set the AllowDrop property to true for the control that should accept a drop. For some reason, Visual Studio does not display this property in the properties window for the PictureBox control. IntelliSense doesn’t even admit the property exists! Clearly Microsoft doesn’t expect you to drag and drop images.

However, the Control class implements AllowDrop and PictureBox inherits from Control, so the property does exist. You simply need to set it in code at run time and you need to ignore IntelliSense’s refusal to believe it exists. Microsoft says:

The PictureBox control is not designed to allow drag and drop procedures. However, since PictureBox inherits from control, it also inherits the AllowDrop property. To clarify this, in the next release of the documentation, the PictureBox.AllowDrop topic will be marked with the “for internal use only” boilerplate. Also, the PictureBox.AllowDrop property will not appear in intellisense if you are using the Visual Studio text editor.

Basically Microsoft says this is by design and most people wouldn’t want to do this anyway. I have no clue what they are thinking.

Anyway the following code shows how the program sets this property at run time.

// Set the drop target PictureBox's AllowDrop property at run time.
// It is unavailable in the Properties window and doesn't
// even show up in IntelliSense!
private void Form1_Load(object sender, EventArgs e)
{
    picDropTarget.AllowDrop = true;
}

The following code shows the other drag and drop event handlers used by this example.

// Start the drag.
private void picDragSource_MouseDown(object sender,
    MouseEventArgs e)
{
    // Start the drag if it's the right mouse button.
    if (e.Button == MouseButtons.Right)
    {
        picDragSource.DoDragDrop(picDragSource.Image,
            DragDropEffects.Copy);
    }
}

// Allow a copy of an image.
private void picDropTarget_DragEnter(object sender,
    DragEventArgs e)
{
    // See if this is a copy and the data includes an image.
    if (e.Data.GetDataPresent(DataFormats.Bitmap) &&
        (e.AllowedEffect & DragDropEffects.Copy) != 0)
    {
        // Allow this.
        e.Effect = DragDropEffects.Copy;
    }
    else
    {
        // Don't allow any other drop.
        e.Effect = DragDropEffects.None;
    }
}

// Accept the drop.
private void picDropTarget_DragDrop(object sender,
    DragEventArgs e)
{
    picDropTarget.Image =
        (Bitmap)e.Data.GetData(DataFormats.Bitmap, true);
}

This code is similar to the previous example, so see that one for details.

Drag and drop is covered in my book Stephens’ C# Programming with Visual Studio 2010 24-Hour Trainer.


Download Example   Follow me on Twitter   RSS feed   Donate




This entry was posted in Drag and Drop, graphics, image processing, interoperability and tagged , , , , , , , , , , , , , , . Bookmark the permalink.

6 Responses to Drag and drop images in C#

  1. Juan Carlos says:

    hey! I’ve just read and downloaded your example, and it’s very good actually, but I’m trying to make a drag-n-drop but I cannot drop the image on the picture box, I’ve already set the property on, but it stills refuses to open the image, can you give some tips?

  2. Rod Stephens says:

    Well, you need to set the AllowDrop property in code. You also need to catch the DragEnter and DragDrop events for the PictureBox. DragDrop needs to do something with the dragged data–it won’t just automatically display the image.

    Your best bet may be to take the example and modify or copy it a step at a time until it meets your needs.

  3. Pingback: Drag and drop text with feedback in C# - C# HelperC# Helper

  4. Pingback: Drag and drop images while displaying a preview in C# - C# HelperC# Helper

  5. Farnaz says:

    Hey, Thanks for your information. But it works only for one drag and drop. How about multiple drags and drops? I want drag several images and drop on one picture box and also some images twice. But I don’t know how! Can you help me please?
    Thanks

    • RodStephens says:

      To do that, you would need to provide your own drop code. Instead of just displaying the image in the PictureBox, you would need to create a Bitmap, put the image somewhere on it, and then display the image in the PictureBox. I may make an example when I have a chance, but meanwhile you might like this post:

      Make a montage editor in C#, Part 2

Leave a Reply

Your email address will not be published. Required fields are marked *