Solved

C# - Drag and Drop Image with extra functionality

Posted on 2007-03-27
16
483 Views
Last Modified: 2008-12-17
Hi guys 'n gals,

I've tried googling for this solution, but can't find it (as I'm most likely not searching for the correct thing).

Basically, I want to be able to create a function which allows me to do the following:


Drag and Drop an image from Point A, and drop it at Point B, but rather than moving the actual original image, I want to drag and drop an exact copy of the image. I also need to be able to determine where it is being dropped, so to check if it's being dropped out of a set boundary, it is to be destroyed, or moved back to it's original place, rather than being dropped.


I can be better explain myself if required, please just ask!


Cheers!!
0
Comment
Question by:Cyber-Drugs
  • 10
  • 3
  • 2
  • +1
16 Comments
 
LVL 21

Expert Comment

by:theGhost_k8
ID: 18800536
hay dude,
Drag drop on picture box / form / anyother control !!!
again what you are asking is little specific... so you will be getting the NEAREST solutions.
            let me see if i can do something about this.... hold on, dude...
                     
0
 
LVL 85

Expert Comment

by:Mike Tomlinson
ID: 18800752
WinForms or WebForms?

What are you dropping on?...a Panel? the Form?...possible multiple other controls?

Give us more details...
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18800760
Hey theGhost_k8,

Sorry for it being so specific, if it makes things easier, I'd like to for now, just have the functionality to drag and drop an image and the image dragged/dropped is a clone of the source image. I can look into adding the extra functionality myself.

Cheers!
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18800771
Idle_Mind,

WinForms = yes
WebForms = no

I am basically converting an application I created in XHTML/DHTML/JavaScript/AJAX/PHP into a C# application.
0
 
LVL 85

Accepted Solution

by:
Mike Tomlinson earned 500 total points
ID: 18800838
How about?...

On MouseDown(), store the starting Point in the Tag() property.
On MouseMove(), move the original PictureBox in real time.
On MouseUp(), put the original PictureBox back to its starting place using the Tag value.
Determine if you want a make copy.
If so, make a new PB, copy the Image and place it at the current position using e.X and e.Y...

To move a PB as the mouse is moved:

        int startX, startY;

        private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                startX = e.X;
                startY = e.Y;
            }
        }

        private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                pictureBox1.Location = new Point(pictureBox1.Left + e.X - startX, pictureBox1.Top + e.Y - startY);
            }
        }
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18800929
I'll give that a try a bit later tonight, cheers!
0
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 18805571
say ur image is in a panel first allow drag drop true for the panel where u want to drag the stuff

then on mouse down do this

DoDragDrop(panel1.Image,DragDropEffects.Copy);

then on panel2 where u want to put the stuff hook the dragenter event and do this

if (e.Data.GetDataPresent(typeof(Image)))
                  {
                        e.Effect = DragDropEffects.Copy;
                  }
                  else
                  {
                        e.Effect = DragDropEffects.None;
                  }

then hook the dragdrop event of the same panel2 and do

Iamge FTemp = (Image)e.Data.GetData(typeof(Image));
                  panel2.Image = Ftemp;
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18807947
gauthampj,

Is it possible to do your code for a picture box inside the panel, rather than an embedded image inside the panel?



Idea_Mind,

Your code gives me the drag and drop functionality, but the thing is that I don't want to drag the original image, I want to drag and drop a copy of the original image. A bit like in Visio (if you've ever used it?), where you can drag and drop shapes from a Catalog onto the drawing space.


Cheers guys!
0
What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 18807974
s it would

istead of the panel u can specify any container control
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18808048
Maybe I am misunderstanding your code, but does it make a copy of the image into the new container, where I can hold multiple copies, or does it do a single straight copy?
0
 
LVL 85

Expert Comment

by:Mike Tomlinson
ID: 18808471
So you most likely have two panels?...one for the "catalog" and one for the "canvas"?

