Dessiner sur un JPanel

**bernidupont** · 21/07/2016, 11h53

Bonjour,

après plusieurs heures de recherche je me décide de mettre un message pour solliciter un coup de pouce.

Je souhaiterais dessiner avec ma souris sur un JPanel et sauvegarder mon image dessinée.
J'ai réussi à dessiner sur mon JPanel mais la méthode utilisée ne doit pas être bonne puisque je n'arrive pas à récupérer le graphique dessiné au moment de la sauvegarde.

Voici ma classe "MonDessin" qui permet de dessiner sur mon JPanel et de sauvegarder l'image via le bouton "Enregistrer".

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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
 
 
import javax.imageio.ImageIO;
import javax.swing.*;
import java.awt.*;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.MouseMotionListener;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
 
 
public class MonDessin extends JFrame {
 
    private JPanel monPanel;
    private int xPressed, xDragged, yPressed, yDragged;
    private boolean isActive = false;
 
    public MonDessin() {
 
        this.setTitle("Test");
        this.setSize(800, 800);
        this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
 
 
        JPanel container = new JPanel ();
 
 
        monPanel = new JPanel();
        monPanel.setPreferredSize(new Dimension(150, 75));
        monPanel.setBackground(Color.WHITE);
 
        monPanel.addMouseMotionListener(
                new MouseMotionListener() {
 
                    public void mouseDragged(MouseEvent e) {
 
                        if (isActive) {
 
                            xPressed = xDragged;
                            yPressed = yDragged;
 
                            xDragged = e.getXOnScreen();
                            yDragged = e.getYOnScreen();
 
                            repaint();
                        }
                    }
 
                    public void mouseMoved(MouseEvent e) {
 
                        isActive = true;
                    }
                }
        );
        monPanel.addMouseListener(
                new MouseListener() {
 
                    //  Invoked when a mouse button has been pressed on a component.
                    public void mousePressed(MouseEvent e) {
 
                        if (isActive) {
 
                            xPressed = e.getXOnScreen();
                            yPressed = e.getYOnScreen();
                            xDragged = xPressed;
                            yDragged = yPressed;
 
                            repaint();
                        }
                    }
 
                    //Invoked when the mouse has been clicked on a component.
                    public void mouseClicked(MouseEvent e) {
                    }
 
                    //Invoked when a mouse button has been released on a component.
                    public void mouseReleased(MouseEvent e) {
                    }
 
                    //Invoked when the mouse enters a component.
                    public void mouseEntered(MouseEvent e) {
 
                        isActive = true;
                        xDragged = e.getXOnScreen();
                        yDragged = e.getYOnScreen();
                    }
 
                    //Invoked when the mouse exits a component.
                    public void mouseExited(MouseEvent e) {
 
                        isActive = false;
                    }
                }
        );
 
        container.add(monPanel);
 
        JButton b_enregistrer = new JButton("Enregistrer");
        b_enregistrer.setPreferredSize(new Dimension(200, 55));
        b_enregistrer.addActionListener(
                f -> {
                    try {
                        BufferedImage bimage = new BufferedImage(150, 75, BufferedImage.TYPE_INT_RGB);
                        monPanel.paint(bimage.getGraphics());
                        Graphics g = bimage.getGraphics();
                        g.setColor(monPanel.getForeground());
                        g.setFont(monPanel.getFont());
                        ImageIO.write(bimage, "JPEG", new File("MonDessin.jpg"));
                    } catch (IOException ex) {
                        ex.printStackTrace();
                    }
                }
        );
 
        container.add(b_enregistrer);
 
        this.setContentPane(container);
    }
 
 
    @Override
    public void paint(Graphics g) {
 
        int offsetX = 1;
        int offsetY = 25;
 
        if (!isActive) {
            super.paint(g);
        } else {
            g.drawLine(xPressed - offsetX, yPressed - offsetY, xDragged - offsetX, yDragged - offsetY);
        }
    }
 
}

Pourriez-vous me dire où cela cloche svp ?

Berni.

**joel.drigo** · 21/07/2016, 12h04

Salut,

Ce qu'on dessine dans le contexte graphique d'un panel n'est mémorisé que le temps d'un affichage (en gros un appel de paint). Et c'est mémoriser dans le contexte graphique (l'instance de Graphics), donc appeller paint une nouvelle fois avec une autre instance (dans ton cas celle obtenue pour l'image à sauvegarder) ne peut que rien dessiner.

La solution la plus simple est de faire l'inverse : avec ta souris, tu dessines dans le contexte graphique de l'image (la BufferedImage) et tu l'affiches dans le fond de ton JPanel. Ainsi, tu peux sauvegarder l'image à tout moment.

**bernidupont** · 21/07/2016, 12h55

Merci pour ta réponse joel.drigo.

En reprenant la code ci-dessus, je l'ai juste modifié en ajoutant 2 variables à ma classe :

Code :

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

1
2
  BufferedImage monImage = new BufferedImage(150, 75, BufferedImage.TYPE_INT_RGB);
  Graphics monGraphique = monImage.createGraphics();

Et à la place d'appeler la méthode "repaint()" dans les listeners, j'appelle ma propre méthode "dessiner()" prenant en paramètre la variable globale "monGraphique" :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 public void dessiner(Graphics g) {
 
        int offsetX = 1;
        int offsetY = 25;
 
        g.setColor(Color.black);
        g.drawLine(xPressed - offsetX, yPressed - offsetY, xDragged - offsetX, yDragged - offsetY);
 
       // monPanel.paint(g);
        monPanel.paintComponents(g);
        monPanel.repaint();
    }

Malheureusement, malgré l'appelle de la méthode repaint(), rien ne s'affiche. Aurais-tu une idée du problème ?

**joel.drigo** · 21/07/2016, 14h27

Je n'avais pas regardé tout ton code. Il y a d'autres problèmes dans la gestion des événements souris (pour la gestion du booléen, ce n'est pas tant le entered qui compte, mais le pressed/released/dragged (pressed= on commence à dessiner = on pose le crayon, released = on arrête le dessin = on lève le crayon, dragged = on bouge le crayon et donc ça dessine entre la position précédente et la nouvelle )), la gestion des coordonnées (pourquoi travailler en coordonnées écran, alors que c'est plus simple de gérer des coordonnées relatives à l'espace de dessin), dans le paint() également (que tu as mis sur la fenêtre et pas sur le panel, sans parler du super qui n'est pas appelé tout le temps).

Il faudrait revoir tout ça (rendre un JPanel dessinable et ne pas faire ça au niveau de la fenêtre), mais je n'ai pas le temps maintenant (j'ai peut-être un exemple dans une vieille discussion, je verrais si je le retrouve). En attendant, j'ai bricolé vite fait ton code pour que ça fonctionne :

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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
public class MonDessin extends JFrame {
 
