How can I implement drag-out-to-delete in Flex?

Question

I have a List component from which I'd like to be able to remove items using drag & drop, but without having a specific target. If you use the mac, the behaviour I'm looking for is something like what the Dock uses; when you drag something out of the bounds of the control it should get an icon that indicates that it'll be deleted (OSX uses a cloud or something?) and then if you release it it will be removed from the list.

How can I do this?

(If I need to provide a more clear description, please comment; I'll fill in what I can)

Answer 1

Having no Flex experience all I can offer is some psuedo code which resembles how I implemented a similar effect in JavaScript, but hopefully it will get you started.

Essentially what you'll want to do is during your drag event measure the current coordinates of the object you're dragging to see if they intersect the original container and when they fall outside of its bounds call the logic to update the icon in order to indicate it will be removed. Then, on the drop event, check the coordinates once more and delete the item if needed.

Answer 2

In my experience with drag/drop in Flex, you cannot simply drag something out and handle that. There is no dragOut event (unfortunately), so that would leave you up to the task of writing dragOver and dragDrop listeners on all the containers surrounding your dragInitiator and handling the process accordingly.

It's more time consuming and can become complicated if any of these controls already have specific dragOver and dragDrop event handlers.

Hope this helps.