So we have to drag the new PB "above the panels" on the form itself and then check for intersections when it is dropped.

I'll play with it...
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18810638
I just got home now myself (work working on this during my lunch break connecting home remotely), so didn't get a chance to really play with it. As you got the drag and drop feature up and working, I'll play around with duplicating the existing PB with the drag and drop, and then try add in checks to see where the PB is being dropped.

Shall post any results I find.

Cheers for the help thus far, and sorry that it's such a big question, appreciate the help!
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18812284
So far I have this:


panel1 (catalog)
panel2 (canvas)
Picturebox1 (source image, located inside panel1)

and this code:


using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;

namespace DragDrop
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        int startX, startY;

        private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                startX = e.X;
                startY = e.Y;
            }
        }

        private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                PictureBox myPic = new PictureBox();
                myPic.Name = "PictureBox2";
                myPic.Height = pictureBox1.Height;
                myPic.Width = pictureBox1.Width;
                myPic.Location = new Point(pictureBox1.Left + e.X - startX, pictureBox1.Top + e.Y - startY);
                myPic.Image = pictureBox1.Image;

                this.Controls.Add(myPic);
                myPic.Show();
            }
        }
    }
}



Doesn't quite work, doesn't throw an error, but doesn't quite work... Any thoughts?
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18812539
I now have it trapped inside panel1, which is great, except it's not drawing the new image, it's smudging the image from the source point to the destination point...


Only change made to above code is this:

Swap:
this.Controls.Add(myPic);
For:
this.panel1.Controls.Add(myPic);
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18812667
Ok, got it to do 95% of what I want!

Basically, I just need to find a way to change the Z-Index of my picture, so that it is higher than that of the two panels, so that while it is being dragged, I can see where it is.


Here is the code I have so far:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;

namespace DragDrop
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        int startX, startY;
        PictureBox myPic = new PictureBox();

        private void pictureBox1_MouseDown(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                startX = e.X;
                startY = e.Y;
            }
        }

        private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                myPic.Name = "PictureBox2";
                myPic.Height = pictureBox1.Height;
                myPic.Width = pictureBox1.Width;
                myPic.SizeMode = PictureBoxSizeMode.StretchImage;
                myPic.Location = new Point(pictureBox1.Left + e.X - startX, pictureBox1.Top + e.Y - startY);
                myPic.Image = pictureBox1.Image;
                if (this.Controls.Contains(myPic) == false)
                {
                    this.Controls.Add(myPic);
                }
            }
        }

        private void pictureBox1_MouseUp(object sender, MouseEventArgs e)
        {
            if (myPic.Left >= panel2.Left && myPic.Top >= panel2.Top && myPic.Left + myPic.Width <= panel2.Left + panel2.Width && myPic.Top + myPic.Height <= panel2.Top + panel2.Height)
            {
                myPic.Location = new Point(myPic.Left - panel2.Left, myPic.Top - panel2.Top);
                this.panel2.Controls.Add(myPic);
            }
            else
            {
                MessageBox.Show("Out of bounds.");
            }
        }
    }
}
0
 
LVL 4

Author Comment

by:Cyber-Drugs
ID: 18812711
After having thought about it, this question has been solved. What I need now, should be in another question.

As I used the code by Idle_Mind, I shall be awarding the points to him.

Cheers for all the help guys!
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

This article introduced a TextBox that supports transparent background.   Introduction TextBox is the most widely used control component in GUI design. Most GUI controls do not support transparent background and more or less do not have the…
We all know that functional code is the leg that any good program stands on when it comes right down to it, however, if your program lacks a good user interface your product may not have the appeal needed to keep your customers happy. This issue can…
Here's a very brief overview of the methods PRTG Network Monitor (https://www.paessler.com/prtg) offers for monitoring bandwidth, to help you decide which methods you´d like to investigate in more detail.  The methods are covered in more detail in o…
This tutorial demonstrates a quick way of adding group price to multiple Magento products.

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now