Beispiel Konfettipinsel mit Radierer

Programm im Editor öffnen

Quellcode ohne Kommentar

hintergrundfarbe = 240;
modus = "malen"

function setup() {
  createCanvas(300, 300);
  background(hintergrundfarbe);
  noStroke();
}

function draw() {
  
  if (mouseIsPressed && modus == "malen") {
    rot = random(255);
    gruen = random(255);
    blau = random(255);

    fill(rot, gruen, blau);
    ellipse(mouseX, mouseY, 10);
  }
  
  if(mouseIsPressed && modus == "radieren") {
    fill(hintergrundfarbe);
    ellipse(mouseX, mouseY, 25);
  }
  
}

function keyPressed() {
  if (key == "x") {
    background(hintergrundfarbe);
    modus = "malen";
  }
  if (key == "m") {
    modus = "malen";
  }
  if (key == "r") {
    modus = "radieren";
  }
 
}

Quellcode mit Kommentar

// Damit der Radierer die selbe Farbe hat wie der Hintergrund,
// speichern wir den Wert in einer Variable:
hintergrundfarbe = 240;
// Der Modus bestimmt, ob gemalt oder radiert wird:
modus = "malen"

function setup() {
  createCanvas(300, 300);
  background(hintergrundfarbe);
  // Keine Umrandung der Ellipsen:
  noStroke();
}

function draw() {
  
  // Wenn die Maustaste gedrückt ist und der Modus "malen" ist, passiert das übliche:
  if (mouseIsPressed && modus == "malen") {
    rot = random(255);
    gruen = random(255);
    blau = random(255);

    fill(rot, gruen, blau);
    ellipse(mouseX, mouseY, 10);
  }
  
  // Wenn der Modus aber radieren ist...
  if(mouseIsPressed && modus == "radieren") {
    // ...wählen wir als Hintergrundfarbe die Füllfarbe...
    fill(hintergrundfarbe);
    // ... und malen mit etwas höherem Durchmesser:
    ellipse(mouseX, mouseY, 25);
  }
  
}

// Wenn eine Taste gedrückt wurde...
function keyPressed() {
  // Wenn die zuletzt gedrückte Taste "x" war...
  if (key == "x") {
    // ...Bild löschen...
    background(hintergrundfarbe);
    // ... und wieder in den Modus "malen" gehen:
    modus = "malen";
  }
  // Wenn die zuletzt gedrückte Taste "m" war...
  if (key == "m") {
    // ...in den Modus "malen" gehen.
    modus = "malen";
  }
// Wenn die zuletzt gedrückte Taste "r" war...
  if (key == "r") {
    // ...in den Modus "radieren" gehen.
    modus = "radieren";
  }
 
}