Flash Training: Digital Timer	Home • Food • Mates • Members • Tutorials • Forum • Buy Templates • Contact Us

Flash Tutorial - Delays, Timers & Stop Watches

Free Flash Tutorial

Creating a Digital Timer

In the previous Flash Movie the seconds just keep clocking up even when you have gone over 60. Here you will learn how to create a standard type of Digital Timer Display. In the Timer below the clock displays just like a traditional Digital Clock. You will learn how to reset the seconds from 59 back to 0 and display the minutes and seconds like this 2:49

Example E: Download the Flash file  Int 156e

Digital Timer: The Stage

On stage are three Dynamic text boxes:

The Main Stage in Flash.

Thee three Dynamic text boxes have the following Variable Names:  

myMinute  On the left.

myZero  In the middle with the zero.

mySeconds  On the right and over-lapping myZero.

If I zoom in on the Dynamic Text boxes you can see that myZero over-laps mySeconds:

The Text boxes are one on top of the other and overlap.

Digital Timer: The ActionScript

Frame 1 has the following ActionScript:

myMinute = 0;
myTimer = setInterval(wait, 1000);
function wait() {
    mySeconds++;
    if (mySeconds == 60) {
        myMinute++;
        mySeconds = 0;
    }
    if (mySeconds<10) {
        myZero = 0;
    } else {
        myZero = "";
    }
}

 

Digital Timer: ActionScript Line by Line

myMinute = 0;
Sets the Dynamic text box myMinute to display 0 at the start.

myTimer = setInterval(wait, 1000);
Calls the function named 'wait' every 1 second.

function wait() {
Start of the function 'wait'.

mySeconds++;
Increases the number of mySeconds by 1 every time the function is called.

if (mySeconds == 60) {
If mySeconds equals 60 then do the following...

myMinute++;
Increase myMinute by one.

mySeconds = 0;
Resets mySeconds back to zero.

That is the end of the code which controls the relationship between the minutes and second display. The next bit displays an extra zero in front of the second when the seconds are single digits.

For example: A digital timer would display: 1:05 for 1 minute, 5 seconds not 1: 5 which is what the display above would show. You see in ActionScript: 00 or 01 or 02 etc are not numbers. What would be displayed is 0, 1, 2 etc. The next bit of code adds in this false 'digital' zero.

if (mySeconds<10) {
If mySeconds is a number less than 10 then do the following...

myZero = 0;
myZero will display zero.

} else {
Otherwise (if my zero is ten or more) myZero will do the following...

myZero = "";
Display nothing (because there is nothing between the quote marks).

Therefore this last bit of ActionScript simply turns the false zero on or off when needed. The text boxes overlap so that the false zero displays in the correct place.