The MovieClip event handler properties onMouseDown( ), onMouseUp( ), onMouseMove( ), onKeyDown( ), and onKeyUp( ) are executed immediately upon the occurrence of their corresponding events. Immediately means immediately�even if the event in question occurs between the rendering of frames.
This immediacy can give a movie great responsiveness, but that responsiveness can easily be lost by improper coding. By default, the visual effects of onMouseDown( ), onMouseUp( ), onMouseMove( ), onKeyDown( ), and onKeyUp( ) are not physically rendered by the Flash Player until the next available frame is rendered. To see this in action, create a single-frame movie with a frame rate of 1 frame per second. Place a movie clip named circle_mc on the Stage and attach the following code to frame 1 of the main timeline:
circle_mc.onMouseDown = function ( ) { this._x += 10; }
Then, test the movie and click the mouse as fast as you can. You'll see that all your clicks are registered, but the movie clip still moves only once per second. So, if you click 6 times between frames, the clip will move 60 pixels to the right when the next frame is rendered. If you click 3 times, the clip will move 30 pixels. The cumulative effect of each execution of the onMouseDown( ) event is "remembered" between frames, but the results are displayed only when each frame is rendered. This can have dramatic effects on certain forms of interactivity.
Fortunately, we can force Flash to immediately render any visual change that takes place during a user-input event handler, without waiting for the next frame to come around. We simply use the updateAfterEvent( ) function from inside our event handler, like this:
circle_mc.onMouseDown = function ( ) { this._x += 10; updateAfterEvent( ); }
The updateAfterEvent( ) function is available for use only with the onMouseDown( ), onMouseUp( ), onMouseMove( ), onKeyDown( ), and onKeyUp( ) MovieClip events and the setInterval( ) function. It is often essential for smooth and responsive visual behavior associated with user input. Later, in Example 10-3, we'll use updateAfterEvent( ) to ensure the smooth rendering of a custom pointer. Note, however, that button events do not require an explicit updateAfterEvent( ) function call. Button events update the Stage automatically between frames.
|