, spécifique à Processing, est utilisé pour créer une variable unique contenant les informations des composantes de couleur Rouge, Vert, Bleu lorsque trois nombres sont spécifiés, ou d'intensité du gris lorsqu'un seul nombre est spécifié.
int n = 12; // Nombre de cases horizontalement
int m = 4; // Nombre de cases verticalement
int a = 50; // Dimension d'une case
int x0 = 100; // Coordonnées du coin supérieur gauche de la grille
int y0 = 50;
color b = color(100); // Couleur initiale du fond
int c[][] = new int[n][m]; // 1. Déclaration d'un tableau à 2 dimensions
void setup() {
frameRate(25); // Taux de rafraîchissement de 25 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() {
background(b);
b = color(100); // Retour au gris au cas où la couleur de fond a été changée
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);
text(c[i][j],x+a/2,y+a/2); // 3. Utilisation des éléments du tableau
}
}
}
void mousePressed() {
b = color(255,0,0); // Change la couleur du fond en rouge
permettent d'obtenir les coordonnées de la souris dans le système de coordonnées de la fenêtre.
int n = 12; // Nombre de cases horizontalement
int m = 4; // Nombre de cases verticalement
int a = 50; // Dimension d'une case
int x0 = 100; // Coordonnées du coin supérieur gauche de la grille
int y0 = 50;
color b = color(100); // Couleur initiale du fond
int c[][] = new int[n][m]; // 1. Déclaration d'un tableau à 2 dimensions
void setup() {
frameRate(10); // Taux de rafraîchissement de 10 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() {
background(b);
b = color(100); // Retour au gris au cas où la couleur de fond a été changée
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);
text(c[i][j],x+a/2,y+a/2); // 3. Utilisation des éléments du tableau
}
}
// Remarque : cette partie du code est en dehors des boucles
// pour n'être exécuté qu'une fois par cycle
fill(0,0,255);
if (mouseX != 0 && mouseY != 0) // Quand la souris passe sur la fenêtre,
// afficher ses coordonnées à côté du pointeur
text(mouseX+","+mouseY,mouseX,mouseY);
}
void mousePressed() {
b = color(255,0,0); // Change la couleur du fond en rouge
}
Etape 3 : Trouver sur quelle case de la grille passe la souris
Pour trouver sur quelle case de la grille est positionnée la souris, il faut faire un changement de coordonnées : passer du système de coordonnées de la fenêtre, de type (x,y), au système de coordonnées de la grille, de type (i,j).
Les relations surlignées ci-dessous sont en quelque sorte l'inverse l'une de l'autre. Elles permettent de passer respectivement du système de la fenêtre à celui de la grille et inversement.
est utilisée pour vérifier si le curseur est au-dessus de la grille à cet instant. Les conditions qui la compose sont hétérogènes dans le sens où elles font intervenir à la fois des variables du système de coordonnées de la fenêtre et du système de coordonnées de la grille. Il n'y a pas de raison fondamentale à cela. On pourrait ne tester que des variables du même système de coordonnées mais il me semble que c'est la forme la plus concise pour que le fonctionnement soit correct.
int n = 12; // Nombre de cases horizontalement
int m = 4; // Nombre de cases verticalement
int a = 50; // Dimension d'une case
int x0 = 100; // Coordonnées du coin supérieur gauche de la grille
int y0 = 50;
color b = color(100); // Couleur initiale du fond
int c[][] = new int[n][m]; // 1. Déclaration d'un tableau à 2 dimensions
void setup() {
frameRate(10); // Taux de rafraîchissement de 10 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() {
background(b);
b = color(100); // Retour au gris au cas où la couleur de fond a été changée
int mousei = (mouseX - x0) / a; // Changement de système de coordonnées :