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
Your link was not successfully embedded. Please try again with a different URL.
int n = 25; // Nombre de cases horizontalement
int m = 25; // Nombre de cases verticalement
int a = 20; // Dimension d'une case
int x0 = 200; // Coordonnées du coin supérieur gauche de la grille
int y0 = 50;
int b = m/2; // Couleur choisie dans la palette initialement
color p[] = new color[m]; // Couleurs de la palette
color c[][] = new color[n][m]; // Déclaration d'un tableau à 2 dimensions
void setup() {
frameRate(30); // Taux de rafraîchissement de 30 Hz
size(800,600);
// 1. 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
b = mousej; // Change la couleur sélectionnée dans la palette
}
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.
Correction de l'exercice 2
Your link was not successfully embedded. Please try again with a different URL.
int n = 25; // Nombre de cases horizontalement
int m = 25; // Nombre de cases verticalement
int a = 20; // Dimension d'une case
int x0 = 150; // Coordonnées du coin supérieur gauche de la grille
int y0 = 50;
int np = 10; // Nombre de pions
// Déclaration des tableaux contenant les caractéristiques des pions
// dans le système de coordonnées de la grille (i,j)
int pi[] = new int[np]; // Composantes horizontales des positions
int pj[] = new int[np]; // Composantes verticales des positions
int vi[] = new int[np]; // Composantes horizontales des déplacements
int vj[] = new int[np]; // Composantes verticales des déplacements
void setup() {
size(800,600);
frameRate(10);
// Initialisation des tableaux des caractéristiques des pions
for (int p=0;p<np;p++) { // On parcoure la série de pions
pi[p] = (int)(random(n-2))+1; // Entre 1 et n-1 (pas sur les bords)
pj[p] = (int)(random(m-2))+1; // Entre 1 et m-1
vi[p] = (int)(random(3))-1; // Entre -1 et 1 (cases adjacentes)
vj[p] = (int)(random(3))-1; // Entre -1 et 1
}
}
void draw() {
background(100);
// Dessin de la grille
for (int i=0;i<n;i++) { // i numérote les colonnes
for (int j=0;j<m;j++) { // j numérote les lignes
int x = x0 + i*a; // Coordonnées (x,y) du coin supérieur gauche de chaque case
int y = y0 + j*a; // en fonction des coordonnées de la grille (i,j)
fill(255);
rect(x,y,a,a);
}
}
// Animation et dessin des pions
for (int p=0;p<np;p++) { // On parcoure la série de pions
Le code suivant reprend le code de l'exercice 3 ci-dessus, le modifie pour n'avoir qu'un seul pion (donc plus besoin de tableaux à 1 dimension pour mémoriser les caractéristiques des pions) et ajoute une méthode pour gérer l'interaction avec le clavier.
int n = 25; // Nombre de cases horizontalement
int m = 25; // Nombre de cases verticalement
int a = 20; // Dimension d'une case
int x0 = 150; // Coordonnées du coin supérieur gauche de la grille
int y0 = 50;
int pi = n/2; // Coordonnées initiales du pion dans la grille
int pj = m/2;
// Déclaration d'un tableau 2D pour la grille
int grid[][] = new int [n][m];
void setup() {
size(800,600);
frameRate(10);
// Initialisation d'un tableau 2D pour la grille
for (int i=0;i<n;i++) { // i numérote les colonnes
for (int j=0;j<m;j++) {
grid[i][j] = (int)(random(10)); // Entre 0 et 9
if (grid[i][j] > 1) grid[i][j] = 0; // => 9 chances sur 10 d'avoir 0
}
}
if (grid[pi][pj] == 1) // Si la case où se trouve le pion est noire,
grid[pi][pj] = 0; // on la met en blanc
}
void draw() {
background(100);
// Dessin de la grille
for (int i=0;i<n;i++) { // i numérote les colonnes
for (int j=0;j<m;j++) { // j numérote les lignes
int x = x0 + i*a; // Coordonnées (x,y) du coin supérieur gauche de chaque case
int y = y0 + j*a; // en fonction des coordonnées de la grille (i,j)
if (grid[i][j] == 1) fill(0); // Noir
else fill(255); // Blanc
rect(x,y,a,a);
}
}
// Dessin du pion
fill(0);
int x = x0 + pi*a + a/2; // Coordonnées (x,y) du centre de la case
int y = y0 + pj*a + a/2; // où se trouve le pion
ellipse(x,y,a/2,a/2);
}
void keyPressed() {
int vi = 0;
int vj = 0;
if (key == CODED) {
if (keyCode == UP) {
vi = 0;
vj = -1;
} else if (keyCode == DOWN) {
vi = 0;
vj = 1;
} else if (keyCode == RIGHT) {
vi = 1;
vj = 0;
} else if (keyCode == LEFT) {
vi = -1;
vj = 0;
}
}
if (pi+vi >= 0 && pi+vi <= n-1 && // Si le pion ne va pas dépasser les bords
pj+vj >= 0 && pj+vj <= m-1)
if (grid[pi+vi][pj+vj] == 0) { // Si le pion ne va pas se cogner sur un mur
pi += vi; // Déplacement du pion
pj += vj;
}
}
Exemple : Pacman
On peut assez vite passer à un jeu de type Pacman à partir du code précédent. Pour cela, nous pouvons trouver le morceau de code contenant la description du labyrinthe du jeu dans les commentaires de cette vidéo.
Le code suivant reprend le tableau à 2 dimensions contenant des codes pour décrire chaque case du jeu (1: Mur; 0: Pastille; 8 : Grosse pastille; 6: Vide) inclut dans le code source.
Il suffit alors de quelques modifications au code de la section précédente pour ressembler à un jeu de Pacman (sans fantômes pour le moment).
int n = 28; // Nombre de cases horizontalement
int m = 31; // Nombre de cases verticalement
int a = 32; // Dimension d'une case
int x0 = 0; // Coordonnées du coin supérieur gauche de la grille
int y0 = 0;
int pi = n/2; // Coordonnées initiales du pacman dans la grille
int pj = m/2+2;
// Déclaration d'un tableau 2D pour la grille
int grid[][] = { // 1: Mur 0: Pastille 8 : Grosse pastille 6: Vide
Exercices
