Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Adobe Flash

Controlling the Movie Clip in Flash

  • Print
  • + Share This
Learn how to customize your pointer, eliminate flickering graphics, and animate with ActionScript.
From the author of

Customizing Your Pointer

Once you understand how to control the movie clip, you can build your own, custom pointer. Think of all the different pointers you use in Flash. As you choose different tools from the Tools window-the paint bucket, the eyedropper, the pencil-your pointer changes to help you understand and apply those tools. Similarly, you can tailor the pointer's form to match its function.

Customizing the pointer involves first hiding the default mouse pointer. Then you must match the location of your new graphic to the location of the hidden (but still functional) mouse pointer. To do this, you set the X Position and Y Position properties of a movie clip to the x and y positions of the mouse pointer. The x and y positions of the mouse pointer are defined by the properties _xmouse and _ymouse.

To hide the mouse pointer:

  • Select the first frame, and open the Actions panel. Choose Objects > Mouse > hide (Figure 1). When you test your movie, the mouse pointer becomes invisible.

    Figure 1

    The hide method of the Mouse object doesn't require prior instantiation.

Tip

  • Hiding the mouse pointer is a nice feature for Flash movies that are pure animations with no interactivity. You can eliminate the distraction that the pointer would cause, just as long as your users don't need to click any buttons in the movie.

To show the mouse pointer:

  • From the Actions panel, choose Objects > Mouse > show (Figure 2).

    Figure 2

    The show method of the Mouse object makes a hidden mouse visible again.

To create your own mouse pointer:

  1. Create a movie-clip symbol, and place an instance of it on the Stage. In the Instance panel, give it a name.

    This movie clip will become your pointer.

  2. Select the movie-clip instance, and open the Actions panel.

  3. Choose Actions > onClipEvent (Esc + oc). Select the Load event.

  4. Choose Objects > Mouse > hide. The Mouse.hide() method appears under the onClipEvent (load) statement. When this movie clip loads, the mouse pointer disappears (Figure 3).

    Figure 3

    The mouse pointer disappears as soon as this movie clip loads.

  5. Select the closing curly brace of the onClipEvent (load) handler. Choose Actions > onClipEvent. Select the Mouse move event. The onClipEvent (mouseMove) handler appears under the onClipEvent (load) handler.

  6. Choose Actions > setProperty.

  7. From the Property pull-down menu, select X Position. In the Target field, enter this. In the Value field, enter _root, then a dot, and then choose Properties > _xmouse. Check both Expression boxes.

  8. Again, choose Actions > setProperty.

  9. From the Property pull-down menu, select Y Position. In the Target field, enter this. In the Value field, enter _root, then a dot, and then choose Properties > _ymouse. Check both Expression boxes (Figure 4).

    Figure 4

    The setProperty statements set the x and y positions of the current movie clip to the x and y positions of the mouse pointer whenever it moves.

  10. Test your movie (Figure 5).

    Figure 5

    This magnifying glass is a movie clip that matches the x and y positions of the pointer. Create helpful pointers like this whose appearance matches their function.

  • + Share This
  • 🔖 Save To Your Account