Arranging an array of objects in a grid

Processing Coding Questions
11

Thank you @kii!!
I think I mostly understand the code and why this works as a grid structure.
However, one question:

  • Why do all of the buttons appear black? In constructor color = int(random(255)) Shouldn’t each appear as a random gray?
int x=10, y=x, w=100, h=w, off=5, grid=5, many=grid*grid;    // adjust grid 

Button [] myButtons = new Button [many];

void setup() {
  size (600, 600);
  for (int i = 0; i < many; i++)
    myButtons [i] = new Button (x + (i % grid)*(w + off), y + (floor(i/grid))*(h + off), w, h, int(random(255)), random(50, 100));
}

void draw() {
  background (255);
  translate (75, 75);
  for (int i = 0; i < many; i++)  myButtons[i].display();
}

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

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

class Button {
  float x, y, w, h;
  color col;
  float sz;
  boolean on = false;   // button starts in the off position

  Button(float tempx, float tempy, float tempw, float temph, color tempCol, float tempSz) {
    x=tempx;
    y=tempy;
    w=tempw;
    h=temph;
    col = tempCol;
    sz = tempSz;
    if (x+sz>=width)  x=width-sz-1;   //checking for edges
    if (y+sz>=height) y=height-sz-1; 
  }

  void display() {
    if (on) {    // fill + stroke appearance when button is on / off
      fill (255);
      stroke(0);
    } else {
      fill (0);
      stroke (255);
    }
    rectMode (CENTER);
    
    rect (x, y, sz, sz); //sz, sz);
  }

  void click() {
//    if (mouseX > x && mouseX < x + sz && mouseY > y && mouseY < y + sz)  on = !on;
    if (mouseX > x && mouseX < x + w && mouseY > y && mouseY < y + h)  on = !on;
  }
}
1 Like