List box drag and drop

[04petersric]

Hi, the following code allows me to drag and drop the data, so i can reorder the list box. However, is there are way of seeing the line across the list box where it will be moved to? Thanks

Private Sub lstteam1players_DragDrop(ByVal sender As Object, ByVal e As System.Windows.Forms.DragEventArgs) Handles lstteam1players.DragDrop
    lstteam1players.Items.Insert(lstteam1players.IndexFromPoint(lstteam1players.PointToClient(New Point(e.X, e.Y))), e.Data.GetData(DataFormats.Text))
    lstteam1players.Items.RemoveAt(lstteam1players.SelectedIndex)
End Sub

Private Sub ListBox1_DragOver(ByVal sender As Object, ByVal e As System.Windows.Forms.DragEventArgs) Handles lstteam1players.DragOver
    e.Effect = DragDropEffects.Move
End Sub

Private Sub ListBox1_MouseDown(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles lstteam1players.MouseDown
    lstteam1players.DoDragDrop(lstteam1players.Text, DragDropEffects.All)
End Sub

[JuggaloBrotha]

I've got a ListView that does this (draws an insertion line and moves it as the mouse moves) I'll see about applying the concept to a ListBox.

[04petersric]

Thanks that would be great! It just looks a bit messy without seeing where the data will be moved to

[.paul.]

Try this extended listbox control:

Public Class listboxEx
    Inherits ListBox
 
    Private Const WM_PAINT As Integer = &HF
    Private Const WM_MOUSEMOVE = &H200
 
    ' The Item being dragged 
    Private _itemDnD As Object = Nothing
 
    Private itemOver As Integer = -1
 
    Public Sub New()
        ' Reduce flicker 
        MyBase.DoubleBuffered = True
    End Sub
 
    Protected Overloads Overrides Sub WndProc(ByRef m As Message)
        MyBase.WndProc(m)
 
        If m.Msg = WM_MOUSEMOVE And _itemDnD IsNot Nothing OrElse m.Msg = WM_PAINT Then
            If itemOver >= 0 AndAlso itemOver < Items.Count Then
                Dim rc As Rectangle = New Rectangle(0, MyBase.GetItemRectangle(itemOver).Top, MyBase.GetItemRectangle(itemOver).Width, MyBase.GetItemHeight(0))
                DrawInsertionLine(rc.Left, rc.Right, rc.Top)
            End If
        End If
 
    End Sub
 
    ''' <summary> 
    ''' Draw a line with insertion marks at each end 
    ''' </summary> 
    ''' <param name="X1">Starting position (X) of the line</param> 
    ''' <param name="X2">Ending position (X) of the line</param> 
    ''' <param name="Y">Position (Y) of the line</param> 
    Private Sub DrawInsertionLine(ByVal X1 As Integer, ByVal X2 As Integer, ByVal Y As Integer)
        Using g As Graphics = MyBase.CreateGraphics()
            g.DrawLine(Pens.Red, X1, Y, X2 - 1, Y)
            Dim leftTriangle As Point() = New Point(2) {New Point(X1, Y - 4), New Point(X1 + 7, Y), New Point(X1, Y + 4)}
            Dim rightTriangle As Point() = New Point(2) {New Point(X2, Y - 4), New Point(X2 - 8, Y), New Point(X2, Y + 4)}
            g.FillPolygon(Brushes.Red, leftTriangle)
            g.FillPolygon(Brushes.Red, rightTriangle)
        End Using
    End Sub
 
    Protected Overrides Sub OnMouseDown(ByVal e As System.Windows.Forms.MouseEventArgs)
        MyBase.OnMouseDown(e)
        _itemDnD = MyBase.Items(MyBase.IndexFromPoint(New Point(e.X, e.Y)))
    End Sub
 
    Protected Overrides Sub OnMouseMove(ByVal e As System.Windows.Forms.MouseEventArgs)
        MyBase.OnMouseMove(e)
 
        If _itemDnD Is Nothing Then
            Return
        End If
 
        ' Show the user that a drag operation is happening 
        Cursor = Cursors.Hand
 
        ' use 0 instead of e.X so that you don't have to keep inside the columns while dragging 
        itemOver = MyBase.IndexFromPoint(New Point(0, e.Y))
 
        ' invalidate the listbox
        MyBase.Invalidate()
    End Sub
 
    Protected Overrides Sub OnMouseUp(ByVal e As System.Windows.Forms.MouseEventArgs)
        MyBase.OnMouseUp(e)
        If _itemDnD Is Nothing Then
            Return
        End If
 
        Try
 
            ' use 0 instead of e.X so that you don't have to keep inside the columns while dragging 
            itemOver = MyBase.IndexFromPoint(New Point(0, e.Y))
 
            If itemOver = -1 Then
                Return
            End If
 
            If _itemDnD IsNot MyBase.Items(itemOver) Then
                MyBase.Items.Remove(_itemDnD)
                MyBase.Items.Insert(itemOver, _itemDnD)
            End If
 
            MyBase.SelectedIndex = itemOver
 
            MyBase.Invalidate()
        Finally
            ' finish drag&drop operation 
            _itemDnD = Nothing
            Cursor = Cursors.Default
        End Try
    End Sub
 
End Class

edit: there's a link to an improved version in my signature

[JuggaloBrotha]

Thanks that would be great! It just looks a bit messy without seeing where the data will be moved to

Sorry it took so long, but I did have time earlier this week to make a ListBox that does this.

While paul's is a great start, there are a few cases where the insertion line wont be removed from the control when the mouse button is released and I his doesn't let go of the item (so to speak) if the mouse leaves the control altogether which I was able to produce a crash.

I also added an ItemMoved event which provides info about the item that moved, what it's old index was and the index of where it got moved to. Plus the ability to turn the feature on/off by changing a property and the ability to change the Insertion line color via a property.

More info and the code classes here: ListBox/ListView Move Item with Mouse

[.paul.]

Try my latest version, I added cursor effects.

@JB: If you want to improve your code, add multiple items support

[JuggaloBrotha]

Try my latest version, I added cursor effects.

One of the reasons I still made this control was for the adding of properties and the event to know when an item was moved, yours still doesn't have that, plus the two issues I'd noticed yours was doing that it shouldn't have been so I sat down and started from scratch, using the code from my LV control for consistency.

@JB: If you want to improve your code, add multiple items support

That's next on my list, getting the first rendition is all I was aiming for here. IE no crashes, handling all the internal events needed for it to perform correctly, etc.

Next I'm going to try and get both the LB and LV to do this with multiple items selected, I'd like to try and have it do this with multiple random items selected as in not all of the selected items are right next to each other.

[.paul.]

You could have a property - PreserveSpacing - or something, so you'd give your user a choice.