Colour Picker Helper

Use this sketch to be able to select a colour and see what the fill and stroke command should look like


/* Nice and simple Colour picker */

slideBar[] controls;
PFont maTypo;

void setup(){
  size(500,420);
  // creating a type using arial
  maTypo=createFont("arial",10, false);
  textFont(maTypo,10);
  // instancing of the three slidebars
  controls=new slideBar[3];
  controls[0] = new slideBar(10,10,300,16,0,255);
  controls[1] = new slideBar(10,30,300,16,0,255);
  controls[2] = new slideBar(10,50,300,16,0,255);
}

void draw(){

  background(0);
  fill(controls[0].val,controls[1].val,controls[2].val);
  rect(10,100,480,300);

  for(int a=0;a<controls.length;a++){
    controls[a].dessine();
  }

  text("Use Sliders to Select Colours", 350, 30);

  String text;

  text = str(int(controls[0].val)) + "," + str(int(controls[1].val)) + "," + str(int(controls[2].val)) ;
  text("fill(" + text + ");", 350, 60);
  text("stroke(" + text + ");", 350, 80);
}

void mouseReleased(){
  for(int a=0;a<controls.length;a++){     controls[a].lache();   } } class slideBar{   int x,y,h,l;   float mi,  ma, val,pos,tot;   boolean caught;   slideBar(int _x, int _y, int _l, int _h, float _mi, float _ma){     x=_x;      y=_y;     h=_h;     l=_l;     mi=_mi;     ma=_ma;     val=0;     tot= (ma-mi)/l;      caught=false;     pos=0;   }   void dessine(){     if(mousePressed ){       if(mouseX>x && mouseX<x+l && mouseY>y && mouseY<y+h){
        caught=true;
      }
      if(caught){
        pos=constrain(mouseX, x, x+l);
        val =  (pos-x)*tot  ;
        // tell the others to drop
        for(int a=0;a<controls.length;a++){
          if (controls[a] != this){
            controls[a].caught=false;
          }
        }
      }
    }
    fill(255);
    rect(x,y,l,h);
    line(pos,y,pos,y+h);
    int vvv = int(val);
    //fill(255-controls[0].val,255-controls[1].val,255-controls[2].val);

    fill(255);
    text(vvv, x+l+10, y+10);
  }
  void lache(){
    caught=false;
  }
}

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s