Changing the Position of a Control

You may want the source control to change position after the user releases the mouse button. To move a control to the new mouse location, use the Move method with any control that has been drag-enabled.

You can reposition a control when it is dragged and dropped to any location on the form not occupied by another control. To illustrate this, start a new Visual Basic project, add an Image control to the form and assign it any icon or bitmap by setting the Picture property, and then change the Image control's DragMode property to 1-Automatic.

Add the following procedure to the form's DragDrop event:

Private Sub Form_DragDrop (Source As Control, _
      X As Single, Y As Single)
   Source.Move X, Y
End Sub

This code may not produce precisely the effects you want, because the upper-left corner of the control is positioned at the mouse location. This code positions the center of the control at the mouse location:

Private Sub Form_DragDrop (Source As Control, _
      X As Single, Y As Single)
   Source.Move (X - Source.Width / 2), _
      (Y - Source.Height / 2)
End Sub

The code works best when the DragIcon property is set to a value other than the default (the gray rectangle). When the gray rectangle is being used, the user usually wants the control to move precisely into the final position of the gray rectangle. To do this, record the initial mouse position within the source control. Then use this position as an offset when the control is moved.

To record the initial mouse position

  1. Specify manual dragging of the control.

  2. Declare two form-level variables, DragX and DragY.

  3. Turn on dragging when a MouseDown event occurs.

  4. Store the value of x and y in the form-level variables in this event.

The following example illustrates how to cause drag movement for an image control named Image1. The control's DragMode property should be set to 0-Manual at design time. The Declarations section contains the form-level variables DragX and DragY, which record the initial mouse position within the Image control:

Dim DragX As Single, DragY As Single

The MouseDown and MouseUp procedures for the control turn dragging on and drop the control, respectively. In addition, the MouseDown procedure records the mouse position inside the control at the time dragging begins:

Private Sub Image1_MouseDown (Button As Integer, _
      Shift As Integer, X As Single, Y As Single)
   Image1.Drag 1
   DragX = X
   DragY = Y
End Sub

The Form_DragDrop procedure actually moves the control. To simplify this example, assume that Image1 is the only control on the form. The target can therefore only be the form itself. The Form_DragDrop procedure repositions the control, using DragX and DragY as offsets:

Private Sub Form_DragDrop (Source As Control, _
      X As Single, Y As Single)
   Source.Move (X - DragX), (Y - DragY)
End Sub

Note that this example assumes that Image1 and the form use the same units in their respective coordinate systems. If they don't, then you'll have to convert between units.

For More Information   For information on coordinate systems, see "Working with Text and Graphics" and "ScaleMode Property" in the Language Reference.