timing animation with millis()

Programming Questions

millimanie

timing animation with millis()

in Programming Questions • 2 years ago

void setup(){
size(400,400);
}
void draw(){
for(int x=1; x<10;x++){
println(x);
if((millis()00)==0){
int w=int(random(0,5));
rectMode(CENTER);
fill(255);
rect(width/2, height/2,200 ,200);
fill(0);
textAlign(CENTER);
text(w, width/2,height/2);
}
}
}

With the code above, I intended to get a rectangle, in the rectangle i wanted to show a random number between 0 and 5. I wanted a new rectangle with a random number to appear after the old number was shown for a second.
Also I wanted this to happen 9 times.
My problem is, that the loop does not end if I do not stop the sketch, althoug the counter variable x does not get bigger than 9, the loop does not stop, but starts over with the counter variable reset to 1. Perhaps that has something to do with the looping of draw.
My second problem is, that I don't know how to display every rectangle with the random number for a second, I tried it by using an if-condition, that only draws the rectangel with the number when the value of millis () is dividable by1000 with no remainder, but this does not seem to work in the way I intended it to.
If somebody could explain me why the above code does not work and make any suggestion how I could get it working, I would be very thankful.
I am a complete beginner with Processing, so I might miss something very obvious,
Thanks in advance,
Millimanie

Replies(7)

blindfish

Re: timing animation with millis()

2 years ago

Strange the forum garbled your code in your millis() condition :/

Anyway - the behaviour you're seeing is expected: a loop placed in draw will run until it's complete and will do this every frame. You need to take another approach: use a counter variable to count how many times you've changed the number being displayed; increment the counter each frame and use a condition to check when you've reached the limit. This will require you to store the number being displayed at a higher level than draw. You also need to take another approach to timing: record a 'start time' in a variable and then each frame check wether the current value of millis() has exceeded the start time plus a given threshold...

Have a go - I can post some example code later if you get stuck ;)

PhiLho

Re: Re: timing animation with millis()

2 years ago

" Strange the forum garbled your code in your millis() condition :/"
Known and reported bug. Solution: put spaces around your operators!

millimanie

Re: timing animation with millis()

2 years ago

Thanks for your answer, it helped me a lot, what I don`t quite understand about it is how I would change the number being displayed with your solution, and how to store the number being displayed.
Thanks for your help again, I would appreciate it very much if you could post some example code or could give me a further hint on how to solve this problem,
Kind regards,
Millimanie

blindfish

Re: timing animation with millis()

2 years ago

OK - assuming I properly understood what you want to do, here's the code:

PFont font;
int startTime;
int counter = 1;
int number; // this is used to store the number that gets displayed
void setup(){
size(400,400);
font = createFont("Arial", 18);
textFont(font);
startTime = millis();
number = int(random(0,5)); // set the first number to be displayed
println(counter);
}
void draw(){
// draw the number...
rectMode(CENTER);
fill(255);
rect(width/2, height/2,200 ,200);
fill(0);
textAlign(CENTER);
text(number, width/2,height/2);
// update the number each second until the limit is reached
if(counter < 9) {
// check that a second has elapsed
if(millis() > startTime + 1000) {
startTime = millis(); // reset start time
number = int(random(0,5)); // generate a new number
counter ++; // add to the counter
println(counter);
}
}
}

millimanie

Re: timing animation with millis()

2 years ago

Thank you very much, this does exactly what I am trying to do, I just have to figure out how it works,
Thanks again,
KInd regards,
Millimanie

millimanie

Re: timing animation with millis()

2 years ago

By testing the example you posted, I found out that I have one more question: the first number is displayed only for a verry short period of time, less than a second, perhaps for one frame and I wonder why this is,
Kind regards,
Millimanie

blindfish

Re: timing animation with millis()

2 years ago

It should definitely be drawn for longer than a frame... It's probably just an issue of perception. If you want to test it just print out the value of millis() after the timing condition; i.e.:

if(millis() > startTime + 1000) {
println(millis());
// etc...
}

That will tell you exactly how long it took from the beginning of the sketch running to when it updated the value. When I test it here I consistently get over 1000 milliseconds. Actually this is a useful exercise in itself as you'll notice that it's pretty rare for it to be triggered exactly on 1000 - which is why your ( millis / 1000 == 0 ) approach wasn't feasible.

Top Reply