Dessiner avec la souris

Version imprimable

Bonjour à tous. J'aimerai pouvoir utiliser une palette de couleur qui me permet de dessiner avec la souris en fonction de la couleur choisie. J'ai fait un GridLayout avec 4 couleurs (JButton) pour cet exemple. Mon but est de sélectionner un bouton et de pouvoir dessiner avec la souris dans le panelCENTER.
Je ne sais pas si je dois faire correspondre les boutons avec des ActionListener ou des MouseMotionListener. Est-ce que quelqu'un arriverait à me donner quelques conseils svp? MERCI ;)

Voici le commencement:
Code:

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 public class Paint extends JDialog { private JPanel panCenter = new JPanel(); private JPanel panWest = new JPanel(); private JButton buttonRED = new JButton(); private JButton buttonGREEN = new JButton(); private JButton buttonYELLOW = new JButton(); private JButton buttonPINK = new JButton(); public Paint(){ setSize(400,400); setLocationRelativeTo(null); //panel CENTER panCenter.setBackground(Color.WHITE); add(panCenter, BorderLayout.CENTER); //panl WEST panWest.setLayout(new GridLayout(2, 2)); panWest.add(buttonRED); panWest.add(buttonGREEN); panWest.add(buttonYELLOW); panWest.add(buttonPINK); add(panWest, BorderLayout.WEST); //buttons buttonRED.setBackground(Color.RED); buttonGREEN.setBackground(Color.GREEN); buttonYELLOW.setBackground(Color.YELLOW); buttonPINK.setBackground(Color.PINK); } public static void main(String[] args) { Paint p = new Paint(); p.setVisible(true); } }

11/05/2015, 16h25
joel.drigo

Salut,

Pour réagir au clic sur les boutons, pour changer de couleur, il faut utiliser un ActionListener. Tu auras tout simplement intérêt à faire une classe interne qui aura en paramètre la couleur. On pourrait utiliser directement le background du bouton, mais, on ne sait jamais, pour des raisons de visibilité/lisibilité, on pourra avoir besoin de différencier la couleur affichée dans le bouton de celle réellement utilisée pour dessiner. A moins que tu utilises directement les lamdas-expression de Java 8, ce qui te permettra directement d'affecter la couleur de dessin (on pourrait, par exemple, avoir une classe dédiée qui étend JPanel pour faire la partie dessin, et qui a une méthode setDrawingColor(Color color))

Le MouseMotionListener, quant à lui, sera, avec un MouseListener, adapté au dessin dans ce panel (voir la classe java.awt.event.MouseAdapter qui combine déjà les deux, plus la gestion de la molette).

Merci pour ta réponse rapide.

Voila où j'en suis maintenant:

Code:

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
public class Paint extends JDialog {
 
	PanelPaint p = new PanelPaint(); // j'appelle la class PanelPaint
 
	private JPanel panCenter = new JPanel();
	private JPanel panWest = new JPanel();
 
	private JButton buttonRED = new JButton();
	private JButton buttonGREEN = new JButton();
	private JButton buttonYELLOW = new JButton();
	private JButton buttonPINK = new JButton();
 
	public Paint(){
		setSize(400,400);
		setLocationRelativeTo(null);
 
		//panel CENTER
		p.setBackground(Color.WHITE);
		add(p, BorderLayout.CENTER);
 
		//panl WEST
		panWest.setLayout(new GridLayout(2, 2));
		panWest.add(buttonRED);
		panWest.add(buttonGREEN);
		panWest.add(buttonYELLOW);
		panWest.add(buttonPINK);
		add(panWest, BorderLayout.WEST);
 
		//buttons
		buttonRED.setBackground(Color.RED);
		buttonGREEN.setBackground(Color.GREEN);
		buttonYELLOW.setBackground(Color.YELLOW);
		buttonPINK.setBackground(Color.PINK);
 
		//functionality 
		buttonRED.addActionListener(new buttonREDClick());
 
	}
 
	class buttonREDClick implements ActionListener{
		public void actionPerformed(ActionEvent e) {
			p.setForeground(Color.RED);
		}
	}
 
	public static void main(String[] args) {
 
		Paint p = new Paint();
		p.setVisible(true);
	}
 
}

Ci dessous, mon autre classe PanelPaint:

Code:

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 PanelPaint extends JPanel{
 
	private int pointCount=0;
 
	//array of 10000java.awt.Point references
	private Point[]points = new Point[10000];
 
	public PanelPaint(){
		addMouseMotionListener(
				new MouseMotionAdapter(){
					public void mouseDragged(MouseEvent event){
						if(pointCount<points.length){
							points[ pointCount ] = event.getPoint(); // find point
							++pointCount; // increment number of points in array
							repaint(); // repaint JFrame
						} // end if
					} // end method mouseDragged
				}
				);
	}
	// draw ovals in a 4-by-4 bounding box at specified locations on window
	public void paintComponent( Graphics g )
	{
		super.paintComponent( g ); // clears drawing area
 
		// draw all points in array
		for ( int i = 0; i < pointCount; i++ )
			g.fillOval( points[i].x, points[i].y, 4, 4 );
	} // end method paintComponent
} // end class PaintPanel

Le problème est que maintenant, quand je sélectionne une couleur (le rouge car c'est le seul qui a un ActionListener pour le moment), tout le dessin se change en rouge. Si je dessine en noir et que je veux passer en rouge, tout en gardant ce que j'ai dessiné en noir, comment dois-je procéder?
Merci beaucoup de votre aide =)

Normal, il faut indiquer la couleur avant de dessiner, où j'ai mis le "ICI" :

Code:

1
2
3
4
5
6
7
8
9
10
11
protectedvoid paintComponent( Graphics g )
	{
		super.paintComponent( g ); // clears drawing area
 
		// draw all points in array
		for ( int i = 0; i < pointCount; i++ )
 
                        g.setColor( ICI );
 
			g.fillOval( points[i].x, points[i].y, 4, 4 );
	} // end method paintComponent

Evidemment, tu vois tout de suite qu'il faudrait stocker la couleur de dessin au même titre que le point au moment du dessin (stocker la couleur courant choisie pour chaque point). Tu peux bien sur la stocker dans un second tableau, mais tu peux faire aussi, plus judicieusement une classe spéciale, tout simple :

Code:

1
2
3
4
5
6
7
8
9
10
public class DrawingPoint {
    public int x;
    public int y;
    public Color color;
    public DrawingPoint(Point point, Color color) {
          this.color=color;
          this.x=point.x;
          this.y=point.y;
    }
}

De plus, je t'ai dit d'utiliser une méthode setDrawingColor sur ton panel : setForeground() permet d'affecter la couleur de foreground. Déjà, il faut l'utiliser volontairement dans un JPanel (on pourrait faire dans paintComponent un g.setColor(getForeground())) mais en plus il ne peut y avoir qu'un seul foreground à la fois, donc ça voudrait dire que tous les points ont la même couleur, et que changer la couleur change la couleur de tous les points, or je ne pense pas que c'est ce que tu veux.

Donc :

Code:

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
public class PanelPaint extends JPanel{
 
	private int pointCount=0;
        private Color currentColor;
 
	//array of 10000java.awt.Point references
	private DrawingPoint []points = new DrawingPoint [10000];
 
	public PanelPaint(){
		addMouseMotionListener(
				new MouseMotionAdapter(){
					public void mouseDragged(MouseEvent event){
						if(pointCount<points.length){
							points[ pointCount ] = new DrawingPoint (event.getPoint(), currentColor ); // find point
							++pointCount; // increment number of points in array
							repaint(); // repaint JFrame
						} // end if
					} // end method mouseDragged
				}
				);
	}
	// draw ovals in a 4-by-4 bounding box at specified locations on window
	public void paintComponent( Graphics g )
	{
		super.paintComponent( g ); // clears drawing area
 
		// draw all points in array
		for ( int i = 0; i < pointCount; i++ )
                        g.setColor( points[i].color );
			g.fillOval( points[i].x, points[i].y, 4, 4 );
	} // end method paintComponent
 
        // la méthode dont je te parlais, qu'il faut appeler dans l'ActionListener, mais aussi au moins une fois au début pour initialiser la première couleur
        public void setDrawingColor(Color color) {
               currentColor=color;
        }
 
 
 
 
} // end class PaintPanel

Ensuite, ton actionListener :

Code:

1
2
3
4
5
class buttonREDClick implements ActionListener{
		public void actionPerformed(ActionEvent e) {
			p.setDrawingColor(Color.RED);
		}
	}

Tout simplement.

Moi, je ferais même :

Code:

1
2
3
4
5
6
7
8
9
class ColorActionListener implements ActionListener{
                private final Color color;
                public ColorActionListener(Color color) {
                       this.color=color;
                }
		public void actionPerformed(ActionEvent e) {
			p.setDrawingColor(color);
		}
	}

Et :

Code:

1
2
3
4
buttonRED.addActionListener(new ColorActionListener(Color.RED));
buttonGREEN.addActionListener(new ColorActionListener(Color.GREEN));
buttonYELLOW.addActionListener(new ColorActionListener(Color.YELLOW));
buttonPINK.addActionListener(new ColorActionListener(Color.PINK));

En Java 8, il n'y a même plus besoin de la classe ColorActionListener :

Code:

1
2
3
4
buttonRED.addActionListener(e-> p.setDrawingColor(Color.RED));
buttonGREEN.addActionListener(e-> p.setDrawingColor(Color.GREEN));
buttonYELLOW.addActionListener(e-> p.setDrawingColor(Color.YELLOW));
buttonPINK.addActionListener(e-> p.setDrawingColor(Color.PINK));

A noter, que dessiner le point par g.fillOval( points[i].x, points[i].y, 4, 4 ); dessine les points décalés ! Peut-être au moins g.fillOval( points[i].x-2, points[i].y-2, 4, 4 );, non ?

12/05/2015, 08h27
maxa88

Magnifique, ton code est super merci beaucoup !
Tout marche à merveille. Et oui, maintenant le dessin avec la souris n'est plus décalé.
Merci beaucoup pour ton aide :)