This what I’ve got now. The entire grid increments as a whole. The clue: [x+1][y], I can’t figure out how (where) to add the +1 / -1 to cell index so as to move individual cells.
I think(?) something sh’d be added to the void keyReleased() code block, but am not sure what.
// 2D Grid Array of Button objects
Button [][] myButtons;
// Number of columns and rows in the grid
int num = 10;
int cols = num, rows = cols;
color background = color (random(255), random(255), random(255));
void setup() {
size(500, 500);
int x = (width/num)/2, y = x;
myButtons = new Button[cols][rows];
for (int i = 0; i < cols; i++) {
for (int j = 0; j < rows; j++) {
// Initialize each object
myButtons[i][j] = new Button (x+ i*(width/cols), y+ j*(height/rows),
color (random(255), random(255), random(255)), // random colors
color (random(255), random(255), random(255)), // new random colors when mouseOver
(width/num));
}
}
}
void draw() {
background(background);
for (int i = 0; i < cols; i++) {
for (int j = 0; j < rows; j++) {
myButtons[i][j].mouseOver();
myButtons[i][j].display();
}
}
}
void keyReleased() {
for (int i = 0; i < cols; i++) {
for (int j = 0; j < rows; j++) {
myButtons[i][j].keyPressed();
}
}
}
//////////////////////////////
class Button {
float x, y;
color colRect;
color colRect2;
float sz;
boolean off = true; // button starts in OFF position
Button (
float tempX, float tempY,
color tempColor, color tempColor2, float tempSz) {
x = tempX;
y = tempY;
colRect = tempColor;
colRect2 = tempColor2;
sz = tempSz;
}
void display() {
if (off) {
fill (colRect);
noStroke();
} else {
fill (colRect2);
noStroke();
}
rectMode(CENTER);
rect(x, y, sz, sz);
}
void mouseOver() {
if (mouseX > x - sz/2 &&
mouseX < x + sz/2 &&
mouseY > y - sz/2 &&
mouseY < y + sz/2) {
off = false;
} else {
off = true;
}
}
void keyPressed() {
if (key == CODED) {
if (keyCode== UP) {
y = y+1;
} else if (keyCode== DOWN) {
y = y-1;
} else if (keyCode== LEFT) {
x = x-1;
} else if (keyCode== RIGHT) {
x = x+1;
}
}
}
}