How to coloring controlP5 item with different color?

Processing Libraries
1 
import controlP5.*;
ControlP5 cp5;

CheckBox Checkcomponent;
Textlabel labelInfo;

void setup() {
  size(640, 480);

  cp5 = new ControlP5(this);
  Checkcomponent = cp5.addCheckBox("checkBox")
    .setPosition(105, 60)
    .setSize(20, 20)
    .setItemsPerRow(1)
    .setSpacingRow(20)
    .setColorBackground(color(0,255,0))
    .addItem("Large letter", 0)
    .setColorLabel(color(255,255,0))
    .addItem("Green letter", 1);

  labelInfo = cp5.addLabel("LabelOption")
    .setPosition(100, 200)
    .setFont(createFont("Batang", 20))
    .setText("Look at me");
}
void draw() {
  background(150, 150, 150);
}
public void controlEvent(ControlEvent theEvent) {
  String nameComponent = theEvent.getName();
    if (nameComponent== "checkBox")    
  { 
    float checkResults[] = Checkcomponent.getArrayValue();
    if (checkResults[0] == 1)
      labelInfo.setFont(createFont("Batang", 40));
    else
      labelInfo.setFont(createFont("Batang", 20));
    if (checkResults[1] == 1)
      labelInfo.setColor(color(0,255,0));
    else
      labelInfo.setColor(color(255, 255, 255));
  }
}

how to coloring “Large letter” and “Green letter” with different color ?

1 Like
2

Hello,

Create 2 buttons:

import controlP5.*;
ControlP5 b1, b2;

CheckBox Checkcomponent;
Textlabel labelInfo;

void setup() 
  {
  size(500, 200);

  b1 = new ControlP5(this);
  Checkcomponent = b1.addCheckBox("checkBox")
  // b1 properties go here
    
  b2 = new ControlP5(this);
  Checkcomponent = b2.addCheckBox("checkBox")
  //b2 properties go here
  }

And each button can have its own properties.

References:
http://www.sojamo.de/libraries/controlP5/

I do not use CP5 and this was an intuitive approach to answering this with the code you provided.

Lots of cool stuff in the references to peruse and glean through.

image

:)

3 Likes
3

but your code must make new component,
how to color items in different colors in 1 component ?

4

i got it

import controlP5.*;
ControlP5 cp5;

CheckBox Checkcomponent;
Textlabel labelInfo;

void setup() {
  size(640, 480);

  cp5 = new ControlP5(this);
  Checkcomponent = cp5.addCheckBox("checkBox")
    .setPosition(105, 60)
    .setSize(20, 20)
    .setItemsPerRow(1)
    .setSpacingRow(20)
    .setColorBackground(color(0, 255, 0))
    .addItem("Large letter", 0)
    .addItem("Green letter", 1);

  labelInfo = cp5.addLabel("LabelOption")
    .setPosition(100, 200)
    .setFont(createFont("Batang", 20))
    .setText("Look at me");
  Checkcomponent.getItem(0).setColorLabel(color(255, 255, 0)).setFont(createFont("Batang", 20));
  Checkcomponent.getItem(1).setColorLabel(color(0, 255, 255)).setFont(createFont("Verdana", 20));
}
void draw() {
  background(150, 150, 150);
}
public void controlEvent(ControlEvent theEvent) {
  String nameComponent = theEvent.getName();
  if (nameComponent== "checkBox")    
  { 
    float checkResults[] = Checkcomponent.getArrayValue();
    if (checkResults[0] == 1)
      labelInfo.setFont(createFont("Batang", 40));
    else
      labelInfo.setFont(createFont("Batang", 20));
    if (checkResults[1] == 1)
      labelInfo.setColor(color(0, 255, 0));
    else
      labelInfo.setColor(color(255, 255, 255));
  }
}
2 Likes
5

Hello,

You really should set your answer as the solution.

Good work!

:)