-
Step 1
Making a movie clip rewind requires three things: the main movie clip that you're controlling, another movie clip as the rewind button and a third movie clip that exists solely to repeat the reverse playback motion one frame at a time until certain conditions are met. To start with, once you've created an animated movie clip to be rewound, assign an instance name to it in the Properties panel. In this example, the movie clip is called "animation" and will be referred to as such in any ActionScripts used.
-
Step 2
Next create a movie clip that will act as the rewind button when pressed. You don't have to assign an instance name to this, but it's good practice to do so anyway.
-
Step 3
Now create a third movie clip that will hold part of the controls for the rewind playback. This can be empty if you have it on your visible stage; if you use a random visible shape, make sure it's off-stage so that it won't be seen in your main scene.
-
Step 4
Assign an instance name to the third movie clip. In this example the movie clip is called "controller", and will be referred to as such in any ActionScripts used.
-
Step 5
Double-click on the controller movie clip to edit it. Ignore the contents of the stage; the movie clip's timeline is the only thing to be concerned about. On the timeline you should insert two blank keyframes after the first keyframe, so that you have three keyframes in a row on frames one through three.
-
Step 6
Right-click on the first frame, open the Actions panel, and insert a stop(); script. This will stop the clip from automatically triggering the rewind action without any user input.
-
Step 7
Right-click on the third frame, open the Actions panel, and insert the following script:
if (_root.animation._currentframe>1) {
_root.animation.prevFrame();
this.gotoAndPlay(2);
}
if (_root.animation._currentframe<=1) {
this.gotoAndStop(1);
}
with the names of both the controller clip and the animated clip changed to match your instance names. This if statement checks the current frame number of the animated clip and, if it's greater than or equal to one, moves it back by one frame before jumping the timeline of the controller movie clip to frame two. When it plays forward from frame two to frame three again, it runs this script again and either rewinds by another frame or, if the second if statement tests true and the frame number of the animated clip's timeline is less than or equal to one, stops the rewind process and puts the controller clip back into an inactive/holding state by jumping it back to frame one, where the stop(); script prevents it from moving on to play through frame three and run the frame-by-frame rewind again. This creates a continuous loop that gives the illusion of a smooth rewind when it's actually rewinding by one frame at a time, over and over again. -
Step 8
Because of the way the controller clip is set up, it has to be triggered by user action. That action will be determined by the actual rewind button itself; return to the main stage and right-click on the rewind button movie clip.
-
Step 9
Open the Actions panel for the rewind button, and insert the following script:
on (press) {
_root.controller.gotoAndPlay(2);
}
on (release) {
_root.controller.gotoAndStop(1);
}
Notice that this doesn't reference the animated clip at all; only the clip that controls the playback of the animated clip. This sets up the rewind button so that as long as the user is holding the mouse down over the button, the animated clip will continue to rewind. The on (press) causes the controller clip to jump ahead to frame two, bypassing the stopped frame and beginning the rewind loop between frames two and three of the controller clip. The on (release) waits until the user lets go of the rewind button; then the animated movie clip stops at that exact moment, while the controller clip jumps back to frame one, where the stop(); script once more renders it inactive.
