Back to Entry Page

Demonstration: Draggable Objects

This demo shows a basic technique for attaching Movie Clips to the cursor, making them follow, then detaching them in a new position. It also demonstrates once again how to abstract general scripts on the root layer.



We'll start by explaining the general animation scripts, attached to the single frame of the "actions" layer in the main movie:


function pickUp(mc){
  if(mc.hitTest(_root._xmouse, _root._ymouse) && _root.pickFlag != true){
    startDrag(mc, true);
    _root.pickFlag = true;
  }
 }

function letGo(mc){
  stopDrag();
  _root.pickFlag = false;
}

These scripts use two built-in Flash functions, startDrag() and stopDrag(), to attach the X and Y coordinates of the scripted Movie Clip to those of the cursor. We use the hit test to determine which of the objects is currently in play (i.e., which object the cursor is currently over). We also set a global variable, _root.pickFlag, once one object has been picked up, so that we don't end up picking up several at once.

The startDrag() function takes two arguments: the name of the Movie Clip that is being made draggable (here passed from this to mc), and a true/false option indicating whether the clip being dragged should align its centerpoint with the cursor. In this case that's what we want.

The functions pickUp() and letGo() are invoked by mouseDown and mouseUp clip event handlers on the two moveable objects.


Source file

The source file for this demonstration, draggables1.fla, is in MMShare/draggablesDemo on Crow.


University of Baltimore Logo

Copyright © 2002 School of Information Arts and Technologies