Get Microsoft Silverlight

Wednesday, March 14, 2007

Simple WPF Clock using Microsoft Expression Blend

Today I spend some time playing with Microsoft Expression Blend. and thought of creating a XAML Clock using Blend itself. Surprisingly it took less than 2 hours for me to create a good looking Clock. Here is the preview of my XAML Clock.

Below are the simple design steps I followed.
1) Created a Class TimeAngles which stores Angles corresponds to Hour,Minute and second.

2) Created an IValueConverter class for converting the DateTime.Now to Angles.

3) Bounded the each Angle properties of TimeAngles class to the Rotation RenderTransform of each Clock Hand (Which are Rectangle in my code)

4) Updated the DataContext of Clock in each second through a Despatcher Timer.

Here is a screen shot of the project opened up my Blend. I have used BitMapEffect extensively to achieve this kind of a UI.

Source code is Available here


Platypus said...

Hi Jobi!

I'm very interested to have a look at your code, but I can't download it... (we cannot open new account on the download blog!).

Can you send me your code on my mail please? ( platypus_sparta[at]

Thx very much!

Anonymous said...

could some one email the source code
The administrator will not let any new accounts be created.

Anonymous said...

Hello, my name is Andrew, I live in Ukraine.
The perfect example. On the basis of his wish to try to control.
If not difficult, withdrew source project.


FrIuNs said...

please send for me too source code=)

Jobi Joy said...

I have updated this blog with all the broken link corrected. Sorry for the delay.

Unknown said...

Programming is very interesting and creative thing if you do it with love. Your blog code helps a lot to beginners to learn programming from basic to advance level. I really love this blog because I learn a lot from here and this process is still continuing.
Love from Pro Programmer