Drag-and-drop

I've worked with a couple of people this semester to make a basic drag and drop interaction. Take a look at the flash file below to see this interaction and reuse my code.

dragTest.html
dragTest.fla

It's a fairly simple set up:

1. Create movie clips for your drag items and target areas.
2. Add an instance name to each target area.
3. Add the following actionscript to each drag item.
4. Adjust as needed.

This first section initiates the drag, with "startDrag(this)" on press.

on(press) {
startDrag(this);
}

This code tells Flash what to do with the drag item when it's released. I use this to determine the position of the drag item based on the user's action.

on(release) {
stopDrag();
if (this._droptarget == "/house1"){
setProperty(this,_x,50);
setProperty(this,_y,160);
} else {
setProperty(this,_x,130);
setProperty(this,_y,50);
}
}

In this case, the first part of the if statement tells Flash to position the drag item on top of the target if dropped on it. The second part uses the original X,Y position of the drag item to snap it back to its original location if the user does not drop it on the target. (Hint: use the properties panel to find needed X and Y positions)

Finally, you may want to add a bit of code to prevent the user from moving the drag item again after it has been released. Adapt the on(press) function to use this code (the item is only movable when NOT on its target):

on(press) {
if (this._droptarget != "/house1"){
startDrag(this);
}
}