Hi everyone,

I'm trying to get a Colorpicker inside an Accordion and it works, I can open the Group but it won't close... I don't understand.

Moreover I don't understand why it is impossible to get the Group size to fit with the Colorpicker.

Here is the code, thanks a lot :

1. import controlP5.*;
   ControlP5 cp5;
   ColorPicker cp;
   Accordion accordion;
   
   int thickness = 10;
   
   void setup() {
     size(800, 600);
     background(255);
     fill(220);
     noStroke();
     rectMode(CORNER);
     rect(0,0,width,frame);
     rect(0,0,frame,height);
     rect(0,height-frame,width,height);
     rect(width-frame,0,width,height);
     strokeJoin(MITER);
     strokeCap(SQUARE);
     smooth();
     gui();
   }
   
   void gui() {
     cp5 = new ControlP5(this);
    
     cp5.addSlider("thickness")
        .setPosition(frame+10,frame+10)
        .setRange(0,150)
        .setColorLabel(0)
        ;
       
    Group g1 = cp5.addGroup("Color")
        .setBackgroundColor(100)
        .setBackgroundHeight(10)
        ;
       
        cp = cp5.addColorPicker("picker")
        .setColorValue(color(255, 128, 0, 255))
        .moveTo(g1)
        ;
    
    accordion = cp5.addAccordion("acc")
        .setPosition(frame+10, frame+30)
        .setWidth(255)
        .setBackgroundHeight(150)
        .addItem(g1)
        ;
      
     // use Accordion.MULTI to allow multiple group
     // to be open at a time.
     accordion.setCollapseMode(Accordion.MULTI);
   
   }
   
   float X1;
   float Y1;
   float test = 0;
   float X2;
   float Y2;
   int frame = 20;
   
   
   
   void mousePressed() {
      strokeWeight(thickness);
      stroke(cp.getColorValue());
   if ( mouseX < frame && frame < mouseY && mouseY < height-frame ) {
     if ( test != 1 ) {
       X1 = 0;
       Y1 = mouseY;
       test = 1;
       }
     else {
       X2 = 0;
       Y2 = mouseY;
       test = 0;
       line(X1, Y1, X2, Y2);
     }
   }
    
     if ( mouseX > width-frame && frame < mouseY && mouseY < height-frame ) {
       if ( test != 1 ) {
       X1 = width;
       Y1 = mouseY;
       test = 1;
       }
     else {
       X2 = width;
       Y2 = mouseY;
       test = 0;
       line(X1, Y1, X2, Y2);
     }
     }
    
     if ( mouseY < frame && frame < mouseX && mouseX < width-frame ) {
       if ( test != 1 ) {
       X1 = mouseX;
       Y1 = 0;
       test = 1;
       }
     else {
       X2 = mouseX;
       Y2 = 0;
       test = 0;
       line(X1, Y1, X2, Y2);
     }
     }
    
     if ( mouseY > height-frame && frame < mouseX && mouseX < width-frame ) {
       if ( test != 1 ) {
       X1 = mouseX;
       Y1 = height;
       test = 1;
       }
     else {
       X2 = mouseX;
       Y2 = height;
       test = 0;
       line(X1, Y1, X2, Y2);
     }
     }
   
   if ( mouseX < frame && mouseY < frame || mouseX > width-frame && mouseY < frame ||
        mouseX < frame && mouseY > height-frame || mouseX > width-frame && mouseY > height-frame ) {
       if ( test != 1 ) {
       X1 = mouseX;
       Y1 = mouseY;
       test = 1;
       }
     else {
       X2 = mouseX;
       Y2 = mouseY;
       test = 0;
       line(X1, Y1, X2, Y2);
     }
     }
      
   }
   
   void keyPressed() {
     switch(key) {
       case('1'):
       // method A to change color
       cp.setArrayValue(new float[] {120, 0, 120, 255});
       break;
       case('2'):
       // method B to change color
       cp.setColorValue(color(255, 0, 0, 255));
       break;
     }
   }
   
   void draw() {
    
   }