Share
Explore

icon picker
Les tableaux à deux dimensions

Ressources externes sur les tableaux

Etape 1 : Dessiner une ligne horizontale de cases avec une boucle de compteur i

image.png
size(800,150);int n = 12; // Nombre de casesint a = 50; // Dimension d'une caseint x0 = 100; // Coordonnées du coin supérieur gauche de la ligneint y0 = 50;for (int i=0;i<n;i++) { // i numérote les cases de la ligne int x = x0 + i*a; // Coordonnées du coin supérieur gauche de chaque case int y = y0; rect(x,y,a,a);}

Etape 2 : Numéroter les cases

image.png
size(800,150);textSize(20); // Taille des caractèrestextAlign(CENTER,CENTER); // Alignement horizontal et verticalint n = 12; // Nombre de casesint a = 50; // Dimension d'une caseint x0 = 100; // Coordonnées du coin supérieur gauche de la ligneint y0 = 50;for (int i=0;i<n;i++) { // i numérote les cases de la ligne int x = x0 + i*a; // Coordonnées du coin supérieur gauche de chaque case int y = y0; fill(255); rect(x,y,a,a); fill(0); text(i,x+a/2,y-a/2); // Décalage de a/2 pour écrire au-dessus des cases}

Etape 3 : Afficher une valeur aléatoire dans chaque case

image.png
size(800,150);textSize(20); // Taille des caractèrestextAlign(CENTER,CENTER); // Alignement horizontal et verticalint n = 12; // Nombre de casesint a = 50; // Dimension d'une caseint x0 = 100; // Coordonnées du coin supérieur gauche de la ligneint y0 = 50;for (int i=0;i<n;i++) { // i numérote les cases de la ligne int x = x0 + i*a; // Coordonnées du coin supérieur gauche de chaque case int y = y0; fill(255); rect(x,y,a,a); fill(0); text(i,x+a/2,y-a/2); // Décalage de -a/2 pour écrire au-dessus des cases fill(255,0,0); int c = (int)random(10); text(c,x+a/2,y+a/2); // Décalage de +a/2 pour écrire dans les cases}

Etape 4 : Dessiner une grille en ajoutant une boucle imbriquée de compteur j

image.png
size(800,300);textSize(20); // Taille des caractèrestextAlign(CENTER,CENTER); // Alignement horizontal et verticalint n = 12; // Nombre de cases horizontalementint m = 4; // Nombre de cases verticalementint a = 50; // Dimension d'une caseint x0 = 100; // Coordonnées du coin supérieur gauche de la grilleint y0 = 50;for (int i=0;i<n;i++) { // i numérote (les cases de chaque ligne =>) les colonnes for (int j=0;j<m;j++) { // j numérote les lignes int x = x0 + i*a; // Coordonnées du coin supérieur gauche de chaque case int y = y0 + j*a; fill(255); rect(x,y,a,a); fill(0); if (j == 0) // Au début de chaque colonne text(i,x+a/2,y-a/2); // Décalage vertical pour écrire au-dessus des cases if (i == 0) // Au début de chaque ligne text(j,x-a/2,y+a/2); // Décalage horizontal pour écrire au-dessus des cases fill(255,0,0); int c = (int)random(10); text(c,x+a/2,y+a/2); // Décalage de +a/2 pour écrire dans les cases }}

Etape 5 : Créer une animation avec les méthodes setup() et draw()


int n = 12; // Nombre de cases horizontalementint m = 4; // Nombre de cases verticalementint a = 50; // Dimension d'une caseint x0 = 100; // Coordonnées du coin supérieur gauche de la grilleint y0 = 50;
void setup() { frameRate(2); // Taux de rafraîchissement de 2 Hz size(800,300); textSize(20); // Taille des caractères textAlign(CENTER,CENTER); // Alignement horizontal et vertical}
void draw() { for (int i=0;i<n;i++) { // i numérote (les cases de chaque ligne =>) les colonnes for (int j=0;j<m;j++) { // j numérote les lignes int x = x0 + i*a; // Coordonnées du coin supérieur gauche de chaque case int y = y0 + j*a; fill(255); rect(x,y,a,a); fill(0); if (j == 0) // Au début de chaque colonne text(i,x+a/2,y-a/2); // Décalage vertical pour écrire au-dessus des cases if (i == 0) // Au début de chaque ligne text(j,x-a/2,y+a/2); // Décalage horizontal pour écrire au-dessus des cases fill(255,0,0); int c = (int)random(10); text(c,x+a/2,y+a/2); // Décalage de +a/2 pour écrire dans les cases } }}
Que remarque-t-on?

Etape 6 : Introduire un tableau à deux dimensions

Cela permet de conserver la valeur de chaque case au cours du temps même lors d'une animation.
Ici, c'est la variable locale c qui doit être tranformée en tableaux car c'est elle qui contient les valeurs affichées dans chaque case.
Jusque-là, une seule variable était suffisante car elle était calculée "à la volée", juste au moment où on devait l'afficher. Ensuite, sa valeur était perdue, remplacée par la valeur de la case suivante.
Comme le tableau c[][] qui la remplace est déclaré au niveau global, il peut conserver ses valeurs au cours du temps.
Grâce à ses deux dimensions, il peut être utilisé dans une boucle imbriquée à deux niveaux qui est pratique pour parcourir les cases d'une grille par exemple.
Apparemment, l'exécution du code suivant revient donc à l'étape 4, avant l'animation, mais ce n'est qu'une apparence car, maintenant, on peut tirer avantage de l'animation comme nous allons le voir en introduisant .
int n = 12; // Nombre de cases horizontalementint m = 4; // Nombre de cases verticalementint a = 50; // Dimension d'une caseint x0 = 100; // Coordonnées du coin supérieur gauche de la grilleint y0 = 50;
int c[][] = new int[n][m]; // 1. Déclaration d'un tableau à 2 dimensions
void setup() { frameRate(2); // Taux de rafraîchissement de 2 Hz size(800,300); textSize(20); // Taille des caractères textAlign(CENTER,CENTER); // Alignement horizontal et vertical // 2. Initialisation des éléments du tableau à 2 dimensions for (int i=0;i<n;i++) { for (int j=0;j<m;j++) { c[i][j] = (int)random(10); } }}
void draw() { for (int i=0;i<n;i++) { // i numérote (les cases de chaque ligne =>) les colonnes for (int j=0;j<m;j++) { // j numérote les lignes int x = x0 + i*a; // Coordonnées du coin supérieur gauche de chaque case int y = y0 + j*a; fill(255); rect(x,y,a,a); fill(0); if (j == 0) // Au début de chaque colonne text(i,x+a/2,y-a/2); // Décalage vertical pour écrire au-dessus des cases if (i == 0) // Au début de chaque ligne text(j,x-a/2,y+a/2); // Décalage horizontal pour écrire à gauche des cases fill(255,0,0); //int c = (int)random(10); text(c[i][j],x+a/2,y+a/2); // 3. Utilisation des éléments du tableau } }}



Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.