Arranging an array of objects in a grid

Processing Coding Questions
20

Hi Deb,

Translate(50,50) Question

Sorry for being unclear.

I try to repeat:

  • you can delete translate( 50, 50);

  • Instead you have to change these line: int x = 40+50, y = x, // dist from screen border - here you say + 50 as I did. Then this new x and y gets transferred into every object in your array.

  • in the function click() the if-statements in class code. No need to add 50 now because we fixed x and y with the last bullet point above. Besides: w and h is the full size of a cell. But we use only sz for the actual rect. So we might use sz/2 here (The half bit because the rectMode (CENTER) ). I did that now.

background question

Work with the variable type color for background and use a new variable named “background” to store the current background color.
Then you can check it with ==.

See below.

Regards, Chrisir



int grid = 5, many = grid*grid; // cells per row and column, # in total

Button [] myButtons = new Button [many]; // declaring Button class array

int r1 = int(random(255));
int g1 = int(random(255));
int b1 = int(random(255));

int r2 = int(random(255));
int g2 = int(random(255));
int b2 = int(random(255));

color background = color ( r1, g1, b1) ;  //!!!!!!!!!!!!!!!!!!!!!!!!


void setup() {
  size (600, 600);

  int x = 40 + 50, y = x, // dist from screen border  !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    w = 100, h = w, off = 5; // width and height of one cell, dist btwn cells

  int k = 0; // counter for button objects in array
  for (int i = 0; i < grid; i++) { // counter for xpos on grid
    for (int i2 = 0; i2 < grid; i2++) { // counter for ypos on grid
      myButtons [k] = new Button ( x + i * (w+off), y + i2 * (h+off), 
        w, h, 
        int(random(255)), int(random(255)), int(random(255)), // random colors 
        random(50, 125)); // random sizes
      k++;
    }
  }
}
void draw() {

  background (background);  //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

  //  translate (50, 50); // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

  for (int i = 0; i < many; i++) 
    myButtons[i].display();
}


void mouseClicked() { 
  // I want to change background color when I click mouse...
  if ( background == color( r1, g1, b1) ) {  //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    background = color(r2, g2, b2);
  } else {
    background = color(r1, g1, b1);
  }
}

void mousePressed() {

  //background(r2, g2, b2);

  for (int i = 0; i < many; i++) 
    myButtons[i].click();
}

//////////////////////////////////////////

class Button {
  float x, y, w, h;
  color r;
  color g;
  color b;
  float sz;
  boolean on = false; // button starts in OFF position

  Button (float tempX, float tempY, 
    float tempW, float tempH, 
    color tempR, color tempG, color tempB, 
    float tempSz) {
    x = tempX;
    y = tempY;

    w = tempW;
    h = tempH;

    r = tempR;
    g = tempG;
    b = tempB;
    sz = tempSz;
  }

  void display() {
    if (on) {
      fill (r/2, g/2, b/2);
      noStroke();
    } else {
      fill (r, g, b);
      noStroke();
    }

    rectMode(CENTER);
    rect(x, y, sz, sz);
  }

  void click() {
    if (mouseX > x - sz/2  &&   // !!!!!!!!!!!!!!!!
      mouseX < x + sz/2  &&
      mouseY > y - sz/2  &&
      mouseY < y + sz/2  )
      on = !on; // toggle on / off
  }
}
1 Like