Hi all,

I know how to drag and drop an image from one control to another.
Code enough out there. It works fine, but I find the user interface a bit poor:'( I want my image to follow the mouse while held down.
Found nothing that serves my needs on the web, except sprites, obscure code and what all not.
After some (long) experimenting I came up with the following:
Make a new forms app with a picturebox with a picture and add these events:

private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
            //make MouseMove active
            this.pictureBox1.MouseMove += new System.Windows.Forms.MouseEventHandler(this.pictureBox1_MouseMove);

        private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
            PictureBox P = sender as PictureBox;         
            P.Location = new Point(P.Location.X + e.Location.X, P.Location.Y + e.Location.Y);

        private void pictureBox1_MouseUp(object sender, MouseEventArgs e)
            //Deactivate MouseMove, 
            //used this one also to start off in the forms constructor after InitializeComponent
            this.pictureBox1.MouseMove -= new System.Windows.Forms.MouseEventHandler(this.pictureBox1_MouseMove);

This moves my picture, but I want to move a copy of the original and don't seem able to get that done. So any help or suggestion is more then welcome. Thanks in advance.

Recommended Answers

All 8 Replies

Sir, as you say that you want to move a copy of an image.

Image img;
        private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
            this.pictureBox1.MouseMove += new MouseEventHandler(pictureBox1_MouseMove);
            img = this.pictureBox1.Image;

        void pictureBox1_MouseMove(object sender, MouseEventArgs e)
           // PictureBox P = sender as PictureBox;
           // P.Location = new Point(P.Location.X + e.Location.X, P.Location.Y + e.Location.Y);
            Graphics g = this.CreateGraphics();
            g.DrawImage(img, new Point(e.X, e.Y));

        private void pictureBox1_MouseUp(object sender, MouseEventArgs e)
            img = null;
            this.pictureBox1.MouseMove-=new MouseEventHandler(pictureBox1_MouseMove);

Thanks for the reply adatapost, perhaps you gave me some hints on how I could proceed, but your adaptations don't copy either and have strange side effects.

If you are looking for that firefox style drag image, where a "ghost" like copy of the image moves about the screen. I believe a good way to go about it is on drag, to create a new form, topmost, that's window property is set to none, and just set its size to the picture's size, draw the image on it. and have it move with the mouse until the mouse is released, you will get a nice floating image, that can move over anything on the form and even off the form if the use decides to drag the mouse that far. And if you really want a good effect, use a layeredwindow, since you need no controls drawn on it, just an image, it would be an easy fitting solution that would allow for nice transparency so the users could see what's under the image, and also still see the image they are dragging.

not to say that's the best method.

alternatively, to get a copy of the image to drag just across the form, you would need to create a new instance of the control, with the same attributes and have it move, and the other control would have to stay put.

If you want a good look. although it would be very complicated. My first suggestion of a new form, would probably be best. here is an example of what i mean


Happy Coding

I have posted an example of what I was talking about, I just used that codeproject alphablendform and created a form that inherits from it, used a mousemove to set its position. But inorder to pass the click from one form to another, I had to use a mouse_event interlop to tell windows to release, then click again, without you actually have to do so. I added a picture box, set an image to it, then used some basic stuff to set the positon of the new form over the old text box, told it to create a thumbnail form the image, just incase its a zoomed picture, set the size of the new form to the size of the text box, set the dpp of the image to match requirements, and used bitmap.maketransparent to ensure it has a transparent region require for such a thing, this could all be done a better way, and is not error proof, its all just poped in for sake the demonstration.

the VS2008 project I included has the "debug" prebuilt in the bin folder, give it a try, just click and drag the image I included of a cupcake, it will pop out, be lightly transparent, I used 200 out of 255. and it will follow the mouse til you let go, in which case it just closes the new form. but you can do whatever you want, have it call a function in the main form passing where the mouse was in screen position when it was released would probably be where I would go. but you could probably actually mix this with the normal drag and drop capabilities to get what you are looking for.

This is just one way, it was a fun thing to try actually. But since I don't need it for anything myself, I didn't finish it completely. But its 90% of what you are looking for.

Happy Coding!

commented: Thanks for the effoet you put in! +6

Thank you very much for the stuff you gave me!
I am sure I will come up with something after some coding and experimenting.

no problem. sorry for the messy code, I knew you could figure out what was going on in it. when I started it I just was messing around with several ways it could be done not intending to show it, so it got kind of sloppy, I'm sure you noticed but I even took a short cut and threw the class that builds the image form right in the same cs file as the main form.

Best of luck friend, and as always, happy coding.

Well please try out the Clone() method it creates a copy of the image which you want to drag and drop Clone is a method of BitMap class as per my memory says. Try this

BitMap bmp= (BitMap)img.Clone();

please check in MSDN.

the problem was less the ability to drag and drop, which he already knows how to do, but it was to have an image following the mouse. Just making a copy of the bitmap in memory isn't going to display it on the screen. although copy() may get used in the actual "drop" code. Its not relevant to the original question, which was how to get an image to follow the mouse, without moving the original picturebox that contained it.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, learning, and sharing knowledge.