controlp5 - Textlabel background colour.

RichardDL

Hello,

I simply want text on a coloured background. I'm using the example ControlP5Textlabel, and I think I've tried every method set*color*.

myTextlabelB.setFont(Font1); myTextlabelB.setColorValue(0xff80f000); // ff required, then green numbers. myTextlabelB.setColor(0xFF0000); // all black myTextlabelB.setColor(0xFFFF0000); // red numbers myTextlabelB.setColorActive(0xFF00FF00); // ineffective myTextlabelB.setColorActive(0x00FF00); // ineffective myTextlabelB.setColorBackground(0xffffffff); // ineffective myTextlabelB.setColorBackground(0xff000000); // ineffective myTextlabelB.setColorBackground(0x00802020); // ineffective myTextlabelB.setColorForeground(0x0000ff); // ineffective myTextlabelB.setColorForeground(0xFF0000ff); // ineffective

And, in general, is there better documentation on cp5? Each example lists all the methods, but it needs a sentence or two on each method, e.g. what's the difference between setColor and setColorValue? they seem to do the same?

Thanks.

kfrajer

I tried from this example: http://www.sojamo.de/libraries/controlP5/examples/controllers/ControlP5textfield/ControlP5textfield.pde

My modified version:

  cp5.addTextfield("textValue")
    .setPosition(20, 170)
    .setSize(200, 40)
    .setFont(createFont("arial", 20))
    .setAutoClear(false)
    .setColorValue(0xffff8800)          //Orange
    .setColorActive(0xff00ff00)         //Green
    .setColorBackground(0xff880000)  //Dark Red
    ;

I was able to change the background color of the field with no problems. What OS and Processing version are you using?

For documentation.... unfortunately what you get either from his website, from this or other forum or by using self-testing. For example, setColorActive sets the color of the border of the textbox when this element is selected (it receives the focus). You can see it yourself in the above modification.

Notice that the line:myTextlabelB.setColorBackground(0x00802020); is ineffective because you are setting the alpha values to 0. You need to have them set to a non-zero value...please do your testing using 0xff first.

Kf

RichardDL

Thanks for your reply. WXP and Processing 3.3. I did try 0xFF00000 (main window was grey, did not see a black rectangle. Hmm...

Self-testing is alright if it goes right in the first few attempts. Failing that you need more doc. I know creating full doc is a pain for 1 person, but a wiki page would be good.

Thanks again.

kfrajer

Did you try my example above? 0xff880000 gives me red or 0xff888888 when using the background function.

Unfortunately I have been in situations where I also required the documentation and I understand where you are coming from...

Kf

RichardDL

@kfrajer, I ran out of energy/became distracted on this one, didn't fully pursue all I should have. Now the want of simple text items with coloured background has made me look again.

Your example works perfectly.

  .setColorValue(0xffff8800)       //Orange text
  .setColorActive(0xff00ff00)      //Green border when selected
  .setColorBackground(0xff880000)  //Dark red background

Next problem is that I put Textfield in the title but the example is from Textlabel. Was looking at both at the time. I'll see if I can edit the title.

Having said all that, I still cannot change the background of Textlabel. Kfrajer's Textfield example needs very few changes to make a Textlabel. The colour lines don't change. You might expect setColourBackground to be the same on Textlabel and Textfield but for me it does nothing.

       cp5.addTextlabel("textValue2")   // 1
      .setPosition(20, 70)              // 2
      .setSize(200, 40)
      .setFont(createFont("arial", 20))
      .setText("Some Text.")            // 3
      //.setAutoClear(false)            // 4
      .setColorValue(0xffff8800)     
      .setColorActive(0xff00ff00)    
      .setColorBackground(0xff880000)
      ;

The cp5 examples for Textlabel and Textfield each have a big list of methods and I compared them with WinMerge. Method setColorBackground is in a big list of common items, but doesn't work on Textlabel?

kfrajer

You need to see at the inheritance tree to figure out which method to call, if it is available. It could turn out to dig into the source code and do some manual tracing of method inheritance. Could you post and MCVE showing what you want to do but is not working? A running example will help this time.

Kf

RichardDL

I don't know where to find the inheritance tree. The list of methods in the examples seems to show that setColorBackground(int) should work for Textlabel (the same as it does for Textfield).

Minimum example:

/* 
- the Textfield library example
- remove TextFieldB
- add setColorBackground
*/

import controlP5.*;
ControlP5 cp5;
Textlabel myTextlabelA;

void setup() {
  size(700,400);
  cp5 = new ControlP5(this);

  myTextlabelA = cp5.addTextlabel("label")
                    .setText("A single ControlP5 textlabel, in yellow.")
                    .setPosition(100,50)
                    .setColorValue(0xffffff00)
                    .setFont(createFont("Georgia",20))
                    .setColorBackground(0xff880000);    // ??
}

void draw() {
  background(0);
}

kfrajer

Good example. So it seems this issue has not been fixed. I am sure you have seen this post:

https://processing.org/discourse/beta/num_1224499570.html

I believe this next is the line that suppose to draw the background color:

https://github.com/sojamo/controlp5/blob/master/src/controlP5/Label.java#L172

However, it seems that you can only change the color of the text but you are not able to enable the background color and setting this property. However, this code shows how you would draw the background.

Another suggestion is to refrain on using this controller and instead use the one that knows that it works. In this case, textField could do the job as if it were a textLabel by using its lock() property. An example below.

Reference: http://www.sojamo.com/libraries/controlP5/reference/controlP5/Controller.html#lock--

There is no current active issue in his repo about textLabel's color. You should create a ticket there.

Kf

import controlP5.*;
ControlP5 cp5;
Textlabel myTextlabelA;

void setup() {
  size(700, 400);
  cp5 = new ControlP5(this);

  cp5.addTextfield("textValue")
    .setPosition(20, 170)
    .setSize(200, 40)
    .setFont(createFont("arial", 20))
    .setAutoClear(false)
    .setValue("Hello world")
    .lock()
    .setColorValue(0xffff8800)          //Orange
    .setColorActive(0xff00ff00)         //Green
    .setColorBackground(0xff880000)  //Dark Red
    ;


  myTextlabelA = cp5.addTextlabel("label2")
    .setText("A single ControlP5 textlabel, in yellow.")
    .setPosition(100, 50)
    .setColorValue(0xffffff00)
    .setFont(createFont("Georgia", 20))
    .setColorBackground(0x880000);    // ??

}

void draw() {
  background(144);
}

void mousePressed() {

  println(cp5.getController("label2").getColor());
  CColor cc=new CColor(0xff880000, 0xffffff00, 0xffffffff, 0xff008888, 0x88008800);    
  cp5.getController("label2").setColor(cc);
  cp5.getController("label2").setColorBackground(0xff008888);
  println(cp5.getController("label2").getColor());


}

RichardDL

Thanks. I've created an issue on ControlP5.

GoToLoop

https://GitHub.com/sojamo/controlp5/issues/121
https://GitHub.com/sojamo/controlp5/issues/122