HSB color problem and constraining a variable

edited September 2014 in Questions about Code


I'm quite new to coding (processing is my first language) and I'm learning it online. So with my basic knowledge I tried to set up a canvas which you can draw on but the below problems occured. Do you know how I could solve them?

My code is:

// I wanted to create a simple drawing surface where you can use several colors and erase your work
// You can switch between colors using the key 0 to 3.
// You can use an eraser using the key 4.
// You can use DELETE and BACKSPACE to clear the canvas.
// You can use UP and DOWN keys to change the size of your brush.
// I have no idea why the color function as a general variable gives a different color compared to when used inside the draw() function.
// I wanted to switch back to the general color using key '1'. If you know the problem let me know :)
// Another bug is that though I set a limit for the brush not to be smaller than 5 px:
// if you click DOWN a lot of times it doesnt get smaller then that but you have to click UP just as many times to start increasing it again. 

color fillColor = color(500, 600, 80);
int r = 10;

void setup(){
  size(800, 600);
  colorMode(HSB, width, height, 100);
  background(0, 0, 100);

void draw() {
    if (mousePressed == true) {
    float d = constrain(r, 5, 800);
    ellipse(mouseX, mouseY, d, d);
    switch(key) {
    case '0':
    fillColor = color(mouseX, mouseY, 80);
    case '1':
    fillColor = color(500, 600, 80);
    case '2':
    fillColor = color(300, 400, 64);
    case '3':
    fillColor = color(52, 300, 71);
    case '4':
    fillColor = color(0, 0, 100);




void keyReleased() {
 if (key==DELETE || key==BACKSPACE) background(0, 0, 100);
 if (key=='s' || key=='S') saveFrame("screenshot.png");
 if (keyCode==UP) { r = r + 10; }
 if (keyCode==DOWN) { r = r - 10; }


  • edited September 2014


  • line 11 is executed before you switch the colourMode in setup().

    you aren't constraining r. you are setting d to the constrained value of r which is a different thing. try setting r to d after line 28.

  • _vk_vk
    edited September 2014

    ops late again :)

    Hi. The default colorMode is (RGB 255,255,255,255). Until you call colorMode()at line 18 this is what color is expecting. fillColor is initialised before the change in color mode so the values are interpreted in a different way. To keep the var global, just declare it at line 11 color fillColor; and set the value after coorMode() call. fillColor = color(500, 600, 80); at line 19.

    The other thing is: d is constrained, but r is not… so r keeps going down and need to be incremented the same amount before goes bigger than 5 and starts to change d again. One way around it is:

    float d = constrain(r, 5, 800);
    r = d;

    good luck.

  • edited September 2014

    I have no idea why the color function as a general variable gives a different color

    1st, color is either the primitive datatype color or int, or a conversion function called color():

    Function color() always return an int representing an ARGB color value! @-)
    ARGB can always be used as a unit value, even though colorMode() is HSB!

Sign In or Register to comment.