Création de tableaux (JTable) avec Swing [Tutoriel]

**Baptiste Wicht** · 20/12/2009, 22h50

Bonsoir,

Je viens de finir un tutoriel Java sur Swing : Création interface graphique avec Swing : les tableaux (JTable)

Je tente d'expliquer les différents concepts liés à l'utilisation de tableaux en Swing. Dans cet article, nous verrons donc les concepts de base du composant JTable, la définition de modèle de tableaux, la modification dynamique du contenu du tableau, la façon de modifier l'affichage des différentes cellules du tableau, la modification directe du contenu du tableau et finalement le tri et le filtrage du tableau.

En espérant qu'il vous soit utile

Baptiste Wicht

**nicorama** · 22/12/2009, 09h51

Pas mal de fonctionnalité, avec du bon code réutilisable. Beau travail !

J'en profite quand même pour réintroduire mon vieil article sur les JTables, plus court, et différent (moins de fonctionnalités, et un poil plus de TableColumn et Events).

J'adore la programmation Swing, c'est très agréable à programmer. Dommage que ce soit obsolète pour x raisons étranges.

**vintz72** · 22/12/2009, 10h44

Envoyé par nicorama

Pas mal de fonctionnalité, avec du bon code réutilisable. Beau travail !
[...]
J'adore la programmation Swing, c'est très agréable à programmer. Dommage que ce soit obsolète pour x raisons étranges.

Bien d'accord pour le premier point.
Pour le second... bof. J'avoue que je m'y suis habitué, et il y a des aspects sympas, mais en somme, je trouve quand même plutôt lourd le Swing. Il faut souvent parcourir plusieurs objets avant d'obtenir une information triviale (ex récent pour moi: je voulais définir un renderer spécial sur une colonne donnée. Le faire pour une classe donnée n'était pas possible étant donné que plusieurs colonnes sont de type "Date". Et bien il faut éplucher la Javadoc pour trouver qu'il faut passer par le TableModel pour récupérer la bonne colonne ! J'ai eu des exemples pires, mais je ne me rappelle plus en détail). En outre, il manque une vision haut niveau du paradigme MVC. J'utilise un framework propriétaire pour palier cela, mais de base, Swing, ça manque quand même de beaucoup de choses.
A sa décharge, il est vrai qu'il est plus ou moins abandonné par Sun au profit de JavaFX... le même tutoriel (sur les JTable) avec ce dernier serait intéressant !

**gogy1984** · 22/12/2009, 12h39

Bonjour,

Pour mon projet, je galère un peu avec ces fameuses jTable ;o)

Bon boulot !

**farnulfo** · 22/12/2009, 23h46

Merci pour l'article.

La lecture du code source de la démo Swing fourni avec le JDK est aussi intéressante. C'est aussi dispo en Web Start sur : https://swingset3.dev.java.net .

**adiGuba** · 23/12/2009, 17h40

Salut,

Très bon article sur les JTables ! Cela manquait

J'ai deux petites remarques (mais c'est vraiment des bricoles --- j'aime bien chipoté

) :

Tu peux éviter de supprimer le texte des cellule avec setText("") tout simplement en évitant de passer "value" à la méthode parente, par exemple :

Code :

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

1
2
3
4
5
6
7
8
class ColorCellRenderer extends DefaultTableCellRenderer {
    @Override
    public Component getTableCellRendererComponent(JTable table, Object value, boolean isSelected, boolean hasFocus, int row, int column) {
        super.getTableCellRendererComponent(table, null, isSelected, hasFocus, row, column);
        setBackground( (Color)value );
        return this;
    }
}

Dans ton SexeCellRenderer tu précharges une fois pour toute les images pour éviter de les recréer à chaque appel. C'est bien mais on pourrait faire la même chose dans le BoldCellRenderer pour éviter de multiplier les créations de Font dérivée :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
public class BoldCellRenderer extends DefaultTableCellRenderer {
 
	private final Font boldFont = getFont().deriveFont(Font.BOLD);
 
	@Override
	public Component getTableCellRendererComponent(JTable table, Object value,
			boolean isSelected, boolean hasFocus, int row, int column) {
		super.getTableCellRendererComponent(table, value, isSelected, hasFocus, row, column);
		setFont(this.boldFont);
		return this;
	}
}

