Background turns black when resizing

[Katsucchi]

I have homework where i was supposed to make recreate a drawing from a famous painter. The assignment now is to make the window resizable. I came up with this solution:

void setup() {
  background(255, 255, 255);
  size(600, 600, P2D);
  surface.setResizable(true);
}

void draw() {
  stroke(0, 0, 0);
  strokeWeight(3);
  u = min(height/600.0, width/600.0);
  
  for (int i=0; i<5; i=i+1) {
    for (int j=0; j<1; j+=1) {
      x = int(random(0, 300*u));
      y = int(random(0, 300*u));
      w = int(random(2.0*u, 5.0*u));
      h = int(random(2.0*u, 5.0*u));
    }
    pushMatrix();
    translate(x, y);
    scale(w, h);
    fill(random(100, 255), 0, 0);
    rect(0, 0, 100, 100);
    popMatrix();
    
    for (int j=0; j<1; j+=1) {
      x = int(random(0, 300*u));
      y = int(random(0, 300*u));
      w = int(random(2.0*u, 5.0*u));
      h = int(random(2.0*u, 5.0*u));
    }
    pushMatrix();
    translate(x, y);
    scale(w, h);
    fill(0, 0, random(100, 255));
    rect(0, 0, 100, 100);
    popMatrix();
    
  }
  noLoop();
}

Problem, when i resize the window, the whole window turns black. Do i just not see the problem right now?

[svan]

Do you have to use P2D renderer? Try it without it.

[Katsucchi]

Kinda worked? but not really, now the part of the window i make bigger goes black.

[josephh]

Hi @Katsucchi,

@Katsucchi

but not really, now the part of the window i make bigger goes black.

This is because you only drew the background once in setup(). Since the draw() function is being executed multiple times per second, you need to draw your background at each iteration in order to clear the screen.

Outside of the initial region, it’s black by default… unless the background is drawn again

[mnse]

Hi @Katsucchi ,
You also need to remove the…

@Katsucchi

noLoop();

… otherwise it will stop to call the draw loop.

noLoop() / Reference

Cheers
— mnse

[Katsucchi]

After removing the noLoop(); it works, but i only want the first for loop to be run once, i dont want to be contantly bombarded with new shapes, only the 10 that get created in the inital “run”(idk if thats the right way to call it xd).

[svan]

Looks just fine on a Mac. What operating system are you using? Was that an exported app that you posted with the black border? Are you trying to make resizable rectangles?

[svan]

What happens if you put noLoop() as the last line in setup()? What happens on your system if you run this simple demo:

void drawRect() {
  stroke(0);
  strokeWeight(4);
  fill(255, 0, 0);
  rect(60, 60, width - 200, height - 200);
}

void setup() {
  size(600, 600);
  surface.setResizable(true);
  noLoop();  // Last line of setup()
}

void draw() {
  background(209);
  drawRect();
}

[Katsucchi]

Still shows the Black Borders like in the first screenshot
I am also using Windows 10.

[svan]

Sounds like an operating system problem. There are several Windows users in this forum and hopefully one of them can help you figure it out.

[svan]

I just tested the short demo above on an old Windows PC (8.1?) using Processing 3.5.4 and the demo ran as expected:

Original posted code without P2D also ran ok: