Implementation of the Erase Button

user_15934938 0
Viewed 106

I have created the "Erase" button. The erase button when it's clicked should delete the drawing which is drawn by the mouse. It should work similarly to the paint program. I have used the following code and it does nothing to the functionality of the Erase button. So, if I draw something when toggle is turned on and if I click "Erase" button nothing is happening. Could someone please help me with this issue.

import controlP5.*;

ControlP5 cp5;


boolean onOff = false;

boolean erase = false;

void setup(){
  size(1000, 1000);
  background(255);
  PFont font = createFont("Calibri", 15);
  
  
  cp5 = new ControlP5(this);
  
   cp5.addToggle("onOff").
  setPosition(150, 20).
  setSize(40, 15).
  setFont(font).
  
  setMode(ControlP5.SWITCH);
  
   cp5.addButton("Erase").
  setPosition(890, 20).
  setSize(100, 30).
  setFont(font);
  
}
  
  void draw(){
    
    
  fill(246, 246, 246);
  stroke(246, 246, 246);
  rect(0,0, 1000, 80);
  
  stroke(0);
 if (mousePressed == true && onOff == true) {
 line(mouseX, mouseY, pmouseX, pmouseY);
 }
 
}

 void keyPressed(){ 
   if(erase == true) {
     
     background(255);
   }
 }
keypress processing erase java
2 Answers

ControlP5 has a cool feature where it automatically maps variable names to UI elements. For ControlP5 to find the correspondence the name of the UI element needs to match the variable or function.

In your case simply change

cp5.addButton("Erase")

to

cp5.addButton("erase")

to match boolean erase = false;

Here's you're code with one letter changed and automatic formatting (Ctrl+T / CMD + T):

import controlP5.*;

ControlP5 cp5;


boolean onOff = false;

boolean erase = false;

void setup() {
  size(1000, 1000);
  background(255);
  PFont font = createFont("Calibri", 15);


  cp5 = new ControlP5(this);

  cp5.addToggle("onOff").
    setPosition(150, 20).
    setSize(40, 15).
    setFont(font).

    setMode(ControlP5.SWITCH);

  cp5.addButton("erase").
    setPosition(890, 20).
    setSize(100, 30).
    setFont(font);
}

void draw() {


  fill(246, 246, 246);
  stroke(246, 246, 246);
  rect(0, 0, 1000, 80);

  stroke(0);
  if (mousePressed == true && onOff == true) {
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

void keyPressed() { 
  if (erase == true) {
    background(255);
  }
}

Alternatively, you can skip the boolean altogether and simply call background in a function called by the erase button. If the function has the same name as the button it gets automatically when you click that button:

import controlP5.*;

ControlP5 cp5;


boolean onOff = false;

void setup() {
  size(1000, 1000);
  background(255);
  PFont font = createFont("Calibri", 15);


  cp5 = new ControlP5(this);

  cp5.addToggle("onOff").
    setPosition(150, 20).
    setSize(40, 15).
    setFont(font).

    setMode(ControlP5.SWITCH);

  cp5.addButton("erase").
    setPosition(890, 20).
    setSize(100, 30).
    setFont(font);
}

void draw() {


  fill(246, 246, 246);
  stroke(246, 246, 246);
  rect(0, 0, 1000, 80);

  stroke(0);
  if (mousePressed && onOff) {
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

void erase() { 
  background(255);
}
user_897660

I used the Button class and Toggle class, so that I could use the Button::isPressed function to check if the erase button is pressed. And then since you wanted it to erase when you clicked the button, you should use the mousePressed instead of keyPressed function.

import controlP5.*;

ControlP5 cp5;

Button erase;
Toggle onOff;

void setup(){
  size(1000, 1000);
  background(255);
  
  PFont font = createFont("Calibri", 15);
  cp5 = new ControlP5(this);

  onOff = new Toggle(cp5, "onOff").
  setPosition(150, 20).
  setSize(40, 15).
  setFont(font).
  
  setMode(ControlP5.SWITCH);
  
  erase = new Button(cp5, "Erase").
  setPosition(890, 20).
  setSize(100, 30).
  setFont(font);
}
  
void draw(){
  fill(246, 246, 246);
  stroke(246, 246, 246);
  rect(0,0, 1000, 80);
  
  stroke(0);
  
  if(mousePressed && onOff.getBooleanValue()) {
     line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

void mousePressed(){
  if(erase.isPressed()){
     background(255);
  }
}
user_155521520
Related