Activity 3: Mouse Movement Tutorial

Intent:

Students will learn to:

  • Add the event user functionality to a program
  • Add mouse events
  • Create a function that allows an object to be dragged.
  • Create a function that allows an object to be dropped.

Criteria:

  • Completion of the tutorial
  • Expand the code to add other instances

Task:

  1. Open Flash. Choose ActionScript 3.0. The size may be the default and the FPS can be set to 12.
  2. Make a red square. Convert it to a symbol, the type should be Movie Clip. Name the symbol mc. The instance name should be myMovieClip.
  3. Create another instance of this object. Open the library. Drag the mc icon onto the stage. Name the instance myMovieClip2. In properties open Color Effects. Choose style Tint and make the square blue.
  4. Right-click on the first frame of the timeline and choose Actions. Add the following code.
    myMovieClip.addEventListener(MouseEvent.MOUSE_DOWN, onStartDrag);
    myMovieClip.addEventListener(MouseEvent.MOUSE_UP, onStopDrag);
    function onStartDrag(evt:MouseEvent):void {
    evt.target.startDrag();
    }function onStopDrag(evt:MouseEvent):void {
    stopDrag();
    }

    myMovieClip2.addEventListener(MouseEvent.MOUSE_DOWN, onStartDrag);
    myMovieClip2.addEventListener(MouseEvent.MOUSE_UP, onStopDrag);
    stage.addEventListener(MouseEvent.MOUSE_UP, onStopDrag);

  5.  Test the program to ensure it works.
  6. Extend the program by adding more instances of mc and changing the code as needed.
  7. Be prepared to demonstrate your program and show your Actionscript code.