By looking at the implementation of ListBase.as in the flex framework source code, I found that I needed to override some methods. So I create a MyList.as file which subclasses the List control. The methods I first needed to override were dragEnterHandler and dragOverHandler. Both of these methods in ListBase.as look almost identical, here is the source for dragOverHandler:
protected function dragEnterHandler(event:DragEvent):void
{
if (event.isDefaultPrevented())
return;
lastDragEvent = event;
if (enabled && iteratorValid && event.dragSource.hasFormat("items"))
{
DragManager.acceptDragDrop(this);
DragManager.showFeedback(event.ctrlKey ? DragManager.COPY : DragManager.MOVE); showDropFeedback(event); return; } hideDropFeedback(event); DragManager.showFeedback(DragManager.NONE); }
The showDropFeedback method draws a line in the List control that indicates where the new item would be inserted into the List. This doesn't apply to us anymore, so I overrode the showDropFeedback method, to just highlight the item under the cursor instead:
override public function showDropFeedback(event:DragEvent):void{
var item = findItemForDragEvent(event);
var uid:String = itemToUID(item.data);
if (item){
drawItem(item, isItemSelected(item.data), true, uid == caretUID); } }
Moreover, now we want to accept the drop only if the cursor is over a list item, whereas before it allowed for drops on empty parts of the List area. This what I did:
override protected function dragEnterHandler(event:DragEvent):void{
_dragOverHandler(event);
}
override protected function dragOverHandler(event:DragEvent):void{
_dragOverHandler(event);
}
public function findItemForDragEvent(event:DragEvent):Object{
var item;
var lastItem;
var pt:Point = new Point(event.localX, event.localY);
pt = DisplayObject(event.target).localToGlobal(pt);
pt = listContent.globalToLocal(pt);
var rc:int = listItems.length;
for (var i:int = 0; i < rc; i++)
{
if (listItems[i][0])
lastItem = listItems[i][0];
if (rowInfo[i].y <= pt.y && pt.y < rowInfo[i].y + rowInfo[i].height)
{
item = listItems[i][0];
break;
}
}
return item;
}
protected function _dragOverHandler(event:DragEvent):void{
var item = findItemForDragEvent(event);
if (item){
DragManager.acceptDragDrop(this);
DragManager.showFeedback( event.ctrlKey ? DragManager.COPY : DragManager.MOVE);
showDropFeedback(event);
}else{
DragManager.showFeedback(DragManager.NONE);
}
}
I wrote a findItemForDragEvent method to find the item that the cursor is currently under or null if none exist - the code was mostly stolen from the calculateDropIndex method in ListBase.as - then I accept the drop if I get a non-null value from it.
Thx a lot man !!!