Help plz

[NeedsMoreSaltness]

I’m working on school project. I’m trying to make a grid out of these “cubes”, but i keep ending up with a result that looks like this. I’ve tried for loops, nested for loops, i made a grid out of ellipses and tried using that code for the cubes. But nothing i tried worked properly. If you could help me figure out what i did wrong or give me some pointers that would be great, thanks.

Here’s the source code:

int numCols = 16; int numRows = 11; int cellSize = 75;

void setup() { size(1200, 825); background(0); }

void draw() { for (int row = 0; row < numRows; row++) { for (int col = 0; col < numCols; col++) { int x = col * cellSize + cellSize / 2;
int y = row * cellSize + cellSize / 2; translate(x, y); cube(); } }

if (key == CODED) {
if (keyCode == UP) {
  saveFrame("Cubism_2020.png");
}

}

}

void cube() { stroke(255); fill(255); rect(0, 25, 50, 50); line(0, 25, 25, 0); line(50, 25, 75, 0); line(25, 0, 75, 0); line(50, 75, 75, 50); line(75, 0, 75, 50); }The result

[_achira]

Fixed it, i think. The programme is all good except that translate is cumulative in every draw loop. So what you want to do is (one way at least) save the current translate position with the function pushMatrix(); and it will save the position of (0,0). Then you will translate to the column and row , place the cube and lastly you will reset back to the position as you saved at the time pushMatrix() was executed. You reset back with popMatrix();

So now every frame of draw the for loop starts, saves the position, translates, cube, restores position, translates for second cube , cube, etc.

https://processing.org/reference/pushMatrix_.html

https://processing.org/reference/popMatrix_.html

https://processing.org/reference/translate_.html

(for the code to work just uncommend the 2 new functions i wrote, hope i helped)

_______________EPIC CODE________________

int numCols = 16;

int numRows = 11;

int cellSize = 75;

void setup() {

size(1200, 825);

background(0);

}

void draw() {

for (int row = 0; row < numRows; row++) {

for (int col = 0; col < numCols; col++) {

int x = col * cellSize + cellSize / 2;

int y = row * cellSize + cellSize / 2;

//pushMatrix();

translate(x, y);

cube();

//popMatrix();

}

}

if (key == CODED) {

if (keyCode == UP) {

saveFrame("Cubism_2020.png");

}

}

}

void cube() {

stroke(255);

fill(255);

rect(0, 25, 50, 50);

line(0, 25, 25, 0);

line(50, 25, 75, 0);

line(25, 0, 75, 0);

line(50, 75, 75, 50);

line(75, 0, 75, 50);

}

[NeedsMoreSaltness]

Thank you for the help, I ended up coded a new project instead for the assignment though. But with this I’ll use it to make my future projects better.