Animate Pattern

Answers

• yura

  June 2017 edited June 2017

      Here is my code --->
  
  
      int num = 6;
      sQuare[][] mysQuare = new sQuare[num][num];
  
      void setup() {
          size(602,602);
  
  
  
          for (int i = 0; i < mysQuare.length; i ++) {
              for (int j = 0; j < mysQuare.length; j ++) {
  
                  mysQuare[i][j] = new sQuare(100 * i, 100 * j, 100);
              }
          }
      }
  
      void draw() {
          background(#202020);
  
  
      for (int i = 0; i < mysQuare.length; i ++) {
              for (int j = 0; j < mysQuare.length; j ++)  {   
                  mysQuare[i][j].display();
                  mysQuare[i][j].rectRotate();
              }
          }
      }
  
      class sQuare {
  
          float xpos;
          float ypos;
          int boxsize;
          float theta = 0;
          float speed = 0.005;
  
          sQuare (float x, float y, int size) {
  
              xpos = x;
              ypos = y;
              boxsize = size;
          }
  
       void display() {
  
              pushMatrix();
              translate(width/2, height/2);
              for (int r = 1; r < 5; ++r) {
  
  
                  rotate(theta);
                  stroke(#FFFFFF);
                  strokeWeight(1);
                  noFill();
                  rectMode(CENTER);
                  rect(xpos + 50, ypos + 50, boxsize/4 * r, boxsize/4 * r);
  
              }
              popMatrix();
          }
  
       void rectRotate() {
  
              theta += speed;
              if (theta > 3.14 || theta < 0) {
                  speed = speed * -1;
              }
          }
      }
  
• TfGuy44

  June 2017 Answer ✓

  Close enough. Have a look at this:

  int num = 6;
  sQuare[][] mysQuare = new sQuare[num][num];
  
  void setup() {
    size(602, 602);
    for (int i = 0; i < mysQuare.length; i ++) {
      for (int j = 0; j < mysQuare.length; j ++) {
        mysQuare[i][j] = new sQuare(100 * i, 100 * j, 100);
      }
    }
  }
  
  void draw() {
    background(#202020);
    for (int i = 0; i < mysQuare.length; i ++) {
      for (int j = 0; j < mysQuare.length; j ++) {   
        mysQuare[i][j].display();
      }
    }
  }
  
  class sQuare {
  
    float xpos;
    float ypos;
    int boxsize;
    float theta = 0;
    float speed = 0.005;
  
    sQuare (float x, float y, int size) {
      xpos = x;
      ypos = y;
      boxsize = size;
    }
  
    void display() {
  
      theta += speed;
      if (theta > TWO_PI || theta < 0) {
        speed = speed * -1;
      }
  
      stroke(#FFFFFF);
      strokeWeight(1);
      noFill();
      rectMode(CENTER);
  
      pushMatrix();
      translate(xpos+50, ypos+50);
      for (int r = 1; r < 5; ++r) {
        //pushMatrix();
        rotate(theta);
        rect(0, 0, boxsize/4 * r, boxsize/4 * r);
        //popMatrix();
      }
      popMatrix();
    }
  }
  

  Try uncommenting the other push/popMatrix() pair for comparison.
• yura

  June 2017

  @TfGuy44 thank you so much!... the power of order and a right use of push/popMatrix and translate....Thanks again!!!:-))