Drag and Drop - image of draggable item is not near mousepointer

Question

I have created pane where you can drag contact into a group,
everything works fine but the drag image is not always at the same
spot as the mouse pointer is. As visible in the image:
Drag
image.
These contacts are in a VBox:
<mx:VBox id="summariesContainer" paddingTop="10"
paddingLeft="10" >
<mx:Repeater id="contactRepeater" width="100%"
height="100%" dataProvider="{contacts}">
<!-- Draggable items -->
<contacts:ContactSummary
contact="{contactRepeater.currentItem}"
mouseMove="dragIt(event)"
dragComplete="dragCompleteHandler(event);" />
</mx:Repeater>
</mx:VBox>
When I pick the first contact from the VBox it is right where
it should be .... when I pick the second contact it is slightly
below the mousepointer. In short: The distance of the contact from
the top of the VBox is the distance it will have from the
mousepointer. How can I correct this?
Below is the contents of my dragIt method:
private function dragIt(event:MouseEvent):void {
if (!event.currentTarget is ContactSummary) {
return;
var contactSummary:ContactSummary = event.currentTarget as
ContactSummary;
var contact:Receiver = contactSummary.contact;
//Set the drag initiator based on the event object
var dragInitiator:ContactSummary = event.currentTarget as
ContactSummary;
// Create a DragSource object.
var dragSource:DragSource = new DragSource();
// Add the data to the object.
dragSource.addData(contact, 'contact');
// Create a copy of the ContactSummary to use as a drag
proxy.
var dragProxy:ContactSummary = new ContactSummary();
dragProxy = event.currentTarget as ContactSummary;
// Call the DragManager doDrag() method to start the drag.
DragManager.doDrag(dragInitiator, dragSource, event,
dragProxy);
}

Answer 1

Maybe use the ListItemDragProxy object?