var clock:Sprite = Sprite(addChild(new Sprite()));
clock.x = clock.y = 150;
var bg:Shape = Shape(clock.addChild(new Shape()));
with (bg.graphics) lineStyle(2, 0x666666), beginFill(0xEFEFEF), drawCircle(0,0,110);
var hHand:Shape = clockHand(6, 50);
var mHand:Shape = clockHand(2, 80);
var sHand:Shape = clockHand(1, 90);
var center:Shape = Shape(clock.addChild(new Shape()));
with (center.graphics) beginFill(0x000000), drawCircle(0,0,5);
var hInc:Number = 360/24;
var msInc:Number = 360/60 ;
var nOff:Number = 6;
var verdana:TextFormat = new TextFormat("Verdana", 8);
// add numbers to clock
for (var i:int = 0; i<24; i++){
var ang:Number = (i * hInc - 90) * Math.PI/180;
createNumber(70,ang, i.toString());
var ms:Number = i * 2.5;
if (ms % 5 == 0){
createNumber(95, ang, ms.toString());
}
}
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
var date:Date = new Date();
hHand.rotation = hInc * date.getHours();
mHand.rotation = msInc * date.getMinutes();
sHand.rotation = msInc * date.getSeconds();
}
function clockHand(thickness:Number, leng:Number):Shape{
var hand:Shape = Shape(clock.addChild(new Shape()));
with (hand.graphics) {
lineStyle(thickness, 0x000000, 1, true, LineScaleMode.NORMAL, CapsStyle.SQUARE);
lineTo(0,-leng);
}
return hand;
}
function createNumber(radius:Number, theta:Number, str:String):void{
var t:TextField = TextField(clock.addChild(new TextField()));
with (t) defaultTextFormat = verdana, t.autoSize = "left";
t.text = str;
t.x = radius * Math.cos(theta) - nOff;
t.y = radius* Math.sin(theta) - nOff;
}
I was watching a movie the other day and I saw a 24 hour clock in the background of one of the shots. After the movie I coded this snippet. It draws a very basic clock with an hour hand that takes 24 hours to go full circle…

Very cool. One minor correction … in the for loop that draws the clock face numbers, use this code for the part that draws the seconds:
if (ms % 10 == 0) {
createNumber(95, ang, (ms/2).toString());
}
Thanks for the comment Jeff… I’m not sure I understand why you suggest that though, could you explain? ๐
Ha! My fault. I used a regular expression search/replace to remove the line numbers from your code, and it changed the code in line 22 to this:
var ms:Number = i * 5;
๐
Ah yes… The dangers of find and replace, I know them well ๐