Help creating simple animation

I guess I’ll try millis().

This is just one of many reasons I hated being a programmer! Hardware is so much more logical.

1 Like

Not true…

Did you look at the examples on the website and within the processing ide?

It makes sense once you are used to it… :wink:

Warm regards, Chrisir

Thank you!

I need to go find out what “%” does. Oh, boy! Homework…

I spent hours trying many variations of the resources I could find & understand. I believe millis() was in there as well but obviously misapplied!

The % means modulo - Should be in the reference

It’s the remainder of a division.

Eg 7 % 3 = 1

because 3*2=6, rest 1

It’s often used as an abbreviation

I’m going to have to think about what you said as it’s not obvious to me. Thanks for the new direction.

millis() should be in the reference

It’s the time that passed since the start of the sketch (not the current time) measured in milli seconds

It is very useful to make measurements like how much time has passed since the start of the sketch or to make a timer or like in this case switch between two states

I understand the millis() function but am not familiar with the structure used (…%6000 < 3000).

Like I said I need to cogitate on this to understand where the 6000 came from & the relation to 60 FPS.

1 Like


millis() gets bigger all the time. Endlessly.

millis() % 6000 loops between 0 and 5999:

Once it reaches 5999, it jumps back to 0 and starts all over again (because it’s the remainder)

When we check this remaining value against > 3000 the result oscillates between true and false


1 Like

here is another way of achieving this using an explicit timer and a boolean variable isSmallRect that is set by the timer.

isSmallRect gets then evaluated to decide which rectangle to draw

int timer; 
boolean isSmallRect = true; 

void setup() {
  size(640, 360);
  // start timer
  timer = millis();

void draw() {
  background(0); // create black background
  fill(102); //set color to gray

  // timer to control isSmallRect 
  if ( millis() - timer > 3000 ) {
    // start timer  
    timer = millis(); 
    // toggle isSmallRect 
    isSmallRect = 
      ! isSmallRect; // the ! means not, so inverses the value of isSmallRect

  // evaluate isSmallRect
  if (isSmallRect) {
    rect(81, 81, 63, 63); // draw a small rectangle
  } else {
    rect(81, 81, 150, 150); // draw slightly larger rectangle
1 Like

The 6000 are milliseconds and half of it are 3000 milliseconds, so 3 seconds, so we switch every 3 seconds between the small and big rect.

Actually, it doesn’t have to do with the 60 FPS.

Since we use the millis() it would work with 30, 40, 60 or 100 FPS.

In fact you can try this by setting the frame rate to 33 or so: command frameRate(33);

Chrisir - thanks for all this info. I need to go back & rethink & redesign my code around all this new stuff.

1 Like

When I was starting out processing, I wanted to make a timer without all of the millis() stuff(which I still don’t understand well enough to use) and I came up with an interesting example of a design. No idea if this would work implemented in a game or not.

float s=0;
float w=0.0152;

void draw() {
1 Like

Thanks for sharing this approach. Note that Processing already has a global frame count, frameCount. If you want to increase by n each frame, then you don’t need to store it in a global variable s if you don’t want to – the value is always equal to n*frameCount. So this is equivalent:

void draw() {

  text(frameCount * 0.152, 200, 100);

Over a long time, this also avoids drift from accumulating floating point errors.

1 Like

Yes, I understand that frameCount can be used more accurately, but, as far as I’m aware, you cannot change the value of frameCount at will. I made my timer with the intent of using it at different times, starting at possibly different values, such as a timer starting at the beginning of a level and it being reset per the next one.

Great! Under those circumstances, yes, it certainly does make sense to store the start time as a global variable.

You may still want to consider using that start time in a multiplication-based rather than additive calculation – if you aren’t changing rates during a single run and care about precision, of course. For variable rates, additive is the way to go – or fixing the past value every time the rate changes.

This is incorrect. Try it.

Thanks for letting me know, it’s very helpful.

Although you could change frameCount at will, it‘s still advised to refrain from doing so. You never know what those internal values might be used for behind the scenes :sweat_smile:

Using global variables may be better, as then you can make a Timer class, and I don’t believe each class has an individual frameCount(multiple timers running at the same time, but not all starting at the same time)

class Timer {
    float w;
    float TimerSize;
    float TimerMaxValue;
    color TimerColor;
    float Timerx,Timery;
    Timer(tempTimerSize,tempTimerColor,tempTimerx,tempTimery,tempTimerMaxValue) {
    void display() {
    void update() {
    if(tempTimerMaxValue!=null) {
        if(w>=TimerMaxValue) {    //greater than or equal to because may be 0.01 over/below max value