A › 2 - En couleur

Niveaux de gris

La fonction background(gris) permet de définir le niveau de gris de la "couleur" de fond de la fenêtre.

background(50); // fond gris foncé

rect(10,10,80,20);

La fonction fill(gris) permet de définir le niveau de gris de la "couleur" de remplissage des formes.

rect(10,10,35,35); // rectangle du haut

fill(150); // gris soutenu

rect(50,50,35,35); // rectangle du bas

Le niveau de gris est un entier entre 0 (noir) et 255 (blanc). Par défaut, la couleur de remplissage est le blanc, ce qui équivaut à fill(255);

fill(220); // gris clair

rect(10,10,80,20); // rectangle du haut

fill(150); // gris soutenu

rect(10,40,80,20); // rectangle du centre

fill(80); // gris foncé

rect(10,70,80,20); // rectangle du bas

La fonction stroke(gris) permet de définir le niveau de gris de la "couleur" de tracé des figures. Par défaut, les tracés sont en gris foncé, ce qui équivaut à stroke(102);.

strokeWeignt(3); // épaisseur du tracé

stroke(220); // gris clair

rect(10,10,80,20); // rectangle du haut

stroke(150); // gris soutenu

rect(10,40,80,20); // rectangle du centre

stroke(80); // gris foncé

rect(10,70,80,20); // rectangle du bas

Couleurs

En mode RVB, une couleur est définie par 3 entiers qui déterminent respectivement les niveaux de rouge, de vert et de bleu. Chacun des entiers est compris entre 0 et 255, ce qui permet de créer 256 x 256 x 256 = 16 777 216 couleurs.

Les fonctions background(r,v,b), fill(r,v,b) et stroke(r,v,b) permettent de définir respectivement la couleur de fond, la couleur de remplissage des formes et la couleur de tracé.

background(20,120,200); // fond bleu

stroke(255); // tracé blanc, équivalent à stroke(255,255,255);

fill(150,220,60); // remplissage vert

rect(10,10,80,20);

fill(220,30,30); // remplissage rouge

rect(65,15,20,80);

Le rouge (255,0,0), le vert (0,255,0) et le bleu (0,0,255) sont les trois couleurs primaires en synthèse additive.

En les "mélangeant" deux par deux on obtient les couleurs dites secondaires : le jaune (255,255,0), le cyan (0,255,255) et le magenta (255,0,255).

En "mélangeant" les trois couleurs primaires on obtient le blanc (255,255,255).

Processing comporte un outil (Tools > Color selector) permettant de sélectionner une couleur et d'obtenir les niveaux RVB correspondants (RGB en anglais, pour red-green-blue).

Le code précédé d'un # correspond au code RVB de la couleur en hexadécimal.

On peut définir un niveau de transparence (dit "alpha") des couleurs de tracé et de remplissage. Le niveau alpha est un entier entre 0 et 255, 0 correspondant à la transparence totale et 255 à l'opacité totale.

La syntaxe devient fill(r,v,b,alpha), stroke(r,v,b,alpha) ou fill(gris,alpha), stroke(gris,alpha) pour un gris transparent.

background(20,120,200); // fond bleu

stroke(255); // tracé blanc

fill(150,220,60); // remplissage vert

rect(10,10,80,20);

fill(220,30,30,150); // remplissage rouge transparent

rect(65,15,20,80);

Type color

On peut nommer une couleur et utiliser son nom dans les fonctions utilisant les couleurs.

La déclaration d'une couleur utilise le type color et se fait sous la forme :

color nomCouleur=color(r,v,b) ; ou

color nomCouleur=color(r,v,b,alpha) ;.

La syntaxe pour utiliser cette couleur devient fill(nomCouleur) ou stroke(nomCouleur).

En reprenant la construction précédente :

color bleu=color(20,120,200);

background(bleu); // fond bleu

color blanc=color(255);

stroke(blanc); // tracé blanc

color vert=color(150,220,60);

fill(vert); // remplissage vert

rect(10,10,80,20);

color rougeTransparent=color(220,30,30,150);

fill(rougeTransparent); // remplissage rouge transparent

rect(65,15,20,80);