How to change the colours for the buttons for controlP5 library?

Processing Libraries
1

image
image804×840 3.22 KB

I am using the controlP5 library and I have these two buttons. I want to have different colours for different buttons. I tried using fill() to change the colour but that doesn’t seem to work.

Here is the code.

import controlP5.*;

ControlP5 cp5;

void setup()
{
  size(800, 800);
  cp5 = new ControlP5(this);
  
  fill(255,0,0);
  cp5.addButton("1").setValue(0).setPosition(0, height/2).setSize(400,200);
  cp5.addButton("2").setValue(0).setPosition(width/2, height/2).setSize(400,200);
  
  
}

void draw()
{
  background(0);
}

Any ideas?

2 
  ...
  cp5.addButton("2")
    .setValue(0)
    .setPosition(width/2, height/2)
    .setSize(400,200)
    .setColorBackground(color(255, 255, 0))
    .setColorForeground(color(255, 0, 0))
    .setColorActive(color(0, 255, 255));
2 Likes
3

Thanks :slight_smile:

ANother question.

public void two()
{
  colour = #ffffff;
}

this code keeps executing the first time I run it and I don’t want it to execute at all unless if I press the button. How would I fix this if you happen to know?

1 Like
4

Maybe try structuring it something like this:

  ...
  Button b2 = cp5.addButton("2")
    .setValue(0)
    .setPosition(width/2, height/2)
    .setSize(400,200)
    .setColorForeground(color(255, 0, 0))
    .setColorBackground(color(255, 255, 0))
    .setColorValue(color(0))
    .setColorActive(color(0, 255, 255));
   
  b2.onRelease(new CallbackListener() {
    public void controlEvent(CallbackEvent theEvent) {
      println("clicked");
    }
  });
2 Likes
5

Thanks.

import controlP5.*;

ControlP5 cp5;

int colour = #ce2fa9;

boolean is_pressed = false;

void setup()
{
  size(800, 800);
  cp5 = new ControlP5(this);
  
  fill(255,0,0);
  //
  
  cp5.addButton("one").setValue(0).setPosition(0, height/2).setSize(400,200);
  Button b2 = cp5.addButton("two").setValue(0).setPosition(width/2, height/2).setSize(400,200).setColorCaptionLabel(#000000).setColorBackground(colour).setColorForeground(#ff16c8).setColorActive(#ffffff);

  b2.onRelease(new CallbackListener()
  {
    public void controlEvent(CallbackEvent theEvent)
    {
      println("clicked");
      colour = #ffffff;
    }
  }
  );
  
}

void draw()
{
  background(0);
}

But the issue is that the button doesn’t turn white when I pressed it.

6

You’ll need to refer to the controller you’d like to make white:

  b2.onRelease(new CallbackListener() {
    public void controlEvent(CallbackEvent theEvent) {
      cp5.getController("2").setColorForeground(color(255, 255, 255));
      cp5.getController("2").setColorBackground(color(255, 255, 255));
    }
  });

However, it sounds like what you want is a toggle of some sort? So cp5.addToggle() instead of cp5.addButton()

2 Likes