Mettre des images aléatoirement dans une grille

**LeMarseillais78** · 02/04/2014, 20h33

Bonsoir, voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import java.awt.Graphics; 
import java.awt.Image; 
 
import javax.swing.ImageIcon; 
import javax.swing.JPanel; 
 
public class GrilleProjet extends JPanel{ 
 
private boolean debug=true; 
private int scale=10; 
 
 
@Override 
public void paintComponent(Graphics g){ 
super.paintComponent(g); 
 
if (debug) { 
drawGrid(g); 
} 
} 
 
private void drawGrid(Graphics g) { 
int width = getWidth(); 
int height = getHeight(); 
int nb1=width/scale; 
int nb2=height/scale; 
Image img; 
ImageIcon in=new ImageIcon("lien de la photo"); 
img=in.getImage(); 
 
for (int i = 0; i <= width; i += nb1) { 
 
g.drawLine(i, 1, i, height); 
 
} 
 
for (int i = scale; i <= height; i+=nb2 ) { 
g.drawLine(1, i, width, i); 
} 
 
for(int i=0; i<=width; i+=nb1){ 
for(int j=0; j<=height; j+=nb2){ 
g.drawImage(img, i, j,nb1,5,null); 
} 
} 
} 
public void setGrid(Boolean bool){ 
this.debug=bool; 
} 
 
public Boolean getGrid(){ 
return debug; 
} 
}

j aimerais afficher aléatoirement sur chaque case de la grille une image parmi des images d'un dossier. Merci de votre compréhension.

**joel.drigo** · 03/04/2014, 08h51

Salut,

