c# - How to drag images from a listview (together with an imageview) to pictureboxes? -

i pretty new c# , struggle lot small project want do.

i busy collage maker have list of pictures on left hand side , want drag , drop multiple images right hand side want able move them around create collage.

i wanted show image not allowed post images less 10 reputation points. here image:

i can't manage work. i've looked online can't find i'm looking for. stuff find unclear , struggle understand.

this have far code drag , drop left right doesn't work;

private void picturebox1_dragenter(object sender, drageventargs e)     {         int len = e.data.getformats().length - 1;         int i;         (i = 0; <= len; i++)         {             if (e.data.getformats()[i].equals("system.windows.forms.listview+selectedlistviewitemcollection"))             {                 //the data drag source moved target.                 e.effect = dragdropeffects.move;             }         }     }      private void picturebox1_dragdrop(object sender, drageventargs e)     {         //return if items not selected in listview control.         if (listview1.selecteditems.count == 0)         {             return;         }         listviewitem dragitem = listview1.selecteditems[0];         picturebox2.image = imagelist1.images[dragitem.imageindex];         listview1.items.remove(dragitem);     }      private void listview1_mousedown(object sender, mouseeventargs e)     {         listview1.dodragdrop(listview1.selecteditems, dragdropeffects.move);     } 

and after can add image left, how can drag , move them around using mouse coordinates?

any appreciated please. done using c# in windows forms.

here full example may want play with:

it uses form listview, imagelist , panel hold pictureboxes.

you use flowlayoutpanel won't let move pictureboxes later.

you use grid of panels , backgroundimage.

first set form:

private void form1_load(object sender, eventargs e) {     keypreview = true;     filllv(10);     addpbs(36);     listview1.mousemove += listview1_mousemove; }  void filllv(int count) {     (int = 0; < count; i++) listview1.items.add("item" + i, i); }  void addpbs(int count) {     int iwidth = imagelist1.imagesize.width;     int iheight = imagelist1.imagesize.height;     int cols = panel1.clientsize.width / iwidth;      (int = 0; < count; i++)     {         picturebox pb = new picturebox();         pb.backcolor = color.lightgray;         pb.margin = new system.windows.forms.padding(0);         pb.clientsize = new system.drawing.size(iwidth , iheight );         pb.location = new point(iwidth * (i % cols), iheight * (i / cols));         pb.parent = panel1;         pb.dragenter += pb_dragenter;         pb.dragdrop += pb_dragdrop;         pb.allowdrop = true;         pb.mouseclick += (ss, ee) => { currentpb = pb; pb.focus(); };     } } 

note how add events dynamically created pictureboxes , how set hidden allowdrop property.

also note little lambda make mouseclick prepare moving them around keyboard.

for need reference current box:

picturebox currentpb = null; 

now start dragging. should not done in mousedown or else interfere normal selection , happen before new selection made..

either in mousemove:

void listview1_mousemove(object sender, mouseeventargs e) {     if (e.button == system.windows.forms.mousebuttons.left)     {         if (listview1.selecteditems.count > 0)         {             listview1.dodragdrop(listview1.selecteditems[0], dragdropeffects.move);         }     } } 

or (update) listviews better , simpler (thanks hans!) in itemdrag event:

private void listview1_itemdrag(object sender, itemdrageventargs e) {     listview1.dodragdrop(e.item, dragdropeffects.move); } 

update: both ways use dragged item, not imageindex, make simpler remove item lv..

void pb_dragenter(object sender, drageventargs e) {     if (e.data.getdatapresent(typeof(listviewitem)))          e.effect = dragdropeffects.move;     else         e.effect = dragdropeffects.none; }  void pb_dragdrop(object sender, drageventargs e) {     picturebox pb = sender picturebox;     var item = (listviewitem)e.data.getdata(typeof(listviewitem));     int index = item.imageindex;     pb.image = imagelist1.images[index];  // make sure have images indices!!  } 

finally use keyboard move current box around. have added code bring , down in z-order well.

private void form1_keydown(object sender, keyeventargs e) {     if (currentpb == null) return;     if (e.keydata == keys.left) currentpb.left -= 1;     else if (e.keydata == keys.right) currentpb.left += 1;     else if (e.keydata == keys.up) currentpb.top -= 1;     else if (e.keydata == keys.down) currentpb.top += 1;     else     {          int z = panel1.controls.getchildindex(currentpb);         if (e.keydata == keys.home) panel1.controls.setchildindex(currentpb, 0);         else if (e.keydata == keys.end)               panel1.controls.setchildindex(currentpb, panel1.controls.count);         else if (e.keydata == keys.pageup)               panel1.controls.setchildindex(currentpb, z + 1);         else if (e.keydata == keys.pagedown)               { if (z > 0) panel1.controls.setchildindex(currentpb, z - 1); }     }     panel1.invalidate();  } 

for work form must have : keypreview = true;

note sizes in imagelist restricted 256x256. may want use index , use load larger images disk..