How can I make a Boolean button, where I can click anywhere and an additional overlay will appear on top of my pattern?

int x= 0;
int y= 0;
int ov =60;
boolean b= true;

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

if (b){
for (x= 0; x< width; x= x+ov) {
for (y=0; y< height; y=y+ov){

fill(random(255), random(0), random(0),50);
ellipse( x,y, ov, ov);
fill( random(100, 255), random (0), random (100, 255), 90);
ellipse( x, y, ov*.5, ov );
ellipse( x, y, ov, ov*.5 );

ellipse(x+30, y+30, 10,10);
rect(x, y, 200, 1);
rect(x, y, 1, 200);

}
}
} else { //false

for (x= 0; x< width; x= x+ov) {

for (y=0; y< height; y=y+ov){

fill(random(0));
ellipse( x,y, ov, ov);
fill( random(100, 255), random (0), random (100, 255), 90);
ellipse( x, y, ov*.5, ov );
ellipse( x, y, ov, ov*.5 );

ellipse(x+30, y+30, 10,10);
rect(x, y, 200, 1);
rect(x, y, 1, 200);

}
}
}
}

Hi,

Welcome to the forum! :wink:

Make sure you correctly format your code with the </> button when editing a message on the forum. (tip: Press Ctrl+T in the Processing IDE to auto format your code)

Also please don’t put the content of your question in the title, it’s better to explain clearly your problem and add details in the body of your post.

There may be other ways of doing this, but one way is to create two images for the background: 1) BasePattern 2) BasePatternWithOverlay and then toggling them by using mousePressed.

PImage bg;
PImage bgOv;

int x= 0;
int y= 0;
int ov =60;

void setup(){
 size(500,500);
 drawBasePattern(); // creates image bg
 drawBasePatternWithOverlay(); // creates image bgOv
 bg = loadImage("base.jpg");
 bgOv = loadImage("baseWithOverlay.jpg");
}

void drawBasePattern(){
 for (x= 0; x< width; x= x+ov) {
  for (y=0; y< height; y=y+ov){
  fill(random(255), random(0), random(0),50);
  ellipse( x,y, ov, ov);
  fill( random(100, 255), random (0), random (100, 255), 90);
  ellipse( x, y, ov*.5, ov );
  ellipse( x, y, ov, ov*.5 );
  ellipse(x+30, y+30, 10,10);
  rect(x, y, 200, 1);
  rect(x, y, 1, 200);
  }
 }
 save("base.jpg");
}

void drawBasePatternWithOverlay() {
 for (x= 0; x< width; x= x+ov) {
  for (y=0; y< height; y=y+ov){
  fill(random(0));
  ellipse( x,y, ov, ov);
  fill( random(100, 255), random (0), random (100, 255), 90);
  ellipse( x, y, ov*.5, ov );
  ellipse( x, y, ov, ov*.5 );
  ellipse(x+30, y+30, 10,10);
  rect(x, y, 200, 1);
  rect(x, y, 1, 200);
  }
 }  
 for (x= 0; x< width; x= x+ov) {
  for (y=0; y< height; y=y+ov){
  fill(random(0));
  ellipse( x,y, ov, ov);
  fill( random(100, 255), random (0), random (100, 255), 90);
  ellipse( x, y, ov*.5, ov );
  ellipse( x, y, ov, ov*.5 );
  ellipse(x+30, y+30, 10,10);
  rect(x, y, 200, 1);
  rect(x, y, 1, 200);
  }
 }
 save("baseWithOverlay.jpg");
}

void draw() {
 if (mousePressed == true){
  background(bgOv);
 } else {
  background(bg);
 } 
}
1 Like