Discussion :

[Flophx]

Bonjour à tous,

cela fait maintenant quelques années que j'utilise Java SWING, et que (j'espère) améliorer ma technique de programmation sur les interfaces graphiques (merci à Gfx pour ces tutoriels, à Sinok, etc.. tous ceux qui ont de la patience avec nous...), et si celui-ci convient bien pour les boutons, les tables etc... et pour des dessins statiques, je me heurte aujourd'hui à des problèmes pour des interfaces que je qualifierai de "compliquées" (voir les pièces jointes).

Je demande donc aux spécialistes si ce type d'interface où les éléments nécessitent en permanence de recalculer et de redessiner dans plusieurs panels pour mettre à jour les données recues est vraiment dans les cordes de Java Swing.

Je n'ai pas trouvé de cas vraiment intéressant sur les forums sur ce type de problématique, et j'en viens même à me demander si mes desiderata sont réalisables (et oui, moment de doute)..

Comme alternative, existe-t-il des petits "moteurs graphiques" 2D chargeables pour java et gérer ce type d'application??

Voilà, tout réflexion philosophique ou constructive, cas personnels, liens, tout autre chose, sera le bienvenu.

Passez de bonnes Fêtes,

Florian

[eclesia]

oui c'est réalisable avec Swing (Java2D plus exactement)

cf : http://java.sun.com/docs/books/tutorial/2d/index.html

mais je penses qu'on a deja du te donner ce lien.

[Flophx]

Merci pour le lien, non, je ne me rappelle pas, mais il va beaucoup me servir ce lien...

En revanche, j'ai une question d'ordre plus "pratique". Dans la deuxième image que j'ai donnée, la partie centrale (l'horizon artificel pour les ptits gars de l'aviation), est une partie dont la taille est "fixe", dans le sens où il y a une rotation et une translation "max".

La question est: pour ce type de composant, vaut il mieux le créer à part (type paint), et le charger en tant qu'image puis lui appliquer des transformations, ou utiliser java2D, faire des calculs et redessiner??

Que feriez vous vous??

[eclesia]

c'est a toi de voir.

si tu le fais en Java2D, tu le dessine une seule fois dans un BufferedImage et redessine toujours le meme BufferedImage apres.

La solution de l'image est tout aussi valable dans ce cas.

[Flophx]

Histoire d'illustrer mes propos, je vous donne ici le code de mes deux classes permettant d'afficher un anémomètre. Si vous avez des idées pour que ce système composé d'un cadran et d'une aiguille soit le plus efficace possible en terme de mémoire et d'affichage, i.e si vous voyez des choses qui vous choquent et qui méritent d'être corrigée...

Classe Anemometre:

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
 
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
 
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
 
/**
 * @author  Florian
 */
public class Anemometre extends JPanel {
 
	/**
         * 
         */
	private static final long serialVersionUID = 1L;
	private Aiguille indicVitesse;
	private int[][] positionDepart={{95,100},{105,100},{100,0}};
	private double v=0.0;
	private double angleV=Math.PI/120;
 
	public Anemometre(int x, int y, int longueur, int hauteur){
		this.setBounds(x,y, longueur, hauteur);
		indicVitesse= new Aiguille(positionDepart);
	}
 
