controlP5 is messing up my fill-colors

Contributed Library Questions

mschissler

controlP5 is messing up my fill-colors

in Contributed Library Questions • 19 days ago

hi everybody,

the folowing demo code shows my problem.

i want to use controlp5 in a 3d sketch in processing 2.0.1

the problem is as soon as i instanciate the controlp5-class my fill colors get messed up.

in this example the right box should be red and not brown.

HELP :)

import controlP5.*;

ControlP5 cp5;

void setup() {

size(1024, 700, P3D);

cp5 = new ControlP5(this);

}

void draw() {

lights();

background(0,0,0);

pushMatrix();

fill(255,0,0);

noStroke();

translate(width*0.75, height*0.5, 0);

box(150);

popMatrix();

pushMatrix();

fill(0,255,0);

noStroke();

translate(width*0.25, height*0.5, 0);

box(150);

popMatrix();

}

Replies(9)

mschissler

Re: controlP5 is messing up my fill-colors

19 days ago

i tried a different approach but it delivers the same result.

import controlP5.*;

ControlP5 cp5;

Button button;

void setup() {

size(1024, 700, P3D);

cp5 = new ControlP5(this);

cp5.setAutoDraw(false);

button = cp5.addButton("test");

button.setPosition(100, 100);

}

void draw() {

lights();

background(0,0,0);

pushMatrix();

fill(255,0,0);

noStroke();

translate(width*0.75, height*0.5, 0);

box(150);

popMatrix();

pushMatrix();

fill(0,255,0);

noStroke();

translate(width*0.25, height*0.5, 0);

box(150);

popMatrix();

cp5.draw();

}

mschissler

Re: controlP5 is messing up my fill-colors

19 days ago

if i do the "cp5.draw()" before i draw the boxes i get this result.

also not working, but in a different way.

mschissler

Re: controlP5 is messing up my fill-colors

19 days ago

the version of controlP5 i am using is the newest one: 2.0.4

quarks

Re: controlP5 is messing up my fill-colors

19 days ago

In the original code above I modified the setup using pushStyle and popStyle to isolate changes made by controlP5

void setup() {
size(1024, 700, P3D);
pushStyle();
cp5 = new ControlP5(this);
popStyle();
}

and I got the green/red cube picture shown above.

I got similar results doing the same thing with mschissler's code.

andreas.s..

Re: controlP5 is messing up my fill-colors

19 days ago

Hi, the effect you are experiencing seems to be caused by processing's pushStyle/popStyle implementation. (it is used in controlP5's draw function to restore the user's style-settings). using pushStyle/popStyle unfortunately results in a different coloring/lighting setup than expected. The example below shows the same behavior you are experiencing. The default style and the restored style are obviously different, maybe you want to file this as an issue?

void setup() {
size(1024, 700, P3D);
}
void draw() {
lights();
background(0,20,0);
pushStyle();
pushMatrix();
fill(255,0,0);
noStroke();
translate(width*0.75, height*0.5, 0);
box(150);
popMatrix();
pushMatrix();
fill(0,255,0);
noStroke();
translate(width*0.25, height*0.5, 0);
box(150);
popMatrix();
popStyle();
}

Without push/popStyle

with push/popStyle

mschissler

Re: controlP5 is messing up my fill-colors

18 days ago

hi quarks and andreas,

thanks for clarifying that.

i gonna make an issue out of that.

does anyone see a quick workaround so i can go on with my project?

mschissler

Re: controlP5 is messing up my fill-colors

18 days ago

here comes the filed issue:

https://github.com/processing/processing/issues/2102

andreas.s..

Re: controlP5 is messing up my fill-colors

16 days ago

Hi, just to follow up on a workaround, there is a snapshot of an upcoming controlP5 update here which allows you to render controllers into a PGraphics element - this allows to work around the push/popStyle issue. you can use the following code with controlP5 2.1.3.

import controlP5.*;
ControlP5 c1, c2;
PGraphics panel1;
float s1, s2;
boolean vs1, vs2;
void setup() {
size(1024, 700, P3D);
panel1 = createGraphics( 220, 200 );
c1 = new ControlP5( this );
c1.enableShortcuts();
c1.setBackground( color( 0, 150 ) ); // use color( 0 , 1 ) to make background invisible
c1.addTab("visibility");
c1.addButton("hello").setSize(200, 20).setPosition( 10, 30 );
c1.addSlider("s1").setRange(100,300).setValue(150).setSize(100, 20).setPosition( 10, 60 );
c1.addSlider("s2").setRange(100,300).setValue(150).setSize(100, 20).setPosition( 10, 90 );
c1.addToggle("vs1").setValue(true).setSize(90, 50).setPosition( 10, 80 ).moveTo("visibility");
c1.addToggle("vs2").setValue(true).setSize(90, 50).setPosition( 110, 80 ).moveTo("visibility");
c1.setGraphics( panel1, 20, 20 );
}
void hello(int n) {
println("I am just saying hello.");
}
void draw() {
hint(ENABLE_DEPTH_TEST);
lights();
background( 40 );
pushMatrix();
fill(255, 0, 0);
noStroke();
translate(width*0.75, height*0.5, 0);
rotateY(-frameCount*0.01);
if(vs2) {
box(s2);
}
popMatrix();
pushMatrix();
fill(0, 255, 0);
noStroke();
translate(width*0.25, height*0.5, 0);
rotateY(frameCount*0.01);
if(vs1) {
box(s1);
}
popMatrix();
/* disable lighting and depth test so that the controllers can be
* draw properly on top of the 3D scene.
*/
noLights();
hint(DISABLE_DEPTH_TEST);
}

(another workaround would be to render your boxes into a PGraphics3D buffer and display the buffer using image() ).

andreas schlegel, http://www.sojamo.de

mschissler

Re: controlP5 is messing up my fill-colors

16 days ago

@andreas
many thanks for the workaround and for that beautiful librabry.

Top Reply