Digital clock Phase 1

Flash MX

Using Action Scripts you can change the behavior of your Flash Program based on the time of day. 

In Phase 1 we will build our digital clock, using "Dynamic Text", variables, and "Action Script" and core objects.

Test it out on the right==>

Follow along with the digital_clock.fla as you go through the tutorial

1. Open a new movie set it to 550 x 400 pixels. Set your stage so you can see all of it.

2. Click Insert / New Symbol. Name it "clock movie", set behavior to movie clip.

• Select rectangle tool, make fill Black, draw a rectangle 300 pixels wide by 100 pixels high.
   
• Select Text tool, set font to Times Roman, fill white, size 30, set to dynamic text, give it a variable name of "varclockhour", in the left third of the black rectangle type "HR"
   
• Select Text tool, set font to Times Roman, fill white, size 30, set to dynamic text, give it a variable name of "varclockmin", in the center third of the black rectangle type "MN"
   
• Select Text tool, set font to Times Roman, fill white, size 30, set to dynamic text, give it a variable name of "varclocksec", in the right third of the black rectangle type "SC"
   
• Select Text tool, set font to Times Roman, fill red, size 30, between "HR" and "MN" type a ":"
   

• Select Text tool, set font to Times Roman, fill red, size 30, between "MN" and "SC" type a ":"

3. Go to Scene 1, Layer 1, Frame 1

• Drag the "clock movie" on to the stage and center it (CRTL+ALT+2, CTRL+ALT+5)

• with the "clock movie" highlighted open the action script panel

1. +Actions / Movie clip control / onclipevent / enter frame

2. +Actions / Variables / set variable

• in variable type "daynight"

• in value   + Objects / Core / Date / newdate

• Check Expression

3. + Actions / Variables /set variable

• in variable type "varclockhour"

• in value type "daynight" + objects / core / date / methods / getHours

• click expression

4. + Actions / Variables /set variable

• in variable type "varclockmin"

• in value type "daynight" + objects / core / date / methods / getMinutes

• click expression

5. + Actions / Variables /set variable

• in variable type "varclocksec"

• in value type "daynight" + objects / core / date / methods / getSeconds

• click expression

 

• Your script should look like this

  onClipEvent (enterFrame) { daynight = new Date(); varclockhour = daynight.getHours(); varclockmin = daynight.getMinutes(); varclocksec = daynight.getSeconds(); }

   

4. Close the Action Script panel.

5. Insert frame so you now have a 2 frame movie.

6. Save and Test your movie.

Prepared by Theodorb.