Simple animation slider
Learn how to create a slider to navigate through the frames of your movie. Like this:
A. THE ELEMENTS
As you can see below, I've used 4 elements for this movie:
1. The "framecount" clip, which is a clip with a textfield inside it. I placed it on the stage and I named it "framecounter".
The textfield inside it has the name "theframe". It is just a counter that counts the current frame of the movie.
It exists only to make the progress of the movie obvious.
2. The "toglestoplay" clip (the red one), which is a clip with 2 frames
The first with a stop symbol and frame label: "stopit" and the second with a play symbol and a frame label: "playit".
I placed it on the stage and named it "stopbut". It is stoped in the first frame. It starts and stops the movie.
The above 2 elements are not essential to the functionality of the slider. The next one is used as the bar for our slider.
3. The "bar" clip. It's just a gray rectangle.
Make sure that the shape inside the clip is placed at coordinates 0,0 according to the reference point of the clip.
It doesn't matter where you'll place it. The actionscript will place it in its place according to the slider and it will adjust its width according to your desire!
I named its instance on the stage "lineclip".
Let's get on to the star of this tutorial:
4. The "slider". It's the green rectangle. Make sure again that the shape inside the clip is placed at coordinates 0,0 according to the reference point of the clip.
Place it wherever you like, just make sure that its X coordinate is a round number (not something like 45.8) . It will save you from much trouble.
The slider will move according to the main timeline and when you drag it, it will take the timeline to the frame you want.
I named its instance on the stage "slide".
So we have framecounter, stopbut, lineclip and slide to work with. Place them in separate layers and let's move to the script.'
|» Level Intermediate|
Rating: 6.9 Votes: 30
|Download the files used in this tutorial.|
|Download (17 kb)|
|More help? Search our boards for quick answers!|