CODEWITHSUNDEEP
c#.netwinformsuser-interface
penny
penny

Reputation: 457

How can I make images drag and drop-able to reorder them?

I'm building an application in which I'd like a user to be able to reorder pictures in a form in two columns. I've got a flowLayoutPanel of a set width, and pictures are added via the OpenFileDialog and scaled to half the width (minus an allowance for a scroll bar) of the flow layout panel.

This is where I'm stuck - I've tried adding the images as Labels, Buttons, and now PictureBoxes and I can't work out how to actually move them around. I gave up on labels because CanSelect is false - although I didn't know if that would have made a difference - and I moved on from buttons because I realised picture boxes existed. I'm open to switching out which controls I use but the images will always need to be in two columns.

Here's the code I currently have for the DragEnter and DragDrop events:

private void flowLayoutPanel_6_Cards_DragEnter(object sender, DragEventArgs e)
{
    e.Effect = DragDropEffects.All;
}
private void flowLayoutPanel_6_Cards_DragDrop(object sender, DragEventArgs e)
{
    MessageBox.Show("dropped");
}

How can I implement this? What controls should I use and what properties should I be looking at to make this possible?

Upvotes: 0

Views: 1172

Answers (1)

penny
penny

Reputation: 457

So thanks to @TaW's comment I now know that you have to add a DoDragDrop call to the MouseDown event on whatever you're dragging. My now-working code is below (thanks mostly to this tutorial):

private void flowLayoutPanel_6_Cards_DragDrop(object sender, DragEventArgs e)
{
    PictureBox picture = (PictureBox)e.Data.GetData(typeof(PictureBox));    
    FlowLayoutPanel _source = (FlowLayoutPanel)picture.Parent;
    FlowLayoutPanel _destination = (FlowLayoutPanel)sender;

    if (_source != _destination)
    {
        //where did you even get this from?
    }
    else
    {
        Point p = _destination.PointToClient(new Point(e.X, e.Y));
        var item = _destination.GetChildAtPoint(p);
        int index = _destination.Controls.GetChildIndex(item, false);
        _destination.Controls.SetChildIndex(picture, index);
        _destination.Invalidate();

    }
}

private void flowLayoutPanel_6_Cards_DragEnter(object sender, DragEventArgs e)
{
    e.Effect = DragDropEffects.All;
}

void p_MouseDown(object sender, MouseEventArgs e)
{
    PictureBox p = (PictureBox)sender;
    p.DoDragDrop(p, DragDropEffects.All);
}

Upvotes: 1

Related Questions