Printing delay of 500 millisecs between indices of a for loop iteration

p5.js Beginners
1

Hi p5 pals!

I am having trouble trying to print out text with a delay between each iteration of the for loop.
Instead of printing all at once in realtime, I would like a 1/2 sec delay between each of the indices.

I have tried using setInterval() for this but It repeats the for loop as well as the function that is being called inside setInterval() parameter.

Any other ways ya recommend at approaching this?

btw the p. before p5 library functions is because i am using react to embed p5 within my project.

let queue = [ ] // this queue has strings of data from an api. I want to print each index.

function printHeadlines() {
      p.fill(255);
      p.textSize(30);
      p.text('title', x, y );

      for (let i = 0; i < 10; i++) {
        p.textSize(14);
        x = x + 30;
        setInterval(function(){
        line = p.text([i+ 1] + ". " + queue[i], x, y);
        },500)
      }
    }
2

a processing example:

int retriger=0, timer = 500;
void setup() {}
void draw() {
  if(millis() > retriger) {
    retriger = millis()+timer;
    println(millis());
  }
}
3

Anyway you can explain how this will look within a for loop?

4

I forgot the for loop thing. You can use thread function to do that. It is just not too efficient.

I haven’t tested it yet but : P

I will post the code in a minute

5

here it is

int delay = 500, rep = -1;
void setup() {thread("timer");}
void draw() {background(frameCount % 255);}

void timer() {
  for(int i = 0; i < rep || rep == -1; i++) {
    println(i,millis());
    delay(delay);
  }
}

int delay sets the interval between reactivations
int rep tells how many times it is repeated (if you set it to 3, it will print: 0, 0, \n 1,500 \n 2,1000), if set to -1, it will repeat infinetely

1 Like
6

Thanks for your time & input :slight_smile:
Going to study these pieces of code, and play around with it.
Bless CodeMasterX !

7

Hey @decentralizedmike
I’ve tried something similar. Do you want something like this?

1 Like
8

YES YES YES! Exactly

9

Check out the code
https://editor.p5js.org/Sierra_Alpha_Romeo.P/sketches/FNZR5wII3
You need not require the for loop if you are using the setInterval function

1 Like
10

Thank You Sierra!
Yes that makes sense, I was definitely over complicating things.

1 Like