Explore

Exercices
Exercices

Pascal Houba

Exercice 1 : Un mini Paint

dernier exemple (Etape 4) de la leçon sur les interactions⁠

peut être modifié pour créer une petite application de coloriage.

Une palette contient une série de couleurs.

Si on clique sur une des cases de cette palette, on sélectionne la couleur indiquée par un petit triangle pointé sur sa case.

On peut colorier les cases de la grille de dessin avec la couleur sélectionnée en cliquant (

mousePressed()⁠

) ou en "glissant et appuyant" (

mouseDragged()⁠

) dessus.

⁠

Capture d’écran 2020-04-19 à 12.54.54.png

⁠

Pour générer les couleurs de la palette, on peut s'inspirer de cet

algorithme très simple pour générer un nombre donnée de couleurs de l'arc-en-ciel⁠

Il est basé sur la commande

colorMode⁠

de Processing qui permet de passer du mode de couleur RGB habituel au mode de couleur

HSL⁠

, basé sur une autre représentation des couleurs où les trois composantes ont une signification différente.

Voici le code permettant de générer un tableau contenant les couleurs de la palette illustrée ci-dessus :

color p[] = new color[m]; // Couleurs de la palette

// Initialisation de la palette de couleurs

colorMode(RGB, 255, 255, 255);

for (int j=0;j<m/2;j++) {

p[j] = color(255-2.0*j/m*255); // Dégradés de gris

}

colorMode(HSB, 360, 100, 100);

for (int j=m/2;j<m;j++) {

p[j] = color((j-m/2)*720/(m+2), 100, 100); // Arc-en-ciel

}

colorMode(RGB, 255, 255, 255); // Retour au mode RGB

Cet exercice permet de combiner les notions vues précédemment :

Un tableau à une dimensions contient les couleurs de la palette.

Un tableau à deux dimensions contient les codes des couleurs des cases de la grille. Ce code est un numéro qui fait référence à l'indice du tableau à une dimension.

Les interactions permettent de détecter où on clique avec la souris pour déclencher l'action correspondante : sélectionner une couleur lorsque l'on est au-dessus de la palette ou colorier une case lorsque l'on est au-dessus de la grille.

Correction de l'exercice 1

⁠

This link can't be embedded.⁠

⁠

Exercice 2 : Des pions qui rebondissent dans une grille

Dans une grille de 25x25 cases de 20 pixels de côté, 10 pions noirs et ronds de 10 pixels de diagonale se déplacent en rebondissant sur les côtés de la grille. Les pions peuvent se déplacer indépendamment d'une case à la fois horizontalement, verticalement ou en diagonale.

Il s'agit d'utiliser deux tableaux à une dimension qui contient les différentes coordonnées des pions dans le système de la grille : i et j de chaque pion.

⁠

Capture d’écran 2020-04-28 à 11.46.08.png

⁠

Correction de l'exercice 2

⁠

Loading…⁠

⁠

Exercice 3 : Variante avec des murs dans la grille

⁠

Capture d’écran 2020-05-05 à 11.38.00.png

⁠

Le code ci-dessous est une variante de l'exercice précédent où on construit des "murs" (cases noires) dans la grille.

Un tableau à 2 dimensions permet de mémoriser les emplacements des murs : 0 pour une case vide, 1 pour une case murée.

L'exercice consiste à trouver comment faire rebondir les balles de l'exercice précédent sur les murs et non plus seulement sur les bords de la grille.