Animated Wall Clock using Processing Programming Language
Hello friends! Meanwhile I was learning “Processing” programming language and was trying out my hands on some cool experiments. In this post, I want to share with you the processing code which I wrote for an animated wall clock.
By the way, Processing is an open source programming language initiated by Ben Fry and Casey Reas at Massachusetts Institute of Technology (MIT) during 2001. You can learn more about this platform at their official Website. If you are unknown to processing environment, then do visit their site and learn this language. Processing is cool to learn.
In my processing code for animating a wall clock, I have made good enough use of axes translation translate() and rotation rotate() feature of processing. In my computer, the clock rotations are in sync with the correct timing, only when I use 6 frames per second speed. This frame rate may vary depending on your system configuration.
My code for the wall clock is given below:
By the way, Processing is an open source programming language initiated by Ben Fry and Casey Reas at Massachusetts Institute of Technology (MIT) during 2001. You can learn more about this platform at their official Website. If you are unknown to processing environment, then do visit their site and learn this language. Processing is cool to learn.
In my processing code for animating a wall clock, I have made good enough use of axes translation translate() and rotation rotate() feature of processing. In my computer, the clock rotations are in sync with the correct timing, only when I use 6 frames per second speed. This frame rate may vary depending on your system configuration.
Animated Wall Clock programmed using processing |
My code for the wall clock is given below:
/*
PROCESSING PROJECT
ANIMATED WALL CLOCK
PROGRAMMED BY: AMIT BISWAL
URL: http://amitbiswal.blogspot.com
*/
float rad, deg=0;
int clkDia=500;
int resol=clkDia/10;
void setup()
{
size(600, 600);
}
void draw()
{
frameRate(6); //FRAME RATE = 6 FRAME PER SECOND
rad=(deg*PI)/180.0;
background(24, 215, 234);
clockFrame();
hourHand(rad/720);
minuteHand(rad/60);
secondHand(rad);
strokeWeight(10);
stroke(0);
point(0, 0);
strokeWeight(1);
deg+=1;
}
void clockFrame()
{
float j=0;
int k=1;
translate(width/2, height/2);
fill(136, 9, 175);
stroke(136, 9, 175);
for (j=0;j<(2*PI);j+=(PI/60))
{
pushMatrix();
rotate(j);
ellipse(0, -(clkDia/2)-15, 15, 30);
popMatrix();
}
stroke(0);
fill(22, 222, 37);
ellipse(0, 0, clkDia+40, clkDia+40);
fill(218, 222, 22);
ellipse(0, 0, clkDia, clkDia);
fill(247, 208, 157);
ellipse(0, 0, clkDia-40, clkDia-40);
textSize(20);
strokeWeight(2);
fill(0);
for (j=PI/6;j<(2*PI);j+=(PI/6))
{
pushMatrix();
rotate(j);
strokeWeight(1);
text(k++, -7, -(clkDia/2)-5);
line(0, 0, 0, -clkDia/2);
stroke(247, 208, 157);
strokeWeight(4);
line(0, 0, 0, -((clkDia/2)-20));
stroke(0);
popMatrix();
}
k=0;
for (j=0;j<(2*PI);j+=(PI/30))
{
pushMatrix();
rotate(j);
if ((k++%5)==0)
{
stroke(245, 41, 5);
strokeWeight(5);
}
else
{
stroke(0);
strokeWeight(2);
}
point(0, -(clkDia/2)+25);
popMatrix();
}
strokeWeight(1);
}
void hourHand(float angle)
{
pushMatrix();
rotate(angle);
stroke(0);
fill(48, 160, 11);
quad(0, 0, clkDia/2-120, -10, clkDia/2-100, 0, clkDia/2-120, 10);
popMatrix();
fill(247, 208, 157);
}
void minuteHand(float angle)
{
pushMatrix();
rotate(angle);
stroke(0);
fill(30, 7, 170);
quad(0, 0, -10, -20, 0, -(clkDia/2-50), 10, -20);
fill(247, 208, 157);
popMatrix();
}
void secondHand(float angle)
{
pushMatrix();
rotate(angle);
strokeWeight(2);
stroke(234, 52, 24);
line(0, 40, 0, -(clkDia/2-25));
ellipse(0, 40, 10, 10);
popMatrix();
}
If you have any suggestions or query, then do comment below and let me know.
Hello. I have one suggestion:
ReplyDeleteProcessing has three neat little functions, hour(), minute(), and second(), which return the exact hour, minute, and second respectively that your computer clock displays. I think this clock would be more useful if it implemented these, rather than the somewhat unreliable framerate of a computer.