Tutorial Downloads

File Size
Clock.capx352KB

Translations

Know another language? Translate this tutorial!

Stats

1,176 visitors
4.5K page views

Clock in Construct 2

Favourite 10 favourites
Tutorial written by Lordshiva1948Originally published on 23rd, November 2014

Someone asked me some time ago that could I make analogue clock? I did not have time as I was working for someone on project. As I am free at the moment. I thought I will create analogue clock for you beginners. Not hard to make in Construct 2 code. Depend on how fancy or impressive you want to design. Mine is simple one.

Also this person said not to use any plug-in, only in C2. Well you or anyone can do this. All you need is logically adding code. We know that 60 seconds in one Minute. 60 Minutes in one Hour and on clock dial we see 12 hours numeral. Please some of you will argue with me and say there are 24 numeral clock is well but, so what. Now let’s start with our clock in C2.

1. Create new project and name it Clock
2. Set windows size to 640 x 480
3. Set layer and margin size same 640 x 480
4. Now create 4 layers and named them as below

Second-hand
Minutes
Hours
Dial

Note make sure your grid set to 32 x 32 and all your sprite should be snap to grid

Locked layer second-hand, Minutes and hours. Why we locking this because when we start adding our Second, minute and hours hand, we don’t want to make any mistake with other layers. Now you can create your own sprite or you are free to use mine. For dial you will need something simple like below:
Place your dial somewhere on left hand side and lock dial layer.
Add sprite hour holder and hour hand
Now place you Hour holder in centre of your dial. Once you done this we will pin hour hands with code so place your hour hand on top of your hour holder. Lock the hour layer
unlock Minute layer and do the same as above add this minute hand and minute holder once you done this lock minute layer.
Unlock Seconds layer and add this two sprites and place them as above.
Now add three text box and name them
txtSeconds
txtMinutes
txtHours
once you done this your screen should look like below:


Now open your event editor and add these global variables below:
Now add this code below:
Open full size image

Now if you have followed the tutorial you should have working clock. With this you could add system time and start your clock according to your time zone. Go ahead and learn from this. Merry Christmas to each and everyone. Merry Christmas Ashley, Tom, Julian rest of crew

Unlock your full gamedev potential

Upgrade to the Personal Edition of Construct 2, it has way more features and won't holding back from making money and using your full creativity like the free edition does. It's a one off payment and all Construct 2 editor updates are free for life!

View deals

Plus, it's got a lot of additional features that will help you save time and make more impressive games!

Congratulations on finishing this tutorial!

Did you learn a lot from it? Share it now with your friends!

Share and Copy this Tutorial

You are free to copy, distribute, transmit and adapt this work with correct attribution. Click for more info.

Comments

0
resdesign 618 rep

Cool! Thanks for the example. So since it is far from Christmas, happy day!

Wednesday, May 10, 2017 at 8:38:26 PM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.