1

I am developing an application aimed at children with disabilities, so I need to make it simple and offer a lot of visual feedback. I am using Visual Basic .NET (2013), and most of the examples I find are for older versions of VB, mainly VB6.

Either way, the main feature I am dealing with right is the drag and drop operation on images. I have never done this before, so I am working on a test Windows Forms Application, with two picture boxes: one is the drop target, and the other is the drag source.

Issue 1) So far, I have managed to make the source picture box reposition itself wherever the cursor goes when the drag operation takes place. The movement is not smooth, and you can only see the picture box in the new position once you release the mouse button. If possible, I'd like it to give the child user more feedback on what he/she is doing, so that means making the source picture box reposition itself even while the mouse button is being held, so long as the picture is being dragged around.

Issue 2) When the source picture box is being dragged, as I drag the cursor over controls that are not drop targets, I get a black "No" cursor. How can I change this cursor or even hide it? I've tried changing the cursor on the GiveFeedback and other drag-drop related event handlers, but nothing seems to work for that particular moment. Here is a screenshot to illustrate what I am saying:

Issue 2 Illustration

Either way, the idea is to make this application feel as smooth, friendly and expressive as possible or necessary for children with PDD (for instance, autism), who probably cannot read and therefore rely on visual and audible feedback. There will be dragging pictures around the form to create sentences (look into PECS, if you want to learn more).

Here is my drag and drop code so far (pardon the mess):

Public Class frmDragDropExample
Private mouseIsDown As Boolean = False ' Use this variable as a flag to indicate when the mouse is down
Private Offset As Point 'Use this to set the offset position, to move the picture being dragged

Private Sub frmDragDropExample_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    ' Declare this picture box as the target of the drag-and-drop operation
    dragDropTargetPictureBox.AllowDrop = True
End Sub

Private Sub dragDropSourcePictureBox_GiveFeedback(sender As Object, e As GiveFeedbackEventArgs) Handles dragDropSourcePictureBox.GiveFeedback
    ' Nothing here yet!
End Sub

Private Sub sourcePictureBox_MouseDown(sender As Object, e As MouseEventArgs) Handles dragDropSourcePictureBox.MouseDown
    ' Indicate that the mouse is down
    mouseIsDown = True
    Cursor.Current = Cursors.Hand
    ' Set the offset values to move the picture being dragged
    Offset.X = MousePosition.X - sender.Left
    Offset.Y = MousePosition.Y - sender.Top
End Sub


Private Sub sourcePictureBox_MouseMove(sender As Object, e As MouseEventArgs) Handles dragDropSourcePictureBox.MouseMove
    If mouseIsDown Then
        ' Initiate the dragging.
        dragDropSourcePictureBox.DoDragDrop(dragDropSourcePictureBox.Image, DragDropEffects.Move)
        ' Move the object along with the cursor for more feedback (the user should tell that the object is being moved around)
        sender.Left = MousePosition.X - Offset.X
        sender.Top = MousePosition.Y - Offset.Y
    End If
    ' Otherwise... mouse is down.
    mouseIsDown = False
End Sub

Private Sub targetPictureBox_DragDrop(sender As Object, e As DragEventArgs) Handles dragDropTargetPictureBox.DragDrop
    ' Paste the picture.
    dragDropTargetPictureBox.Image = e.Data.GetData(DataFormats.Bitmap)
    ' Play a sound as feedback (the picture has been moved!).
    My.Computer.Audio.Play(My.Resources.sfx_paper_flip_01, AudioPlayMode.Background)
    ' Also color the target pictue box white again, as feedback
    dragDropTargetPictureBox.BackColor = Color.White
    ' Dispose of the picture (should handle garbage collection, too --so many pictures!)
    dragDropSourcePictureBox.Dispose()
End Sub


Private Sub targetPictureBox_DragEnter(sender As Object, e As DragEventArgs) Handles dragDropTargetPictureBox.DragEnter
    ' Check the format of the data being dropped --it should be a bitmap/image
    If (e.Data.GetDataPresent(DataFormats.Bitmap)) Then
        ' Color the target picture box for feedback
        dragDropTargetPictureBox.BackColor = Color.LightGray
        ' Display the move cursor.
        e.Effect = DragDropEffects.Move
    Else
        ' Display the no-drop cursor.
        e.Effect = DragDropEffects.None
    End If
End Sub

Private Sub dragDropTargetPictureBox_DragLeave(sender As Object, e As EventArgs) H

andles dragDropTargetPictureBox.DragLeave
        dragDropTargetPictureBox.BackColor = Color.White
    End Sub
End Class

Thank you in advance!

  • Having an empty GiveFeedback event handler is the obvious reason. Just look at the MSDN example code for [Control.GiveFeedback](http://msdn.microsoft.com/en-us/library/system.windows.forms.control.givefeedback%28v=vs.110%29.aspx) if you have no idea how to progress. What is supposed to go there is really up to you, only you know what terms like "smooth, friendly and expressive" could possibly mean. They are useless terms when talking about code. – Hans Passant Feb 27 '14 at 21:52
  • I managed to deal with the drag movement (if you know digital card games, like Solitaire, how it looks when you drag cards around, I was referring to that). But I am still clueless about the cursor. I want to change the cursor at all times during the dragging, but still don't know how. Thanks for the feedback. – Jessica M. Vázquez Rodríguez Mar 06 '14 at 20:07

0 Answers0