Non-time based Tutorial


1. First ensure that you have installed the flashTimer component using Macromedia Extension Manager.

2. Place a dynamic textfield on the stage which will be used for the timer output. You can do this by creating a textfield using the Text Tool in Flash and setting the textfield to be "Dynamic Text".

3. Give the textfield that you just created an instance name. For example: counterTxt

 

4. Set the desired font, font size and color in the textfield properties.

5. Drag and drop the flashTimer component from the components panel onto the stage. You may place this component anywhere that is convenient, as the component icon will become invisible when viewed. You must ensure that the component is placed on the same timeline as the textfield. For example, if the textfield exists inside a movie clip, the flashTimer component should also be inside the same movie clip.

 

6. Click on the flashTimer component that you just dragged onto the stage in order to view its parameters in the properties panel. The parameters should be set using the component inspector. If you view the properties panel, you will see a "Launch Component Inspector" button. Press this button in order to open the component inspector.


 

7. Enter the following parameters in the component inspector panel:

PROPERTY
EXAMPLE
DESCRIPTION
Non-Time based   Select this option to use the non-time based timer.
Count Down
Select "Count Down" to display a count down timer or "Count Up" to count up in time.
Count Seconds
10

The number of seconds to count up or count down.

Note: Even if the counter should be for several hours and minutes, this number should be converted to seconds.

Timer Textfield
counterTxt
 The instance name of the textfield in which the timer should appear.
Time Format
%H%:%MM%:%SS%

The format in which the counter text should appear in the textfield. Use %H% to represent the hours, %MM% to represent the minutes, %SS% to represent the seconds and %HS% to represent the hundredths of a second.

Note: If you omit, for example, the %H% value, the number of hours will be converted and added to the minutes value.
Buffer Zeros
Yes

A "Yes" or "No" option specifying whether the add a zero before the minutes and second values when the values become single digits. For example, set this property to "Yes" in order to display: 8:07 instead of 8:7
Text to appear when timer has completed
over
 The text that will appear in the timer textfield once the timer has finished counting.

 

The timer will now work correctly, however no event will occur once the timer has completed. We will now add some code to tell the timer to trigger a movie clip once the timer has completed.


8. Give the flashTimer component an instance name, for example: myCounter

 

9. Click on the timeline and press F9 to open the Actions Panel. If you are using Flash MX, you must ensure that you set your Actions Panel to "expert" mode.

10. Add the following code in the Actions Panel:

myCounter.onEndCounter = function() {
    movie1.gotoAndPlay(2);
};

 

The code above will tell a movie clip with instance name of "movie1" to start playing from frame 2, once the timer has completed. You may wish to use this event to perform any action that you wish. For example, loadMovie, getURL etc...

For examples of advanced functionality, please see the advanced section as well as the ActionScript reference.


That's it!