Hi everyone. I am very new to Processing and ControlP5, but have been learning a lot.

I am trying to create an app wherein the user can press a key on a midi keyboard and type a name into a text field so that I can bind the note value to a string in an ArrayList. I've got that part working, but am stuck on the text input using ControlP5.

I have been able to create a Textfield, and a corresponding routine, which  sets the text value of the Textarea. the problem is, it doesn't clear the text that was already there. It just turns the Textarea into gibberish by overwriting the previous text. How do I clear the old text?

Can anyone help here?

Code:

import controlP5.*;    //Also a GUI library. Which will be easier to use?

public Textarea curNoteName;
public ControlP5 controlP5;

void setup() {
  size(400,400);
  background(0);
    
  controlP5 = new ControlP5(this);
  controlP5.addToggle("learn",false,20,20,20,20).setId(1);
  controlP5.addButton("enter",100,50,20,50,20).setId(2);
  controlP5.addTextfield("note",110,20,100,20).setId(3);
  curNoteName = controlP5.addTextarea("display","Note?",220,20,100,20);
  
}

void draw() {
  controlP5.update();
}

   
void controlEvent(ControlEvent theEvent) {
  println("got a control event from controller with id "+theEvent.controller().id());
  if (theEvent.controller().id() == 3) {
   println("You Entered a note name");
  } 
}

void note(String theText) {
  curNoteName.setText("");
  curNoteName.setText(theText);
}