-
Notifications
You must be signed in to change notification settings - Fork 2
cours05
Jusqu'à maintenant nos croquis étaient totalement prévisibles. Et si on leur donnait la possibilité de nous surprendre ? Si on dessinait nos formes de tailles et de couleurs aléatoires ? La fonction random()
nous permet d'introduire ce grain de folie.
random()
est une fonction qui renvoie une valeur. Contrairement aux fonctions line()
, rect()
etc. qui dessinent des formes, elle répond à une question et nous renvoie la réponse. Nous avons déjà utilisé de telles fonctions, comme par exemple dist()
ou abs()
. Imaginons le dialogue suivant :
Moi : Salut Random, ça va ? Écoute, je me demandais si tu pouvais me donner un nombre aléatoire entre 1 et 100 ?
Random : Bien sûr, pas de problème. Tu dirais quoi de 63 ?
Moi : Super, génial ! Merci beaucoup ! Bon, je m'en vais, je dois dessiner un cercle de diamètre 63. Merci encore !
Voici la traduction de ce dialogue dans l'environnement plus formel de Processing, où mon rôle est joué par la variable diam
.
float diam = random(1, 100);
ellipse(100, 100, diam, diam);
La fonction random()
a deux arguments et renvoie un nombre aléatoire entre les deux. Il faut que le deuxième argument soit supérieur au premier. Elle marche aussi avec un seul argument et dans ce cas elle renvoie un nombre entre 0 et cet argument. La fonction renvoie des nombres réels, c'est pourquoi diam
est déclaré comme float
. Si vous voulez un entier, il faut convertir le résultat. Par exemple, pour simuler la la lancée d'un dé on fait :
int de = int(random(1, 7));
Notez bien qu'on utilise 7 et pas 6 comme borne supérieure car random(a, b)
renvoie un nombre entre a
(inclu) et b
(exclu).
Comment random()
fait pour calculer ces nombres, utilise-t-il une sorte de dé électronique ? En réalité ces nombres ne sont pas tout à fait aléatoires. Ils sont calculés en utilisant des formules assez simples conçues de telle sorte que les séquences générées ressemblent à des séquences aléatoires. C'est pourquoi on appelle souvent ces nombres pseudo-aléatoires.
Source xkcd
Exemple 5.1. Nous allons nous improviser peintres abstractionnistes pointillistes en dessinant des cercles avec des couleurs, positions et tailles aléatoires.
float r, g, b, a, x, y, diam;
void setup() {
size(320, 240);
background(255);
noStroke();
}
void draw() {
r = random(255);
g = random(255);
b = random(255);
a = random(255);
x = random(width);
y = random(height);
diam = random(20);
fill(r, g, b, a);
ellipse(x, y, diam, diam);
}
Exemple 5.2. Dans cet exemple le « génome » de Chip est stocké dans 12 variables (« gènes »). À chaque clic de la souris, nous dessinons un nouveau Chip en tirant des valeurs aléatoires pour ces variables. Les intervalles sont choisis de telle sorte que les Chips ne soient pas défigurés. Même si chaque Chip est unique, tous partagent des traits communs, un peu comme nous, les humains. On peut faire disparaître tous les Chips en appuyant sur une touche du clavier.
float couleurCorps;
float largeur;
float hauteurCorps;
float tailleLED;
float niveauLED;
float ledR, ledG, ledB;
float couleurRoue;
float diamRoue;
float hauteurTete;
float rCamera;
float diamCamera;
float hauteurAntenne;
void setup() {
size(600, 600);
background(255);
}
void draw() {
}
void mousePressed() {
// dessiner un Chip aléatoire
// le corps
stroke(0);
strokeWeight(1);
couleurCorps = random(32, 224);
fill(couleurCorps);
largeur = random(50, 100);
hauteurCorps = random(largeur, 3 * largeur / 2);
rectMode(CORNER);
rect(mouseX - largeur / 2, mouseY, largeur, hauteurCorps);
// les trois LEDS
rectMode(CENTER);
tailleLED = random(10, largeur / 4);
niveauLED = random(tailleLED, hauteurCorps / 2);
ledR = random(64,255);
fill(ledR, 0, 0);
rect(mouseX - (largeur + tailleLED) / 4, mouseY + niveauLED, tailleLED, tailleLED);
ledG = random(64,255);
fill(0, ledG, 0);
rect(mouseX, mouseY + niveauLED, tailleLED, tailleLED);
ledB = random(64,255);
fill(0, 0, ledB);
rect(mouseX + (largeur + tailleLED) / 4, mouseY + niveauLED, tailleLED, tailleLED);
// les roues
couleurRoue = random(couleurCorps, 255);
fill(couleurRoue);
diamRoue = random(15, largeur / 3);
ellipse(mouseX - (2 * largeur - diamRoue) / 6, mouseY + hauteurCorps, diamRoue, diamRoue);
ellipse(mouseX + (2 * largeur - diamRoue) / 6, mouseY + hauteurCorps, diamRoue, diamRoue);
// la tête
fill(couleurCorps);
hauteurTete = random(largeur / 4, 3 * largeur / 4);
arc(mouseX, mouseY - 5, largeur, 2 * hauteurTete, -PI, 0, CHORD);
// la caméra
rCamera = random(32, 96);
fill(rCamera, 0, 0);
diamCamera = random(hauteurTete / 2, 3 * hauteurTete / 4);
ellipse(mouseX, mouseY - 5 - hauteurTete / 2, diamCamera, diamCamera);
// l'antenne
strokeWeight(3);
hauteurAntenne = random(hauteurTete, 2 * hauteurTete);
line(mouseX, mouseY - 5 - hauteurTete, mouseX, mouseY - 5 - hauteurTete - hauteurAntenne);
}
void keyPressed() {
background(255);
}
Exercice 5.1. Utilisez les variables pour rendre votre « chose » plus vivante et plus intéressante. Faites-la bouger, changer la couleur et la taille, etc. Ajoutez un peu d'aléatoire pour rendre les choses encore plus intéressantes.