Dessiner des motifs avec des boucles
Dessiner dix carrés à la main, c'est long. Avec une boucle, c'est trois lignes, et cent carrés ne coûtent pas plus cher. Les motifs répétitifs sont le terrain de jeu idéal des boucles.
Une frise
L'idée de base : la position de chaque forme se calcule à partir du compteur de la boucle.
t est une toile
dimension(t, 420, 80)
remplir(t, #FFFFFF)
pour i de 0 à 7
rectangle(t, 20 + i * 48, 20, 36, 36, #1D9BF0)
fin pour
affiche t
20 + i * 48 : le premier carré est à 20, le suivant à 68, puis 116... Chaque carré est décalé de 48 pixels : 36 de largeur, plus 12 d'espace.
Un damier
Pour une grille, deux boucles imbriquées : une pour les lignes, une pour les colonnes. Et pour alterner les couleurs, une astuce : une case est foncée quand ligne + colonne est pair.
t est une toile
dimension(t, 320, 320)
pour i de 0 à 7
pour j de 0 à 7
si (i + j) mod 2 = 0 alors
rectangle(t, j * 40, i * 40, 40, 40, #2F3542)
sinon
rectangle(t, j * 40, i * 40, 40, 40, #F1F2F6)
fin si
fin pour
fin pour
affiche t
Regarde bien : j (la colonne) sert à calculer x, et i (la ligne) sert à calculer y.
Question : Dans ce damier, de quelle couleur est la case de la ligne 2, colonne 5 ? — Claire. 2 + 5 = 7, qui est impair : le test (i + j) mod 2 = 0 est faux, la case est claire.
Des cercles concentriques
Ici, c'est le rayon qui dépend du compteur. On dessine du plus grand au plus petit, pour que les petits cercles ne soient pas recouverts :
t est une toile
dimension(t, 300, 300)
remplir(t, #0D1117)
pour i de 8 à 1 pas -1
cercle(t, 150, 150, i * 17, tls(i * 40, 80, 55))
fin pour
affiche t
tls(teinte, saturation, luminosité) fabrique une couleur : en faisant varier la teinte avec i, on obtient un arc-en-ciel.
Placer des formes en rond
Pour disposer des points sur un cercle, on utilise le cosinus et le sinus : ils donnent la position horizontale et verticale d'un point à partir d'un angle.
t est une toile
dimension(t, 300, 300)
remplir(t, #FFFFFF)
angle est un nombre
px est un nombre
py est un nombre
pour i de 0 à 11
angle vaut radians(i * 30)
px vaut 150 + 100 * cosinus(angle)
py vaut 150 + 100 * sinus(angle)
cercle(t, px, py, 14, tls(i * 30, 85, 55))
fin pour
affiche t
Douze cercles, espacés de 30 degrés (12 × 30 = 360, un tour complet) : c'est le cadran d'une horloge ! radians convertit les degrés dans l'unité attendue par cosinus et sinus.
Une rosace
En reliant le centre à chaque point, et en resserrant les angles, on obtient une étoile :
t est une toile
dimension(t, 300, 300)
remplir(t, #0D1117)
angle est un nombre
px est un nombre
py est un nombre
pour i de 0 à 35
angle vaut radians(i * 10)
px vaut 150 + 130 * cosinus(angle)
py vaut 150 + 130 * sinus(angle)
ligne(t, 150, 150, px, py, tls(i * 10, 90, 60), 2)
fin pour
affiche t
Un ciel étoilé
Le hasard donne des motifs plus naturels. Cent étoiles, de taille et de position aléatoires :
t est une toile
dimension(t, 400, 250)
remplir(t, #0B1026)
pour i de 1 à 100
cercle(t, hasard(0, 400), hasard(0, 250), hasard(1, 3), #FFFFFF)
fin pour
cercle(t, 330, 60, 30, #FDF6C3)
affiche t
À chaque exécution, le ciel est différent.
En résumé
- La position, la taille ou la couleur d'une forme se calculent à partir du compteur.
- Deux boucles imbriquées dessinent une grille ;
(i + j) mod 2 alterne deux couleurs. cosinus et sinus placent des points sur un cercle ; radians convertit les degrés.hasard donne des motifs toujours différents.