There are a few ways to create a timing system in Flash, and this is the way with less Actionscript that was used in the Create a Simple Avoiding Game tutorial, but several people have commented that they had trouble with it, so here’s a more in-depth tutorial on how to create a simple timer in Flash which can be used to keep a score, or advance levels, or whatever you need!

Stage one:

In this first stage of creating your timer, you need to set your timing variable to its original value. For timing upwards, this will generally be 0, but it’s up to you. The image above shows 2 ways of defining a numerical value. The top way is better practice and uses up less resources, it’s down to you which you use, but only use one of them!

Stage two:

Here you simply need to create a movie clip to contain your timer. It could be empty, but it’s easier to have some sort of placeholder image such as above. You can easily move it offstage or make it transparent later. It doesn’t matter what it is, nor what it is named, but it must be a movie clip.

Stage three:

Simply double-click the timer movieclip to enter the new movieclip’s timeline. This should be shown at the top, where the timeline display will read something like: ‘Scene 1, timer’ depending on what you named your timing movieclip. You’re now inside your timer, and ready to make it work!

Stage four:

Now, if you look on your timeline, you’ll see a number followed by ‘fps’. This is how many frames your timeline will run at every second, by default it’s 12 (See the mouse above). Right click on the corresponding frame on your timeline and select Add Keyframe. You can check it’s in the right place by selecting the last frame and comparing the fps number, and the number to the left of it. If they are the same, you’re ready to add some actions!

Stage five:

Putting this on the last frame only, will make it run once every second. So, every second, your clock variable that you set earlier will increase by 1. The _root. is there to reference the main timeline again, as that is where the variable was set. Remember, your variable name here, and the one you typed when you set it should match exactly, capitalisation and all.

Stage six:

Now, double click out of this timeline back onto the main stage. Now it’s time to display this variable, so users can see the time. Select the text tool and draw out a textbox onstage, then open the properties bar (CTRL+F3 if it’s not already up) Here, you’ll need to change the dropdown box from ’static’ to ‘Dynamic’ and you’ll also have to assign it a variable to display, this should be entered in the ‘Var:’ box, and should once again match the one you set earlier. You can also format the box here, to fine tune the display.

And that should do it!

One timer, done and ready to be inserted into your games!

See it in action here, and download the source .fla (Flash 8 and above) here.

(Note: I’ll cover another method of timing in another upcoming tutorial)

Bookmark and Share

Close Bookmark and Share This Page

Save to Browser Favorites / Bookmarks

Ask backflip blinklist BlogBookmark Bloglines BlogMarks Blogsvine BuddyMarks BUMPzee! CiteULike co.mments Connotea del.icio.us

Digg diigo DotNetKicks DropJack dzone Facebook Fark Faves Feed Me Links Friendsite folkd.com Furl Google

Hugg Jamespot Jeqq Kaboodle kirtsy linkaGoGo LinkedIn LinksMarker Ma.gnolia Mister Wong Mixx MySpace MyWeb

Netvouz Newsvine oneview OnlyWire PlugIM Propeller Reddit Rojo Segnalo Shoutwire Simpy Slashdot Sphere

Sphinn Spurl Squidoo StumbleUpon Technorati ThisNext Twitter Webride Windows Live Worlds Movies Yahoo!

Email This to a Friend

Copy HTML: 

 If you like this then please subscribe to the RSS Feed.

Powered by Bookmarkify™

More »

Powered by Bookmarkify™