	public void paintComponent(Graphics g)
	{
		super.paintComponent(g);
 
		if (SwingUtilities.isEventDispatchThread()){
			System.out.println("Dans EDT, Anemometre");
		} else {System.out.println("Pas EDT, Anemometre");}
 
		Graphics2D comp2D=(Graphics2D) g;
		comp2D.setRenderingHint(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_ON);
		comp2D.setColor(Color.black);
		comp2D.fillOval(1,1,200,200);
		comp2D.setColor(Color.white);
		comp2D.fillArc(10, 10, 180, 180, -165+90, +105);
		comp2D.setColor(Color.green);
		comp2D.fillArc(20, 20, 160, 160, -217+90, 147);
		comp2D.setColor(Color.orange);
		comp2D.fillArc(20, 20, 160, 160, -270+90, 53);
		comp2D.setColor(Color.black);
		comp2D.fillArc(20, 20, 160, 160, -75+90, 147);
		comp2D.setColor(Color.black);
		comp2D.fillArc(30,30,140,140, 0, 360);
		comp2D.setColor(Color.white);
 
		for (int i=40;i<210;i=i+10) 
		{
			comp2D.setFont(new java.awt.Font("Comic Sans MS", java.awt.Font.BOLD, 8));
			comp2D.drawString(String.valueOf(i),
					100+(int) ((70+(2*i)/40)*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (70*Math.sin(-Math.PI/2+i*3*Math.PI/360)));
			if(i==180){
				comp2D.setColor(Color.red);
				comp2D.drawLine(100+(int) (80*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
						100+(int) (80*Math.sin(-Math.PI/2+i*3*Math.PI/360)),
						100+(int) (100*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
						100+(int) (100*Math.sin(-Math.PI/2+i*3*Math.PI/360)));
				comp2D.setColor(Color.white);
			}
			else{
			comp2D.drawLine(100+(int) (80*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (80*Math.sin(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (100*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (100*Math.sin(-Math.PI/2+i*3*Math.PI/360)));}
		}
		for (int i=45;i<205;i=i+10) 
		{
			comp2D.drawLine(100+(int) (90*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (90*Math.sin(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (100*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
					100+(int) (100*Math.sin(-Math.PI/2+i*3*Math.PI/360)));
		}
 
		indicVitesse.Rotation(v*angleV);
		indicVitesse.affichageEcran(comp2D);
 
	}
 
	/**
         * @return
         * @uml.property  name="v"
         */
	public double getV() {
		return v;
	}
 
	/**
         * @param v
         * @uml.property  name="v"
         */
	public void setV(double v) {
		this.v = v;
	}
 
	public static void main(String []args){
		JFrame fenetre=new JFrame("Anémomètre");
		fenetre.setBounds(0,0,200, 200);
		Anemometre anemometre = new Anemometre(50, 50, 100, 100);
		fenetre.add(anemometre);
		fenetre.setVisible(true);
 
	}
 
 
}

Classe Aiguille:

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
 
import java.awt.Color;
import java.awt.Graphics2D;
 
 
/**
 * @author  Florian
 */
public class Aiguille 
	{
        private int[] pointsX=new int[3];
        private int[] pointsY=new int[3];
        private int[] coorX=new int[3];
        private int[] coorY=new int[3];
 
        //Constructeur
        public Aiguille(int[][] coordonnees)
        {
            for (int i=0;i<3;i++) 
			{
                pointsX[i]=coordonnees[i][0];
                pointsY[i]=coordonnees[i][1];
                coorX[i]=coordonnees[i][0];
                coorY[i]=coordonnees[i][1];
            }
        }
 
        //Permet de recalculer le nouvel angle correspondant à une valeur donnée
        public void Rotation(double angle)
        {   
			double[] resultat=new double[2];
            for (int i=0;i<3;i++) 
			{
                resultat[0]=(double) (coorX[i]-100)*Math.cos(angle)
				-(double) (coorY[i]-100)*Math.sin(angle)+100;
                resultat[1]=(double) (coorX[i]-100)*Math.sin(angle)
				+(double) (coorY[i]-100)*Math.cos(angle)+100;
                pointsX[i]=(int) resultat[0];
                pointsY[i]=(int) resultat[1];
            }
        }
 
        //Méthode d'affichage à l'écran
        public void affichageEcran(Graphics2D g){
        	g.setColor(Color.white);
    		g.fillPolygon(pointsX,pointsY,3);
    		g.setColor(Color.black);
    		g.drawPolygon(pointsX,pointsY,3);
        }
 
		/**
                 * @return
                 * @uml.property  name="pointsX"
                 */
		public int[] getPointsX() {
			return pointsX;
		}
 
		/**
                 * @return
                 * @uml.property  name="pointsY"
                 */
		public int[] getPointsY() {
			return pointsY;
		}
 
    }

Normalement ce code est testable, il suffit de recopier les classes et d'exécuter le main de la classe Anemometre.

J'attends vos commentaires et amélirations/optimisations!!
Merci

[McFoggy]

Salut,

Pour voir le rendu et la rapidité d'affichage j'ai ajouté un slider pour faire bouger l'aiguille. Ca répond bien.
Maintenant je me dis que en terme d'optimisation, une des premières choses qui me vient à l'esprit est de ne pas recalculer le cadran à chaque repaint. Pour celà il suffit que tu le dessines dans une Image e que le repaint de l'anémomètre consiste juste à dessiner l'image et dessiner l'aiguille. Ce sera encore plus rapide à mon avis.

Anémomètre

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
package test;
 
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
 
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
 
/**
 * @author  Florian
 */
public class Anemometre extends JPanel {
 
    /**
     * 
     */
    private static final long serialVersionUID = 1L;
    private Aiguille indicVitesse;
    private int[][] positionDepart={{95,100},{105,100},{100,0}};
    private double v=0.0;
    private double angleV=Math.PI/120;
 
    public Anemometre(int x, int y, int longueur, int hauteur){
        this.setBounds(x,y, longueur, hauteur);
        indicVitesse= new Aiguille(positionDepart);
    }
 
    public void paintComponent(Graphics g)
    {
        super.paintComponent(g);
 
        if (SwingUtilities.isEventDispatchThread()){
            System.out.println("Dans EDT, Anemometre");
        } else {System.out.println("Pas EDT, Anemometre");}
 
        Graphics2D comp2D=(Graphics2D) g;
        comp2D.setRenderingHint(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_ON);
        comp2D.setColor(Color.black);
        comp2D.fillOval(1,1,200,200);
        comp2D.setColor(Color.white);
        comp2D.fillArc(10, 10, 180, 180, -165+90, +105);
        comp2D.setColor(Color.green);
        comp2D.fillArc(20, 20, 160, 160, -217+90, 147);
        comp2D.setColor(Color.orange);
        comp2D.fillArc(20, 20, 160, 160, -270+90, 53);
        comp2D.setColor(Color.black);
        comp2D.fillArc(20, 20, 160, 160, -75+90, 147);
        comp2D.setColor(Color.black);
        comp2D.fillArc(30,30,140,140, 0, 360);
        comp2D.setColor(Color.white);
 
        for (int i=40;i<210;i=i+10) 
        {
            comp2D.setFont(new java.awt.Font("Comic Sans MS", java.awt.Font.BOLD, 8));
            comp2D.drawString(String.valueOf(i),
                    100+(int) ((70+(2*i)/40)*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (70*Math.sin(-Math.PI/2+i*3*Math.PI/360)));
            if(i==180){
                comp2D.setColor(Color.red);
                comp2D.drawLine(100+(int) (80*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                        100+(int) (80*Math.sin(-Math.PI/2+i*3*Math.PI/360)),
                        100+(int) (100*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                        100+(int) (100*Math.sin(-Math.PI/2+i*3*Math.PI/360)));
                comp2D.setColor(Color.white);
            }
            else{
            comp2D.drawLine(100+(int) (80*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (80*Math.sin(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (100*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (100*Math.sin(-Math.PI/2+i*3*Math.PI/360)));}
        }
        for (int i=45;i<205;i=i+10) 
        {
            comp2D.drawLine(100+(int) (90*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (90*Math.sin(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (100*Math.cos(-Math.PI/2+i*3*Math.PI/360)),
                    100+(int) (100*Math.sin(-Math.PI/2+i*3*Math.PI/360)));
        }
 
//        indicVitesse.Rotation(v*angleV);
        indicVitesse.affichageEcran(comp2D);
 
    }
 
    /**
     * @return
     * @uml.property  name="v"
     */
    public double getV() {
        return v;
    }
 
    /**
     * @param v
     * @uml.property  name="v"
     */
    public void setV(double v) {
        this.v = v;
    }
 
    public static void main(String []args){
        JFrame fenetre=new JFrame("Anémomètre");
        fenetre.setBounds(0,0,200, 200);
        Anemometre anemometre = new Anemometre(50, 50, 100, 100);
        fenetre.getContentPane().setLayout(new BorderLayout());
        fenetre.getContentPane().add(anemometre, BorderLayout.CENTER);
        fenetre.getContentPane().add(new Controleur(anemometre), BorderLayout.SOUTH);
        fenetre.pack();
        fenetre.setVisible(true);
    }
 
    public Aiguille getIndicVitesse() {
        return indicVitesse;
    }
}

Le slider de controle:

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
package test;
 
import javax.swing.JPanel;
import javax.swing.JSlider;
import javax.swing.event.ChangeEvent;
import javax.swing.event.ChangeListener;
 
public class Controleur extends JPanel implements ChangeListener {
    private Anemometre anemometre;
    private JSlider s;
    int oldAngle = 0;
 
    public Controleur(Anemometre anemometre) {
        this.anemometre = anemometre;
 
        addComponents();
    }
 
    private void addComponents() {
        s = new JSlider(0,360);
        s.setValue(0);
        s.addChangeListener(this);
        add(s);
    }
 
    public void stateChanged(ChangeEvent e) {
        JSlider src = (JSlider)e.getSource();
        int newAngle = src.getValue();
        double rotation = Math.toRadians(newAngle - oldAngle);
        System.out.println(rotation);
        anemometre.getIndicVitesse().Rotation(rotation);
        anemometre.repaint();
    }
}

Bon courage pour la suite.

[dinobogan]

Entièrement d'accord : il ne faut pas surcharger la méthode paintComponent. L'EDT (Thread qui s'occupe des évènements et de la partie graphique) n'est pas multithreadé. Si le traitement est lourd dans cette méthode, c'est toute ton appli qui va en patir.
Il est préférable de calculer un java.awt.image.BufferedImage lorsque c'est nécessaire, et la méthode paintComponent se borne à afficher une image.
De plus, tu ne sera pas obliger de recalculer toute ton image à chaque fois, seule la partie qui bouge pourra être modifiée.
Après, pour les problématique de scintillement ou de zone noire furtive, il faut bufferiser.

[bouye]

Oui il s'agit a chaque fois de trouver le bon compris entre la rapidite d'execution (le nombre d'operations 2D effectuees a chaque rendu) et la taille memoire allouees (plus il y a d'images intermediaires, plus tu utilises de memoire). Une bonne partie du HUD ne bouge jamais (contours des jauges, lignes en overlay sur l'horizon artificiel, etc...) et semble etre un bon candidat pour ce genre de choses. Concernant les jauges a toi de voir si tu veux les redessiner entierement ou au contraire afficher une sous-image d'une image de jauge pre-dessinnee.

Une bonne technique d'optimisation est d'appeller repaint(x, y, w, h) uniquement sur les zones a repeindre et puis dans la methode le rendu de verifier que ce qu'on est en train de dessiner se trouve bien dans la zone de clip, ce qui eviter de dessiner des choses inutiles.

Je te conseille la lecture de Filthy Rich Clients (livre en anglais uniquement, voir aussi http://filthyrichclients.org/) de Chet Haase et Romain Guy (gfx sur ce forum) pour des infos et des conseils de bonne pratique + des astuces pour avoir des bon rendus graphiques.

[lachesis]

Flophx,

tu serais pas sur Airlab toi par hasard ??

[Flophx]

Non, pas du tout, juste un étudiant en aéronautique spécialisé en info qui effectue un travail de chaine d'acquisition capteurs/vidéos + logiciel de dépouillement pour un avion de voltige d'un aéroclub toulousain