   private JPanel monPanel;
   private int xPressed, xDragged, yPressed, yDragged;
   private boolean isActive = false;
   private boolean drawing = false;
   private BufferedImage bimage;
 
   public MonDessin() {
 
       this.setTitle("Test");
       this.setSize(800, 800);
       this.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
 
 
       JPanel container = new JPanel ();
 
       bimage = new BufferedImage(150, 75, BufferedImage.TYPE_INT_RGB);
 
       monPanel = new JPanel() {
 
    	   @Override
    	   public void paint(Graphics g) {
 
    	           super.paint(g);
 
    	           g.drawImage(bimage, 0, 0, null);
 
    	           if ( drawing ) {
    	        	   g.setColor(Color.RED);
    	        	   g.drawLine(xPressed , yPressed , xDragged , yDragged );
    	        	   g.fillOval(xDragged -3, yDragged -3, 6, 6);
    	           }
 
    	   }
 
       };
       monPanel.setPreferredSize(new Dimension(150, 75));
       monPanel.setBackground(Color.WHITE);
       resetImage();
 
       monPanel.addMouseMotionListener(
               new MouseMotionListener() {
 
                   public void mouseDragged(MouseEvent e) {
 
                       if (isActive) {
 
 
                    	   paintImage();
                           xPressed = xDragged;
                           yPressed = yDragged;
 
                           xDragged = e.getX();
                           yDragged = e.getY();
 
                           monPanel.repaint();
                       }
                   }
 
                   public void mouseMoved(MouseEvent e) {
 
                       isActive = true;
                   }
               }
       );
       monPanel.addMouseListener(
               new MouseListener() {
 
                   //  Invoked when a mouse button has been pressed on a component.
                   public void mousePressed(MouseEvent e) {
 
                       if (isActive) {
 
                    	   drawing=true;
                           xPressed = e.getX();
                           yPressed = e.getY();
                           xDragged = xPressed;
                           yDragged = yPressed;
 
                           monPanel.repaint();
                       }
                   }
 
                   //Invoked when the mouse has been clicked on a component.
                   public void mouseClicked(MouseEvent e) {
                   }
 
                   //Invoked when a mouse button has been released on a component.
                   public void mouseReleased(MouseEvent e) {
                	   drawing=false;
                	   paintImage();
                   }
 
                   //Invoked when the mouse enters a component.
                   public void mouseEntered(MouseEvent e) {
 
                       isActive = true;
                   }
 
                   //Invoked when the mouse exits a component.
                   public void mouseExited(MouseEvent e) {
 
                       isActive = false;
                   }
               }
       );
 
       container.add(monPanel);
 
       JButton b_enregistrer = new JButton("Enregistrer");
       b_enregistrer.setPreferredSize(new Dimension(200, 55));
       b_enregistrer.addActionListener(
               f -> {
                   try {
                       ImageIO.write(bimage, "JPEG", new File("MonDessin.jpg"));
                       // Desktop.getDesktop().open(new File("MonDessin.jpg")); // pour test visuel
                   } catch (IOException ex) {
                       ex.printStackTrace();
                   }
               }
       );
 
       container.add(b_enregistrer);
 
       JButton b_effacer = new JButton("Effacer");
       b_effacer.setPreferredSize(new Dimension(200, 55));
       b_effacer.addActionListener(
               f -> {
                   resetImage();
                   monPanel.repaint();
               }
       );
 
       container.add(b_enregistrer);
       container.add(b_effacer);
 
       this.setContentPane(container);
   }
 
   private void paintImage() {
	  	   Graphics2D g = bimage.createGraphics();
		   g.setColor(Color.BLACK);
		   g.drawLine(xPressed , yPressed , xDragged , yDragged );
           g.dispose(); 
           monPanel.repaint();
   }
 
   private void resetImage() {
       Graphics2D g = bimage.createGraphics();
       g.setColor(monPanel.getBackground());
       g.fillRect(0, 0, monPanel.getPreferredSize().width, monPanel.getPreferredSize().height);
       g.dispose(); 
   }
 
 
 
   public static void main(String[] args) {
	   new MonDessin().setVisible(true);
   }
 
}

**bernidupont** · 21/07/2016, 15h11

Merci de ta réponse joel.drigo.

Je vais regarder un peu plus en détail commence marche le repaint pour comprendre ce qui clochait par rapport à mon deuxième message.
En attendant, les améliorations que tu as apportées fonctionnent et je vais me calquer dessus.
Merci beaucoup pour ton aide,

A bientôt,
berni.

Dessiner sur un JPanel

2D Java

Vue hybride

Discussions similaires

Partager

Partager