Enfin je finirais avec une petite astuce : il est possible d'alterner les couleurs de fond des cellules assez facilement. Par example pour alterner avec un jaune pale :

Code :

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

UIManager.put("Table.alternateRowColor", new Color(255, 255, 204));

Cela fonctionne tant qu'on ne modifie pas explicitement la couleur de fond et qu'on hérite bien de DefaultCellRenderer pour tous nos renderer (ce que je conseillerais d'ailleurs pour la plupart des renderers).

Toutefois, il faut penser que cela impactera toutes les JTables de l'application...

a++

**Baptiste Wicht** · 23/12/2009, 18h14

Merci pour vos commentaires

Envoyé par adiGuba

Tu peux éviter de supprimer le texte des cellule avec setText("") tout simplement en évitant de passer "value" à la méthode parente, par exemple :

Code :

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

1
2
3
4
5
6
7
8
class ColorCellRenderer extends DefaultTableCellRenderer {
    @Override
    public Component getTableCellRendererComponent(JTable table, Object value, boolean isSelected, boolean hasFocus, int row, int column) {
        super.getTableCellRendererComponent(table, null, isSelected, hasFocus, row, column);
        setBackground( (Color)value );
        return this;
    }
}

C'est pas con, j'y avais même pensé

Dans ton SexeCellRenderer tu précharges une fois pour toute les images pour éviter de les recréer à chaque appel. C'est bien mais on pourrait faire la même chose dans le BoldCellRenderer pour éviter de multiplier les créations de Font dérivée :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
public class BoldCellRenderer extends DefaultTableCellRenderer {
 
	private final Font boldFont = getFont().deriveFont(Font.BOLD);
 
	@Override
	public Component getTableCellRendererComponent(JTable table, Object value,
			boolean isSelected, boolean hasFocus, int row, int column) {
		super.getTableCellRendererComponent(table, value, isSelected, hasFocus, row, column);
		setFont(this.boldFont);
		return this;
	}
}

Très juste, j'avais oublié ça moi

Enfin je finirais avec une petite astuce : il est possible d'alterner les couleurs de fond des cellules assez facilement. Par example pour alterner avec un jaune pale :

Code :

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

UIManager.put("Table.alternateRowColor", new Color(255, 255, 204));

Cela fonctionne tant qu'on ne modifie pas explicitement la couleur de fond et qu'on hérite bien de DefaultCellRenderer pour tous nos renderer (ce que je conseillerais d'ailleurs pour la plupart des renderers).

Toutefois, il faut penser que cela impactera toutes les JTables de l'application...

a++

Je vais l'inclure dans une section Divers, merci

Je vais mettre à jour dans les jours qui viennent

**zafo** · 24/12/2009, 04h37

Envoyé par vintz72

Pour le second... bof. J'avoue que je m'y suis habitué, et il y a des aspects sympas, mais en somme, je trouve quand même plutôt lourd le Swing. Il faut souvent parcourir plusieurs objets avant d'obtenir une information triviale (ex récent pour moi: je voulais définir un renderer spécial sur une colonne donnée. Le faire pour une classe donnée n'était pas possible étant donné que plusieurs colonnes sont de type "Date".

Pas faux, ceci dit c'est aussi ce qui en fait sa puissance, on peut faire énormément de choses avec. Pour quelque chose de trivial si on ne connaît il faut certes chercher un peu (et encore avec la javadoc c'est facile), mais après on est bien content lorsqu'on veut quelque chose de vraiment "sur mesure".

Envoyé par vintz72

En outre, il manque une vision haut niveau du paradigme MVC. J'utilise un framework propriétaire pour palier cela, mais de base, Swing, ça manque quand même de beaucoup de choses.

Heu déjà pourquoi veux-tu une vision haut niveau ? Ce sont des éléments de bas niveau justement... le haut niveau c'est ton application, pas les composants. De toute façon la plupart des composants n'utilisent pas le pattern MVC qui pour toute une série de raisons n'est pas approprié à ce niveau-ci d'abstraction, mais bien un modèle-vue où le contrôleur et la vue ont été couplées. Bon heu... je n'ai peut-être pas compris ta remarque non plus

Sinon j'applaudis l'idée de ce tuto déjà pas mal complet. Vu le temps que j'ai dû passer plongé dans la javadoc et dans les tutos Sun pour apprendre à correctement m'en servir... ça pourra sûrement en aider plus d'un !

**mysina.25** · 03/01/2010, 15h17

Merci , c'est un bon travail

mais svp il manque un peu d'organisation de code

, il faut indiquer où mettre chaque bout de code car ils sont séparés, et concernant le code de triage il n'a pas bien marché

de même pour la modification de valeur de combobox de sport ;
j'attends la modification de code

**Baptiste Wicht** · 03/01/2010, 15h52

Envoyé par mysina.25

Merci , c'est un bon travail

mais svp il manque un peu d'organisation de code

, il faut indiquer où mettre chaque bout de code car ils sont séparés, et concernant le code de triage il n'a pas bien marché

de même pour la modification de valeur de combobox de sport ;
j'attends la modification de code

L'entier du code est téléchargeable au dernier chapitre. Ce serait trop lourd d'inclure à chaque fois le code entier. Il me semble dèja que les explications sur l'inclusion du code sont suffisamment claires. Je vais encore essayer d'améliorer cela pour la prochaine version de l'article.

**herve91** · 03/01/2010, 16h38

Envoyé par adiGuba

Dans ton SexeCellRenderer tu précharges une fois pour toute les images pour éviter de les recréer à chaque appel. C'est bien mais on pourrait faire la même chose dans le BoldCellRenderer pour éviter de multiplier les créations de Font dérivée :

Code :

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

1
2
3
public class BoldCellRenderer extends DefaultTableCellRenderer {
 
	private final Font boldFont = getFont().deriveFont(Font.BOLD);

Bonjour,
pour chipoter un peu...

C'est une bonne idée mais il faut être conscient que cela a des effets de bord ; en effet ici tu crées une fonte à partir de la fonte par défaut associée au JLabel (puisque DefaultTableCellRenderer hérite de JLabel). Or DefaultTableCellRenderer est initialement configuré pour "hériter" de la fonte de la JTable, ce qui n'est plus le cas ici. Ainsi, si la fonte de la JTable est modifiée, le BoldCellRenderer gardera la fonte initialement calculée. De plus il peut être problématique de partager le BoldCellRenderer entre différentes tables (de fonte différente).

**Syphys** · 15/01/2010, 13h03

Hello merci beaucoup pour ton tuto

juste pour écrire moins avec des classes anonymes pour ceux qui les aiment c'est pas vraiment utile mais je trouve ça plus claire... :

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 JTableBasiqueAvecPanelAvecScrollPaneEtModeleObjectDynamique extends javax.swing.JFrame {
    private ModeleObjectDynamique modele = new ModeleObjectDynamique();
    private JTable tableau = new JTable(modele);
 
    public JTableBasiqueAvecPanelAvecScrollPaneEtModeleObjectDynamique(){
        setTitle("JTable avec modèle dynamique");
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 
        getContentPane().add(new JScrollPane(tableau), BorderLayout.CENTER);
 
        JPanel boutons = new JPanel();
 
        boutons.add(new JButton(new AbstractAction("Ajouter") {
            public void actionPerformed(ActionEvent e) {
                modele.addAmi(new Ami("Megan", "Sami", Color.green, false, Sport.NATATION));
            }
        }));
 
        boutons.add(new JButton(new AbstractAction("Supprimmer") {
            public void actionPerformed(ActionEvent e) {
                int[] selection = tableau.getSelectedRows();
 
                for(int i = selection.length - 1; i >= 0; i--){ modele.removeAmi(selection[i]);}
            }
        }));
 
        getContentPane().add(boutons, BorderLayout.SOUTH);
 
        pack();
    }

à la place de :

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
public class JTableBasiqueAvecModeleDynamiqueObjet extends JFrame{
    private ModeleDynamiqueObjet modele = new ModeleDynamiqueObjet();
    private JTable tableau;
 
    public JTableBasiqueAvecModeleDynamiqueObjet() {
        super();
 
        setTitle("JTable avec modèle dynamique");
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 
        tableau = new JTable(modele);
 
        getContentPane().add(new JScrollPane(tableau), BorderLayout.CENTER);
 
        JPanel boutons = new JPanel();
 
        boutons.add(new JButton(new AddAction()));
        boutons.add(new JButton(new RemoveAction()));
 
        getContentPane().add(boutons, BorderLayout.SOUTH);
 
        pack();
    }
 
    public static void main(String[] args) {
        new JTableBasiqueAvecModeleDynamiqueObjet().setVisible(true);
    }
 
    private class AddAction extends AbstractAction {
        private AddAction() {
            super("Ajouter");
        }
 
        public void actionPerformed(ActionEvent e) {
            modele.addAmi(new Ami("Megan", "Sami", Color.green, false, Sport.NATATION));
        }
    }
 
    private class RemoveAction extends AbstractAction {
        private RemoveAction() {
            super("Supprimmer");
        }
 
        public void actionPerformed(ActionEvent e) {
            int[] selection = tableau.getSelectedRows();
 
            for(int i = selection.length - 1; i >= 0; i--){
                modele.removeAmi(selection[i]);
            }
        }
    }
}

PS : ça marchera pas avec un copier/coller je me suis approprié les noms et j'ai fait un main séparé

**Baptiste Wicht** · 15/01/2010, 17h39

Effectivement, ça va aussi marcher très bien, même si personnellement, je trouve ça plus lourd comme syntaxe. Comme quoi, les goûts et les couleurs

Sinon, la version avec les classes internes plutôt plutôt qu'anonyme a un avantage si on veut aussi permettre d'utiliser ces actions via un menu ou un raccourci clavier, ce qui n'est pas faisable avec une classe anonyme à moins de dupliquer du code.

**robert_trudel** · 16/01/2010, 06h52

quand tu ajoutes un élément, ton élément est statique... ce n'est pas l'utilisateur qui l'entre....

comment tu ferais pour que ça soit l'utilisateur qui entre la ligne de donnée au complet?

il y a ajout d'une ligne vide via un bouton... ou bien il y en a toujours une de vide... ensuite ajout des donnée de l'utilisateur ? ou ces changements seraient fait?

**Baptiste Wicht** · 16/01/2010, 11h33

Envoyé par robert_trudel

quand tu ajoutes un élément, ton élément est statique... ce n'est pas l'utilisateur qui l'entre....

comment tu ferais pour que ça soit l'utilisateur qui entre la ligne de donnée au complet?

il y a ajout d'une ligne vide via un bouton... ou bien il y en a toujours une de vide... ensuite ajout des donnée de l'utilisateur ? ou ces changements seraient fait?

Comme dit dans l'article, pour que les données entrées soit ajoutées par l'utilisateur et non pas de manière statique, il faudrait construire une vue pour ajouter un Ami. Typiquement, ce serait un JDIalog avec un champ par valeur de Ami avec deux boutons Ok et Annuller et le bouton OK prendrait les valeurs de la vue pour les ajouter dans le modèle du tableau.

Sinon, une autre solution, comme tu l'as dit, un bouton pour rajouter une ligne vide et ensuite l'utilisateur fait les modifications directement dans le tableau, mais ce n'est pas à mon avis, le choix le plus ergonomique.

**robert_trudel** · 16/01/2010, 16h05

Envoyé par Baptiste Wicht

Comme dit dans l'article, pour que les données entrées soit ajoutées par l'utilisateur et non pas de manière statique, il faudrait construire une vue pour ajouter un Ami. Typiquement, ce serait un JDIalog avec un champ par valeur de Ami avec deux boutons Ok et Annuller et le bouton OK prendrait les valeurs de la vue pour les ajouter dans le modèle du tableau.

Sinon, une autre solution, comme tu l'as dit, un bouton pour rajouter une ligne vide et ensuite l'utilisateur fait les modifications directement dans le tableau, mais ce n'est pas à mon avis, le choix le plus ergonomique.

pourquoi c'est le choix que la plupart des applications de gestions font...

**kimjoa** · 30/07/2010, 17h04

Merci pour ce tuto qui m'a bien aidé

j'ai quand même une question .... J'ai vue dans la doc de TableModel que la méthode getColumnName doit retourner une String. Hors je voudrais mettre une checkbox pour permettre de tout sélectionner ou pas. Je sais pas quoi faire, j'ai peur qu'on puisse pas. Auriez-vous une idée?

Merci mec