Making things happen sequentially within an array

Processing Coding Questions
1

Hi there,

I’m trying to display all the objects in an array, not all at once, but one after the other.

Basically, what my code does is to load sequences of SVGs and then display them as one fluent animation. What I want is for the sequences to only appear and start animating when the last one is done. As it is currently, they (all the objects in the array) all appear simultaneously.

Here’s my code so far:

Tegn[] tegnArray;
int numTegn = 6;

void setup() {
  size(560, 500);
  frameRate(60);
  smooth(4);

  tegnArray = new Tegn[numTegn];
  for (int i = 0; i < tegnArray.length; i++) {
    tegnArray[i] = new Tegn(int(random(1, 4)));
  }
}

void draw() { 
  background(200);

  for (int i = 0; i < tegnArray.length; i++) {
    tegnArray[i].display();
  }
}


class Tegn { 

  int numFrames = 240;
  int currentFrame = 0;
  PShape[] seq = new PShape[numFrames];
  int tegnNo;

  Tegn(int tegnNoTemp) {

    tegnNo = tegnNoTemp;

    for (int i = 0; i < seq.length; i++) {
      String tegnFile = "svgs/tegn"+nf(tegnNo, 1)+"/svg" + nf(i, 1) + ".svg";
      seq[i] = loadShape(tegnFile);
      seq[i].disableStyle();
    }
  }

  void display() {

    noFill();
    strokeWeight(40);

    for (int i = 0; i < numFrames; i += seq[0].width) {
      shape(seq[(currentFrame) % numFrames], 0, 0);
      currentFrame ++;
    }
  }
}

Really appreciate your help. Thank you!

2

replace this in the for loop for (int i = 0; i < tegnArray.length; i++) { by a new variable upperBorder

increase upperBorder every time draw() runs (or every 2nd time draw runs)