Drag and Drop
E N D
Presentation Transcript
Drag and Drop (Not in the Textbook)
Objectives • You will be able to use drag and drop in your Windows Forms applications.
Drag and Drop Example • Simple example of drag and drop. • User will be able to drag an image from one picture box to another.
Getting Started • Create a new Windows Forms application. • Drag_Drop_Example • Put two picture boxes and a button on the form, as shown on the next slide. • Set BorderStyle • Set SizeMode to Zoom • Set the image for the left hand picture box but not for the right hand one. • http://www.cse.usf.edu/~turnerr/Software_Systems_Development/Downloads/USF_Bull_small.jpg
Set Properties • Picture Boxes: • Set BorderStyle • Set SizeMode to Zoom • Button • Enabled = False
Add Event Handler • Display the events for pbSource. • Create an event handler for the MouseDown event
MouseDown Event Handler private void pbSource_MouseDown(object sender, MouseEventArgs e) { pbSource.DoDragDrop(pbSource.Image, DragDropEffects.Move); }
Form Load Event Handler • Select the form and display its events. • Create an event handler for the Load event.
Form Load Event Handler private void Form1_Load(object sender, EventArgs e) { pbTarget.AllowDrop = true; }
More Event Handlers • Select pbTarget and display its events. • Create event handlers for DragEnter and DragDrop
More Event Handlers private void pbTarget_DragEnter(object sender, DragEventArgs e) { e.Effect = DragDropEffects.Move; } private void pbTarget_DragDrop(object sender, DragEventArgs e) { DataObject dataObject = (DataObject) e.Data; pbTarget.Image = (Image)dataObject.GetData(DataFormats.Bitmap); pbSource.Image = null; pbSource.Enabled = false; btnResetImage.Enabled = true; }
Button Click Handler • Double click on the Reset Image button to create a click event handler. private void btnResetImage_Click(object sender, EventArgs e) { pbSource.Image = pbTarget.Image; pbSource.Enabled = true; pbTarget.Image = null; btnResetImage.Enabled = false; } • Build and run
Program in Action Click on pbSource and drag to pbTarget
After Drag and Drop Click on Reset Image
Multiple Sources • Add another picture box, pbSource2. • Set its Image property. • http://www.cse.usf.edu/~turnerr/Software_Systems_Development/Downloads/Water_Lilies.jpg • Create a MouseDown event handler private void pbSource2_MouseDown(object sender, MouseEventArgs e) { pbSource.DoDragDrop(pbSource2.Image, DragDropEffects.Move); }
Remember the Source public partial class Form1 : Form { PictureBox source; .... private void pbSource_MouseDown(object sender, MouseEventArgs e) { source = pbSource; pbSource.DoDragDrop(pbSource.Image, DragDropEffects.Move); } private void pbSource2_MouseDown(object sender, MouseEventArgs e) { source = pbSource2; pbSource2.DoDragDrop(pbSource2.Image, DragDropEffects.Move); }
Prevent Another Drag private void pbTarget_DragDrop(object sender, DragEventArgs e) { DataObject dataObject = (DataObject) e.Data; pbTarget.Image = (Image)dataObject.GetData(DataFormats.Bitmap); btnResetImage.Enabled = true; source.Image = null; pbSource.Enabled = false; pbSource2.Enabled = false; }
Update Reset private void btnResetImage_Click(object sender, EventArgs e) { if (pbSource.Image == null) { pbSource.Image = pbTarget.Image; } else { pbSource2.Image = pbTarget.Image; } pbTarget.Image = null; pbSource.Enabled = true; pbSource2.Enabled = true; btnResetImage.Enabled = false; }
Multiple Targets • Add a second target, pbTarget2 • Add DragEnter and DragDrop event handlers.
Allow Drop in pbTarget2 private void Form1_Load(object sender, EventArgs e) { pbTarget.AllowDrop = true; pbTarget2.AllowDrop = true; }
pbTarget2 Event Handlers private void pbTarget2_DragEnter(object sender, DragEventArgs e) { e.Effect = DragDropEffects.Move; } private void pbTarget2_DragDrop(object sender, DragEventArgs e) { DataObject dataObject = (DataObject)e.Data; pbTarget2.Image = (Image)dataObject.GetData(DataFormats.Bitmap); source.Image = null; pbSource.Enabled = false; pbSource2.Enabled = false; btnResetImage.Enabled = true; }
Update Reset private void btnResetImage_Click(object sender, EventArgs e) { PictureBox current_target; if (pbTarget.Image != null) { current_target = pbTarget; } else { current_target = pbTarget2; } if (pbSource.Image == null) { pbSource.Image = current_target.Image; } else { pbSource2.Image = current_target.Image; } current_target.Image = null; pbSource.Enabled = true; pbSource2.Enabled = true; btnResetImage.Enabled = false; }
After Reset Image End of Presentation
Assignment • Do this example for yourself • if you haven't done it in class. • Study and understand how to do drag and drop. • What properties to update on each event.