Tu charges toutes les images dans un tableau (mettons Image[] images; en variable de classe)
Tu crées un tableau à 2 dimensions de la taille de ta grille (mettons int[][] grid=new int[NB_LIGNES][NB_COLONNES]; en variable de classe, ou NB_LIGNES et NB_COLONNES sont 2 constantes représentant respectivement nombre de lignes de la grille et nombre de colonnes de la grille
- Tu parcours ce tableau (dans le constructeur, et après avoir rempli le tableau images bien sûr) et, pour dans chaque case, tu mets l'indice d'une image tiré au hasard : grid[i][j]=(int)(Math.random()*images.length);

pour l'afficher, dans ta méthode drawGrid :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
private void drawGrid(Graphics g) { 
int width = getWidth(); 
int height = getHeight(); 
int largeur = width/NB_COLONNES;
int hauteur =height/NB_LIGNES;
 
for(int i=0; i<nbLignes; i++){ 
for(int j=0; j<nbColonnes; j++){ 
   int x=j*largeur;
   int y=i*hauteur;
  g.drawImage(images[grid[i][j]], x, y, largeur, hauteur, this); // ici on affiche l'image contrainte aux dimensions de la case, et on met le JPanel en observeur, ce qui permet d'afficher des gif animés en plus
} 
}

**LeMarseillais78** · 03/04/2014, 21h17

Tu peux m envoyer l'exemple du code complet puisque j'ai un petit soucis pour mettre les images dans le tableau . Merci

**joel.drigo** · 03/04/2014, 21h18

Quel soucis exactement ?

**LeMarseillais78** · 03/04/2014, 21h20

les charger dans le tableau d'images.

**joel.drigo** · 03/04/2014, 21h21

Montres ton code ?

**LeMarseillais78** · 03/04/2014, 21h23

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 public class CodeGrille  {
	 int NB_LIGNES;
	 int NB_COLONNES;
	int[][] grid=new int[NB_LIGNES][NB_COLONNES];
	File fich0=new File("bleu.jpg"); 
	    File fich1=new File("vert.jpg");
	    BufferedImage image1; 
	    BufferedImage image2;
 
	  public CodeGrille(){
		  try { 
 
		        image1 = ImageIO.read(fich0); 
		        image2 = ImageIO.read(fich1); 
 
		        } 
		        catch (IOException e1) { e1.printStackTrace();} 
		        } 
 
	  }
 
	    Image[] images = new Image[2] ;
	    images[0] = image1;
	    images[1] = image2;

Je bloque la ..

**joel.drigo** · 03/04/2014, 21h26

Ça ne fonctionne pas parce qu'il ne trouve pas les fichiers c'est ça ?

Parce que sinon, à part éventuellement un peu de refactoring (tu n'as pas besoin de créé tes variablles de type File et BufferedImage dans la classe, puisqu'elles ne servent que dans le constructeur), tu mets biens 2 images dans ton tableau. Donc je ne vois pas quel souci tu as.

**LeMarseillais78** · 03/04/2014, 21h44

Voila j ai sa

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
 
 
public class CodeGrille extends JPanel  {
	 int NB_LIGNES;
	 int NB_COLONNES;
	int[][] grid=new int[NB_LIGNES][NB_COLONNES];
	File fich0=new File("bleu.jpg"); 
	    File fich1=new File("vert.jpg");
	    BufferedImage image1; 
	    BufferedImage image2;
 
	  public CodeGrille(){
		  try { 
 
		        image1 = ImageIO.read(fich0); 
		        image2 = ImageIO.read(fich1); 
 
		        } 
		        catch (IOException e1) { e1.printStackTrace();
		        } 
 
	  Image[] images = new Image[2];
	    images[0] = image1;
	    images[1] = image2;
 
	    for(int i=0; i<NB_LIGNES; i++){ 
	    	for(int j=0; j<NB_COLONNES; j++){ 
	    		grid[i][j] =(int)(Math.random()*images.length);
	    	}
 
	    	}
	  }
 
 
	    private void drawGrid(Graphics g) { 
 
	    	int width = getWidth(); 
	    	int height = getHeight(); 
	    	int largeur = width/NB_COLONNES;
	    	int hauteur =height/NB_LIGNES;
 
	    	for(int i=0; i<NB_LIGNES; i++){ 
	    	for(int j=0; j<NB_COLONNES; j++){ 
	    	   int x=j*largeur;
	    	   int y=i*hauteur;
	    	  g.drawImage(images[grid[i][j]], x, y, largeur, hauteur, (ImageObserver) this); // ici on affiche l'image contrainte aux dimensions de la case, et on met le JPanel en observeur, ce qui permet d'afficher des gif animés en plus
	    	} 
	    	}
	    }
 
}

Je vois pas ou est mon soucis mais images dans drawgrid n existe pas.

**joel.drigo** · 03/04/2014, 21h55

Il y'a juste 2 petits problèmes : la variable images doit être de classe, pour pouvoir être vue du constructeur et de la méthode drawGrid. Et les constantes NB_LIGNES et NB_COLONNES doivent être initialisées, sinon tu as une grille de 0 x 0.

Voilà ton code un peu remanié :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
import java.awt.Graphics;
import java.awt.Image;
import java.io.File;
import java.io.IOException;
 
import javax.imageio.ImageIO;
import javax.swing.JPanel;
 
public class CodeGrille extends JPanel {
 
	public final static int NB_LIGNES = 10;
	public final static int NB_COLONNES = 10;
 
	private int[][] grid = new int[NB_LIGNES][NB_COLONNES];
 
	private Image[] images;
 
	public CodeGrille() {
 
		images = new Image[2]; 
		images[0] = lireImage("bleu.jpg"); // attention à la manière d'aller chercher ce fichier (ceci peut fonctionner ou pas selon l'emplacement du fichier) : 
		images[1] = lireImage("vert.jpg");
 
		for (int i = 0; i < NB_LIGNES; i++) {
			for (int j = 0; j < NB_COLONNES; j++) {
				grid[i][j] = (int) (Math.random() * images.length);
			}
		}
	}
 
	private Image lireImage(String string) {
 
		try {
 
			return ImageIO.read(new File(string));
 
		} catch (IOException e1) {
			e1.printStackTrace();
			return null;
		}
 
	}
 
	@Override
	public void paint(Graphics g) {
		super.paint(g);
		drawGrid(g);
	}
 
	private void drawGrid(Graphics g) {
 
		int width = getWidth();
		int height = getHeight();
		int largeur = width / NB_COLONNES;
		int hauteur = height / NB_LIGNES;
 
		for (int i = 0; i < NB_LIGNES; i++) {
			for (int j = 0; j < NB_COLONNES; j++) {
				int x = j * largeur;
				int y = i * hauteur;
                                Image image = images[grid[i][j]];
                                if ( image!=null ) { // on est sur au moins comme ça que si le fichier n'a pas été trouvé, on plante pas
				       g.drawImage(image, x, y, largeur, hauteur, this); 
                                }
			}
		}
	}
 
}

**LeMarseillais78** · 03/04/2014, 22h05

Merci et t'en fais pas pour les images j'avais prévu le coup. Est ce que tu sais pour que les traits de la grille soit visible?

**joel.drigo** · 03/04/2014, 22h18

Pour avoir les traits de la grille, il faut les dessiner, comme tu faisais dans ton premier code, sauf qu'il faut utiliser largeur et hauteur maintenant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
private void drawGrid(Graphics g) {
 
		int width = getWidth();
		int height = getHeight();
		int largeur = width / NB_COLONNES;
		int hauteur = height / NB_LIGNES;
 
		for (int i = 0; i < NB_LIGNES; i++) {
			for (int j = 0; j < NB_COLONNES; j++) {
				int x = j * largeur;
				int y = i * hauteur;
                                Image image = images[grid[i][j]];
                                if ( image!=null ) { // on est sur au moins comme ça que si le fichier n'a pas été trouvé, on plante pas
				       g.drawImage(image, x, y, largeur, hauteur, this); 
                                }
			}
		}
 
                // on dessine la grille après pour qu'elle soit dessinée par dessus les images
                g.setColor(Color.WHITE); // par exemple pour dessiner la grille en blanc
 
                for (int i = 0; i <= width; i += largeur) {  
                    g.drawLine(i, 0, i, height);  
                } 
 
                for (int i = 0; i <= height; i+=hauteur) { 
                   g.drawLine(0, i, width, i); 
                } 
 
 
}

**LeMarseillais78** · 03/04/2014, 22h20

Merci beaucoup de votre aide.

**LeMarseillais78** · 03/04/2014, 23h28

Excuse moi encore une fois mais je voulais te demander une dernière chose, j'aimerais en fait que quand je cliques sur une de ses images il se passe un événement tel qu'il soit. En gros dire si je clique sur cette image il se passe quelque chose.
Merci de ton aide.

**joel.drigo** · 04/04/2014, 00h20

En fait, quelque part ça change tout. Il aurait été plus simple de mettre les images dans des JLabel, layouté par un GridLayout mis dans le JPanel : il suffisait ensuite de mettre un MouseListener sur change JLabel. Beaucoup plus simple (à part pour dessiner la grille peut être, parce qu'il faudrait jouer avec des borders sur les labels).

Mais bon, vu que tu le fais par dessin, on va continuer sur cette voie là : il faut enregistrer le MouseListener sur le JPanel. Lors du clic, on va obtenir les coordonnées de la souris dans le JPanel. Il suffit de déterminer quelle case correspond : il suffit pour ça de connaitre la hauteur d'une case et sa largeur. Donc on va les calculer exactement de la même manière qu'on les calcule quand on dessine. Ensuite, pour connaitre la position colonne, ligne de la case, il suffit de faire le calcul inverse qu'on a fait pour dessiner, en quelque sorte.

La coordonnée X d'une case est X * largeur. Si le x de la souris est entre X et X + largeur, elle est bien dans la case (dans la colonne du moins). Donc si on divise le x de la souris par la largeur (en division entière), on aura la coordonnée X de la colonne. Pareil pour les Y.

Maintenant pour faire sa de manière pratique à utiliser avec ta classe CodeGrille, on va créer un faux listener intermédiaire. Il suffit d'ajouter dans la classe CodeGrille, à la fin

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
	public void addImageClicker(final ImageClicker imageClicker) {
                // en encapsule le faux listener dans le vrai listener de souris (ici un MouseAdapter, une implémentation de MouseListener qui ne t'oblige pas à implémenter toutes ses méthodes (parce qu'elles le sont déjà)
		addMouseListener(new MouseAdapter() {
			@Override
			public void mouseClicked(MouseEvent e) {
                                // comme je l'ai dit, on calcule la hauteur et la largeur de la m^me manière qu'on la fait pour dessiner
				int width = getWidth();
				int height = getHeight();
				int largeur = width / NB_COLONNES;
				int hauteur = height / NB_LIGNES;
                                // on détermine la colonne et la ligne dans la grille
				int colonne = e.getX()/largeur;
				int ligne = e.getY()/hauteur;
                                // on transmet les informations au faux listener, de manière à ce qu'on puisse réagir avec quand on l'utilise
				imageClicker.click(colonne, ligne, grid[ligne][colonne]);
			}
		});
	}
 
        // ça c'est la classe de faux listener
	public static abstract class ImageClicker {
 
		public ImageClicker() {
		}
 
		public abstract void click(int colonne, int ligne, int image);
 
 
	}

Et voici un exemple d'utilisation :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
public class TestGrille {
 
	public static void main(String[] args) {
 
		JFrame frame = new JFrame();
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 
		CodeGrille grille = new CodeGrille();
		frame.setContentPane(grille);
 
		grille.addImageClicker(new CodeGrille.ImageClicker() {
 
			@Override
			public void click(int colonne, int ligne, int image) {
				System.out.println("clic sur le fichier " + image + " en colonne " + colonne + " et ligne " + ligne );
			}
 
		});
 
		frame.setSize(200, 200);
		frame.setLocationRelativeTo(null);
 
		frame.setVisible(true);
 
 
 
 
	}
 
}

**LeMarseillais78** · 04/04/2014, 20h24

Merci ,mais ce que je voudrais c'est plus que quand je clique une fenetre s'ouvre au lieu d'un System.out.println.
Merci pour ton aide.

**joel.drigo** · 04/04/2014, 21h01

Le System.out.println() c'est juste un exemple... si tu veux ouvrir une fenêtre à la place, tu mets le code pour ouvrir une fenêtre à la place...

**LeMarseillais78** · 05/04/2014, 11h58

Excuse moi sa serait possible de t'envoyer du code par message privé vu que c'est assez long et qu'il y a plusieurs classe?..

**joel.drigo** · 05/04/2014, 12h08

Non, pas de code par MP, ça ira directement dans la poubelle. Pourquoi tu veux m'envoyer tout ton code ? Si tu as un problème particulier, mets juste le code qui pose problème dans le message, et la question qui va avec (avec le détail qui va avec, genre description des messages d'erreur le cas échéant). Et si la question est sans rapport avec celle de cette discussion, fait une nouvelle discussion.