Internet Cross Logo
Internet Cross your one stop web tutorial website
Your Ad Here
Search Internet Cross Shop:

Custom Pointers with Macromedia Flash MX

by Diego Park
In this lesson we will develop a movie clip that supports a virtually unlimited number of custom pointers. With every mouse click, the pointer is changed. Similarly, the pointers could be changed using different events; for example, when the movie clip detects it is over another, it can be changed depending on what kind of movie clips is.


Pointers

Basically, we have a single movie clip, pointers (Figure 1). The graphic is to add a simple visual improvement to the first custom pointer (shadow).


IMAGE


Figure 1. As you can see, the pointers are stored in a single movie clip.

Let us inspect the pointers movie clip (Figure 2). It has just three pointers but, of course, you can add as many as you need. Indeed, you can add animated cursors in every frame.

Please notice in Layer 2 we have ActionScript lines. Thus, in every frame we have

stop();


IMAGE


Figure 2. The movie clip has three pointers, one in each frame. But note we inserted the stop() statement in every frame.

This action stops the pointer of the movie clip. Then, the movie clip will show the first frame until a play() statement is executed for this movie.

Because we want to change the mouse cursors with mouse clicks, to pass from one to another, we need to play the animation (pointers movie clip) to let the pointer advance to the next frame. But as this new displayed frame has the stop() statement too, it is displayed until another mouse click event is detected. Once the pointer is on the last frame, and we click, it will return to the first frame. Then, we have created a cycle controlled by mouse clicks.

One consideration for pointers: please be careful how you align the graphics. In the first frame, it is convenient for you to align the drawing in the left and top; in the second, it is recommended to center it; in the last frame, align it to bottom edge and horizontal center.

Finally, we have to place the movie clip and edit its actions. Please drag the movie clip from the Library window to the main scene. Remember to edit its fps (frames per second) and insert a relatively high value, such as 30. Then, the higher it is, the pointer will move smoother and you will notice a faster response. In this tutorial, you do not need to instance the movie clip.

Right-click on the movie clip and select Actions. Please insert:

onClipEvent(load)
{
Mouse.hide();
}

onClipEvent(enterFrame)
{
_x=_root._xmouse;
_y=_root._ymouse;
}

onClipEvent(mouseDown)
{
this.play();
}

We have three events: when it is loaded, when the user clicks, and finally, every time the pointer enters the frame. Of course, the first event is trivial: the system pointer is hidden. The last event detects user clicks and changes the displayed pointer using the play() statement, as explained. The second event places the movie clip with the system mouse pointer position.


Conclusion

Using basic Macromedia Flash tools, and MX version syntax, we have developed a simple but useful custom cursors system.
[Download File][Page 1]
Visit our forums to discuss / post your problems.