# Time elapsed correlated with FrameCount

**URL:** <https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004>\
**Category:** Coding Questions\
**Created:** [February 22, 2021, 3:30pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004 "2021-02-22T15:30:44Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![bking](https://avatars.discourse-cdn.com/v4/letter/b/dc4da7/32.png) [@bking](https://discourse.processing.org/u/bking)\
**Post date:** [February 22, 2021, 3:30pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/1 "2021-02-22T15:30:44Z")

</div>

Hello guys and girls,  
Hi made a function to see seconds elapsed from the the first frame.  
I did like that

```auto
int Time=0;
void setup (){
 frameRate(30);
  }
void TimeElapsed () {
  if ((frameCount%30)==0) {
   Time+=1;
   } 
      textSize (100);
      text (Time, -width, -height);
      text( second(), width/2, -height);
     } 

```

But there is an offset between the counter shown on the Processing’s screen and the clock of my computer.  
The counter does not go fast enough.

What did I make wrong?  
Thanks for your help.

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [February 22, 2021, 5:12pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/2 "2021-02-22T17:12:40Z")

</div>

Time releated functions in Processing:

- millis() - time since the start of the program (in milliseconds)
- second() - computer time
- minute() - computer time - min
- hour()
- …  
check processing reference for more info

---

<div class="post-metadata">

**Author:** ![bking](https://avatars.discourse-cdn.com/v4/letter/b/dc4da7/32.png) [@bking](https://discourse.processing.org/u/bking)\
**Post date:** [February 23, 2021, 8:44am UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/3 "2021-02-23T08:44:25Z")

</div>

I really need to have time correlated with frame, because sometimes I stop the program with noLoop and run it again. I make sounds with an other software and I need to see the time exactly.  
Normally with frameRate(30); I should have each 30 frames, one seconde, no?  
My program below

```auto
int TimeFrame;
int sec,counter; 

void setup (){
 counter=0;
 frameRate(30);
  }
public void settings() {
   size(800, 800);
  }  
void draw () {
   background (0);
   println (frameCount);
   TimeFrameElapsed (); 
   }
   
void TimeFrameElapsed () {
if ((frameCount%29)==0) {
   TimeFrame+=1;
   } 
      fill (255);
      textSize (100);
      text (TimeFrame, width/2, height/2);
      println (TimeFrame);
      text(second(), width/4, height/2);
  } 

```

Thanks for your help.

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [February 23, 2021, 12:28pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/4 "2021-02-23T12:28:54Z")

</div>

it’s normal because frameRate(30) means Processing “tries” to reach 30 frames per second, but it’s not guaranteed.

you need “delta time” between the previous and current frames, and this thread may be helpful

> **[Processing 2.x and 3.x Forum](https://forum.processing.org/two/discussion/18478/deltatime)**
>
> Processing is an electronic sketchbook, a language and a worldwide community. This is its forum.

Applying jeremy’s idea on your code

```java
float TimeFrame;
int lastMillis = 0;
int sec, counter; 

void setup () {
  counter=0;
  frameRate(30);
}
public void settings() {
  size(800, 800);
}  
void draw () {
  background (0);
  println (frameCount);
  TimeFrameElapsed ();
}

void TimeFrameElapsed () {
  //if ((frameCount%29)==0) {
  // TimeFrame+=1;
  //} 
  int m = millis();
  TimeFrame += float(m - lastMillis) * 0.001;
  lastMillis = m;
  fill (255);
  textSize (100);
  text (TimeFrame, width/2, height/2);
  println (TimeFrame);
  text(second(), width/4, height/2);
}

```

note that the displayed times are different because `second` is the clock time (like, your clock on the wall) and `millis` is based on the milliseconds elapsed since you started your sketch.

---

<div class="post-metadata">

**Author:** ![bking](https://avatars.discourse-cdn.com/v4/letter/b/dc4da7/32.png) [@bking](https://discourse.processing.org/u/bking)\
**Post date:** [February 23, 2021, 2:39pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/5 "2021-02-23T14:39:19Z")

</div>

> [@micuat](#):
>
> ```auto
> void TimeFrameElapsed () {
> //if ((frameCount%29)==0) {
> // TimeFrame+=1;
> //} 
> int m = millis();
> TimeFrame += float(m - lastMillis) * 0.001;
> lastMillis = m;
> fill (255);
> textSize (100);
> text (TimeFrame, width/2, height/2);
> println (TimeFrame);
> text(second(), width/4, height/2);
> }
> 
> ```

Hi micuat!

Actually I’m looking for a timer that turns off when I stop the loop, with key == ‘£’, and start again when I run the loop.  
I did this, it doesn’t work.

```auto
float TimeFrame;
int lastMillis = 0;
int sec, counter; 
 

void setup () {
// noLoop ();
  counter=0;
  frameRate(30);
}
public void settings() {
  size(800, 800);
}  
void draw () {
  background (0);
  TimeFrameElapsed ();
 // println (frameCount);
  text (TimeFrame, width/2, height/2);
 
}

void TimeFrameElapsed () {
  //if ((frameCount%29)==0) {
  // TimeFrame+=1;
  //} 
 
  
  int m = millis();
  TimeFrame += float(m - lastMillis) * 0.001;
  lastMillis = m;
  fill (255);
  textSize (100);
  text (frameCount, width/2, height/4);
  text (TimeFrame, width/2, height/2);
  println (TimeFrame);
  text(second(), width/4, height/2);
}

            
void keyPressed () {
  if (key == '£') {   
             noLoop();     
            }
else { 
        loop();          
             }    
                    
}

```

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [February 23, 2021, 3:20pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/6 "2021-02-23T15:20:02Z")

</div>

yes, because right now the “delta time” would be still counting when you set it noLoop. I guess you have to make a flag (boolean variable) - that turns on when you pause the sketch and goes off when you resume it. If the flag was on (it was paused) then you skip adding the delta time so you discard the time elapsed while the sketch was paused. I will give this to you as an “assignment” but if you try and still have issues feel free to post it!

---

<div class="post-metadata">

**Author:** ![bking](https://avatars.discourse-cdn.com/v4/letter/b/dc4da7/32.png) [@bking](https://discourse.processing.org/u/bking)\
**Post date:** [February 24, 2021, 11:41am UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/7 "2021-02-24T11:41:19Z")

</div>

Hi it’s a bit complicated for me because I don’t how to use flag.  
I did only this for the moment but I need quickly a solution because I have an other part of my work to do depending of this timer stopping and starting again.

```auto
int lastTime = 0;
int delta = 0;
int time1, time2;
int actualTime; 

void draw(){
  frameRate (10);
  delta = millis() - lastTime;
   print ("delta: "); println(delta);
  lastTime = millis();     
}

void keyPressed(){
  
    if ((key == '`') || (key == '£')) {   
          noLoop(); 
            }
         else { 
          loop();
   }
  time1 = millis();
  print ("time1: "); println(time1);

}

void keyReleased(){
   time2 = millis() - time1; // delta betwwen KeyPressed and KeyRelased
  print ("time2: "); println(time2);
 // actualTime+= ??
  print ("actualTime: ");
  println (actualTime);// Here I need to see time running with the add of the last time when the loop was off.
}

```

---

<div class="post-metadata">

**Author:** ![bking](https://avatars.discourse-cdn.com/v4/letter/b/dc4da7/32.png) [@bking](https://discourse.processing.org/u/bking)\
**Post date:** [February 24, 2021, 5:22pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/8 "2021-02-24T17:22:55Z")

</div>

Hello  
I have tried this. When I push a key time, the time elapsed adding itself.  
When I released a key, it stop

```auto
int lastTime = 0;
int delta = 0;
int time1, time2;
int actualTime;

public void settings() {
  size(800, 800);
}  

void draw(){
  background (0);
  
text (actualTime, width/2, height/2);
}

void keyPressed(){
 
  noLoop();
  time1 = millis(); // when i push a key, time elapsed add itself
  print ("time1: "); println(time1);
    background (0);
  
text (actualTime, width/2, height/2);

}

void keyReleased(){
 loop();
   time2 = millis() - time1;
   actualTime+= time2; 
  print ("actualTime "); println(actualTime);
  
    background (0);
  
text (actualTime, width/2, height/2);
  time1 = millis();
 
}

```

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [February 24, 2021, 7:43pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/9 "2021-02-24T19:43:18Z")

</div>

nice attempt!

I see that noLoop/loop makes it a bit harder to track what is happening. I would suggest replacing them with a variable (in this case `running`) and draw function is executed only when `running` is true:

```auto
int lastTime = 0;
int delta = 0;
int time1, time2;
int actualTime;

boolean running = true;

public void settings() {
  size(800, 800);
}  

void draw() {
  if (running == false) return;
  background (0);

  text (actualTime, width/2, height/2);
}

void keyPressed() {
  time1 = millis(); // when i push a key, time elapsed add itself
  print ("time1: "); 
  println(time1);

  running = false;
}

void keyReleased() {
  time2 = millis() - time1;
  actualTime+= time2; 
  print ("actualTime "); 
  println(actualTime);
  time1 = millis();
  
  running = true;
}

```

and let’s adapt the code from above to use “deltatime”

```auto
float timeFrame;
int lastMillis = 0;

boolean running = true;

public void settings() {
  size(800, 800);
}  

void draw() {
  if (running == false) return;
  
  int m = millis();
  timeFrame += float(m - lastMillis) * 0.001;
  lastMillis = m;
  
  background (0);

  textSize(100);
  textAlign(CENTER, CENTER);
  text(timeFrame, width/2, height/2);
}

void keyPressed() {
  running = false;
}

void keyReleased() {
  running = true;
}

```

it’s almost there but the time still counts when the key is pressed. The easiest way to fix this would be to reset `lastMillis` when key is released - so basically we are “faking” that no time has passed between when you started pressing button and when you released (note that draw function is skipped during that time)

```auto
float timeFrame;
int lastMillis = 0;

boolean running = true;

public void settings() {
  size(800, 800);
}  

void draw() {
  if (running == false) return;
  
  int m = millis();
  timeFrame += float(m - lastMillis) * 0.001;
  lastMillis = m;
  
  background (0);

  textSize(100);
  textAlign(CENTER, CENTER);
  text(timeFrame, width/2, height/2);
}

void keyPressed() {
  running = false;
}

void keyReleased() {
  running = true;
  int m = millis();
  lastMillis = m;
}

```

---

<div class="post-metadata">

**Author:** ![bking](https://avatars.discourse-cdn.com/v4/letter/b/dc4da7/32.png) [@bking](https://discourse.processing.org/u/bking)\
**Post date:** [February 26, 2021, 1:45pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/10 "2021-02-26T13:45:54Z")

</div>

Thank you very much. 😘

---

<div class="post-metadata">

**Author:** ![EinsMalteHH](https://avatars.discourse-cdn.com/v4/letter/e/ecd19e/32.png) [@EinsMalteHH](https://discourse.processing.org/u/EinsMalteHH)\
**Post date:** [March 1, 2021, 2:25pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/11 "2021-03-01T14:25:01Z")

</div>

There is an easier way to find the Delta Time.

deltaTime = 1000 / frameRate

this works because frameRate is equal to cycles per Second, so you can get the time per cycle → delta time

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [March 1, 2021, 5:35pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/12 "2021-03-01T17:35:02Z")

</div>

thanks for the tip! however, as I wrote above, framerate is not guaranteed. Your suggestion can be used as a handy (but not accurate) trick and also it works perfectly when you output png files to create a gif. But if you want to work with, for example, sound in real time then you need to stick to millis; otherwise the video will eventually lag behind the sound.

---

<div class="post-metadata">

**Author:** ![EinsMalteHH](https://avatars.discourse-cdn.com/v4/letter/e/ecd19e/32.png) [@EinsMalteHH](https://discourse.processing.org/u/EinsMalteHH)\
**Post date:** [March 1, 2021, 5:51pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/13 "2021-03-01T17:51:56Z")

</div>

frameRate is the Current FrameRate, which the max can be set trough frameRate();  
frameRate changes based of the actual frameRate.

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [March 1, 2021, 6:08pm UTC](https://discourse.processing.org/t/time-elapsed-correlated-with-framecount/28004/14 "2021-03-01T18:08:01Z")

</div>

You’re right! I missed that.

However strictly speaking it is still not accurate as `frameCount` takes a moving average

> <https://github.com/processing/processing/blob/94144be998354ecf7a06d5301b7b4fab72df724c/core/src/processing/core/PApplet.java#L2462>

I am not sure if you accumulate error when you use the averaged framerate as a delta time.