Change Background Color on Key Press

Processing Beginners
1

Hey, I’d like to change the background Color and it should stay the same after choosing one, but I can’t wrap my head around how that should be possible…

Can someone please help me out on this? I’ve tried to google my way through, but after 3 hours I still have no clue.

Here’s my Code:

CosDing cd1;
RandomBackground rbc1;
void setup() {
cd1 = new CosDing();
rbc1 = new RandomBackground();
size(900, 900, P3D);
strokeWeight(3);
background(0);
}
class CosDing {
void display() {
translate(width/2, height/2);
float mag = 300;
float s = 1;
for (int i = 0; i < 100; i++) {
float w = map(cos(radians(frameCount)), -1, 1, -100, 100);
float wave1 = map(cos(radians(frameCount * 0.5 + i + w)), -1, 1, -100, 100);
float wave2 = map(cos(radians(frameCount + i)), -1, 1, -mag, mag);
float wave3 = map(tan(radians(frameCount + i++)), -1, 1, -100, 100);
fill(random (0, 360), 0, 360);
stroke(#7CFF03, 70);
ellipse(wave1, wave2, wave3, s);
ellipse (wave3, wave1, s, s);
}
}
}
class RandomBackground {
void display() {
background(random(255),random(255),random(255));
}
}

And Page 2

void draw() {
if (key==‘0’ || key == ‘0’) { //Reset-Key
background (0);
}
if (keyPressed) {
if (key == ‘1’ || key == ‘1’) {
background(0);
{
rbc1.display();
}
}
}
if (key == ‘2’ || key == ‘2’) {
beginShape();
vertex(120, 80);
vertex(340, 80);
vertex(340, 300);
vertex(120, 300);
endShape(CLOSE);
}
if (key == ‘3’ || key == ‘3’) {
rotateY(map(mouseY, 0, width, 0, PI));
rotateX(map(mouseX, 0, height, 0, PI));
}
if (key == ‘4’ || key == ‘4’) {
}
if (key == ‘5’ || key == ‘5’) {
}
if (key == ‘6’ || key == ‘6’) {
}
if (key == ‘7’ || key == ‘7’) {
}
if (key == ‘8’ || key == ‘8’) {
}
if (key == ‘9’ || key == ‘9’) {
}
cd1.display(); // definiertes Objekt, welches sich per Tastendruck verändert, läuft die ganze Zeit, kann per 0 resetted werden
}

I also would like to remove the shape that is assigned to key “2”, when for example pressing “3” - it should switch into a new mode of the program without still displaying the additional shape in “2”…

I’m still very new to processing, but maybe somebody understands the issue… :frowning:

2

Hi @roaringcrex,

Please format your code. This makes use easier to help you. :slight_smile:

Cheers
— mnse

3

Hi @roaringcrex,

even if I think there are more elegant variations, I tried to take your code (stripped down a bit) and apply what you maybe want…

Cheers
— mnse

// helper classen
class CosDing {
  void display() {
    pushStyle();
    translate(width/2, height/2);
    float mag = 300;
    float s = 1;
    for (int i = 0; i < 100; i++) {
      float w = map(cos(radians(frameCount)), -1, 1, -100, 100);
      float wave1 = map(cos(radians(frameCount * 0.5 + i + w)), -1, 1, -100, 100);
      float wave2 = map(cos(radians(frameCount + i)), -1, 1, -mag, mag);
      float wave3 = map(tan(radians(frameCount + i++)), -1, 1, -100, 100);
      fill(random (0, 360), 0, 360);
      stroke(#7CFF03, 70);
      ellipse(wave1, wave2, wave3, s);
      ellipse (wave3, wave1, s, s);
    }
    popStyle();
  }
}
class RandomBackground {
  int col = color(0);
  void reset() {
    col = color(0);
  }
  void select() {
    col = color(random(255), random(255), random(255));
  }
  void display() {
    background(col);
  }
}
// main sketch
CosDing cd1;
RandomBackground rbc1;

void setup() {
  cd1 = new CosDing();
  rbc1 = new RandomBackground();
  size(900, 900, P3D);
  strokeWeight(3);
}

void keyPressed() {
  if (key=='0') { //Reset-Key
    rbc1.reset();
  } else if (key == '1') {
    rbc1.select();
  }
}

void draw() {
  rbc1.display();
  if (keyPressed) {
    if (key == '2') {
      fill(255, 0, 255);
      beginShape();
      vertex(120, 80);
      vertex(340, 80);
      vertex(340, 300);
      vertex(120, 300);
      endShape(CLOSE);
    } else if (key == '3') {
      rotateY(map(mouseY, 0, width, 0, PI));
      rotateX(map(mouseX, 0, height, 0, PI));
    }
  }
  cd1.display(); // definiertes Objekt, welches sich per Tastendruck verändert, läuft die ganze Zeit, kann per 0 resetted werden
}
4

Hello,

To change background on a keyPressed event:
https://processing.org/reference/keyPressed_.html

Hint:
background(value);

Reference:
https://processing.org/tutorials/interactivity

:)