Creating a background which fades trough all color values

Bostro

Hello everyone, I am a beginner in processing and need some help :/ I am looking for a code that allows me to create a background which fades trough all color values. I've already searched on google without any result, just some fades from black to white. After some experimets I wasnt able to create that kind of background with an smooth fade between different colors. If anyone can come up with an easy, begginer friendly solution I would really apreciate it.

koogs

an animated fade? or just a graduation from one side of the screen to the other?

https://processing.org/reference/colorMode_.html

Bostro

It should look like this, but changing trough all color values instead of white to black:

color fillcolour=255;
float colourincrement=1;

void setup()
{
  size(400, 400);
  frameRate(30);
  smooth();
  noStroke();
  background(0);
}

void draw()
{
  if (fillcolour>0) fillcolour-=colourincrement;
  background(fillcolour);
} 

koogs

look at HSB colormode. use frameCount % (number of colors) as first argument to color().

Bostro

Thanks koogs, but I didnt get it ^^ Im really new to processing and tried it out, without a result :(

koogs

well, i could write it for you but then you'd learn nothing.

try setting colorMode(HSB, 360, 100, 100); in your setup, no other changes, see what it does...

Bostro

it still look's the same :-S

koogs

that's because you're calling color() with only one parameter. try

background(fillcolour, 50, 50);

(which is another option on the background() page -

background(v1, v2, v3)
v1 float: red or hue value (depending on the current color mode)
v2 float: green or saturation value (depending on the current color mode)
v3 float: blue or brightness value (depending on the current color mode)

)

Bostro

Should it look like this now?

` color fillcolour=255; float colourincrement=1;

void setup() { size(400, 400); colorMode(HSB, 360, 100, 100); background(fillcolour, 255, 50); frameRate(30); smooth(); noStroke(); }

void draw() { if (fillcolour>0) fillcolour-=colourincrement; background(fillcolour); } `

koogs

well, it should be better indented for a start - highlight code, press ctrl-o.

i meant the background call in draw. the one in setup is called once. the one in draw is called every frame. if you want to see changes then it's the one in draw you have to change. (the one in setup is actually unnecessary)

koogs

(as are the calls to smooth and noStroke)

Bostro

now i get it :D Thats exactly what ive tried to do :3 Thank you so much! Do you know how to do it backwards? I mean, to create an endless loop?

color fillcolour=255; float colourincrement=1; void setup() { size(400, 400); colorMode(HSB, 360, 100, 100); background(fillcolour, 255, 50); frameRate(20); } void draw() { if (fillcolour>0) fillcolour-=colourincrement; background(fillcolour, 255, 255); }

TfGuy44

int x = 255;

void setup() { 
  size(400, 400); 
  colorMode(HSB, 360, 100, 100); 
}

void draw(){
  x--;
  if(x==0)x=360;
  background(x, 255, 255);
}

Bostro

Thank you guys! This is so awesome :D Thanks alot!

TfGuy44

I wrote it for you. Hopefully you still learned something.

Bostro

Sure! Ive learned alot and started my first project since yesterday :) But now other problems appear and hopefully i will solve them to go on