Participer au site avec un Tip
Rechercher
 
Bug Suggérer des Améliorations / Corrections
Share Partager sur Facebook Partager sur Twitter
Links Notre chaîne YouTube Notre discord

Améliorations / Corrections

Vous avez des améliorations (ou des corrections) à proposer pour ce document : je vous remerçie par avance de m'en faire part, cela m'aide à améliorer le site.

Emplacement :

Description des améliorations :

Swing - Utilisation de composants JSplitPane

Utilisation d'un JEditorPane pour afficher du HTML Utilisation d'un composant JTabbedPane



La vidéo

Cette vidéo vous montre comment utiliser la classe JSplitPane pour mettre en oeuvre un, ou plusieurs, « splitter » dans votre interface graphique.


Utilisation de composants JSplitPane

Utilisation du composant JSplitPane

Aspects fondamentaux

Un composant de type JSplitPane est un conteneur graphique Swing qui divise son espace en deux sous-espaces : dans chacun de ces sous-espaces, vous pourrez-y placer un autre composant graphique. Le JSplitPane ajoute un séparateur entre les deux composants. En placant la souris sur ce séparateur, puis en maintenant le bouton gauche de la souris enfoncé sur ce séparateur, vous pourrez déplacer le séparateur et donc contrôler la superficie occupée par chacun des deux composants du JSplitPane.

Voici une capture d'écran qui montre un exemple d'utilisation du composant JSplitPane séparant une arborescence (à gauche) d'un éditeur de texte (à droite).

Exemple d'un composant JSplitPane séparant une arborescence (à gauche) d'un éditeur de texte (à droite).

Un JSplitPane peut orienter les composants qu'il contient de deux manière différentes : soit horizontalement (JSplitPane.HORIZONTAL_SPLIT), soit verticalement (JSplitPane.VERTICAL_SPLIT). Dans l'exemple ci-dessus, c'est bien entendu une séparation horizontale qui a été retenue. L'orientation est spécifiée à la construction de l'instance de type JSplitPane.

Aggrégation des composants d'un JSplitPane

Deux techniques peuvent être utilisées pour alimenter en composants un JSplitPane :

La plupart du temps, c'est la première technique qui est utilisée. Voici un exemple d'appel d'un constructeur de la classe JSplitPane. 

 1 
 2 

JSplitPane mainSplitPane = new JSplitPane( 
        JSplitPane.HORIZONTAL_SPLIT, new JTree(), new JTextArea() );
Exemple d'appel d'un constructeur

Il faut savoir que par défaut, le composant du haut (ou de gauche en fonction de l'orientation) sera dimensionné à sa taille minimale en fonction de son contenu. Le second composant prendra l'espace restant. Si cela ne vous convient pas, vous pouvez fixer une taille préférée (setPreferredSize sur le premier composant). Une autre solution consiste à fournir un ratio de taille pour le premier composant par rapport à la taille totale du JSplitPane : pour ce faire, vous devez invoquer la méthode setResizeWeight. Dans l'exemple suivant, l'arborescence utilisera un tier de l'espace disponible, laissant ainsi les deux autres tiers à la zone d'édition de texte. 

 1 
 2 
 3 

JSplitPane mainSplitPane = new JSplitPane( 
        JSplitPane.HORIZONTAL_SPLIT, new JTree(), new JTextArea() );
mainSplitPane.setResizeWeight( 0.33 );
Exemple de contôle de l'espace occupé par chaque composant

Vous pouvez aussi controller la taille du séparateur de zone, affiché par le composant JSplitPane. N'oubliez pas qu'en placant la souris sur ce séparateur, puis en y maintenant le bouton gauche de la souris enfoncé, vous pourrez déplacer le séparateur et donc contrôler la superficie occupée par chacun des deux composants du JSplitPane. Pour changer la taille du séparateur, invoquez la méthode setDividerSize 

 1 
 2 
 3 
 4 

JSplitPane mainSplitPane = new JSplitPane( 
        JSplitPane.HORIZONTAL_SPLIT, new JTree(), new JTextArea() );
mainSplitPane.setResizeWeight( 0.33 );
mainSplitPane.setDividerSize( 100 );
Exemple d'un très gros séparateur de composants

Pour aligner plus que deux éléments

Une difficulté apparait si vous cherchez à séparer plus de deux composants (horizontalement ou vericalement). Effectivement un composant JSplitPane ne peut contenir que deux sous-composants. Alors comment séparer 3 composants ou plus ? C'est simple, en utilisant plusieurs JSplitPane. Voici un petit exemple simple. 

 1 
 2 
 3 
 4 
 5 
 6 
 7 

JSplitPane secondSplitPane = new JSplitPane( 
        JSplitPane.HORIZONTAL_SPLIT, new JTextArea(), new JTree() );
secondSplitPane.setResizeWeight( 0.5 );

JSplitPane firstSplitPane = new JSplitPane( 
        JSplitPane.HORIZONTAL_SPLIT, new JTree(), secondSplitPane );
firstSplitPane.setResizeWeight( 0.33 );
Aligner plus que deux composants
normalement, les poids de retaillage devraient garantir que chaque composants (JTree ou JTextArea) devrait occuper un tier de l'espace totale de la fenêtre.

L'exemple de code complet proposé dans la vidéo

 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 

import java.awt.Dimension;

import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JScrollPane;
import javax.swing.JSplitPane;
import javax.swing.JTable;
import javax.swing.JTextArea;
import javax.swing.JTree;
import javax.swing.UIManager;
import javax.swing.plaf.nimbus.NimbusLookAndFeel;

/*
 * Dans cet exemple, on imagine refaire une interface graphique
 * qui ressemble (sur quelques points, bien entendu) à l'IDE Eclipse.
 */
public class JSplitPaneSample extends JFrame {
    
    private static final long serialVersionUID = 4443303248990993973L;
   
    // --- Construction de l'interface graphique ---
    public JSplitPaneSample() {
        super( "JSplitPane sample" );
        this.setSize(800,500);
        this.setLocationRelativeTo( null );
        this.setDefaultCloseOperation( DISPOSE_ON_CLOSE );
        
        // --- On récupère le contentPane ---
        JPanel contentPane = (JPanel) getContentPane();


        // --- L'explorateur de projet et ses scrollbars ---
        JTree projectExplorerTree = new JTree();
        JScrollPane projectScrollPane = new JScrollPane( projectExplorerTree );
        projectScrollPane.setPreferredSize( new Dimension( 200, 0 ) );
        
        // --- L'éditeur principal et ses scrollbars ---
        JTextArea textArea = new JTextArea();
        JScrollPane editorScrollPane = new JScrollPane( textArea );
        
        // --- Le panneau de propriétés et ses scrollbars ---
        JTable propertyPane = new JTable();
        JScrollPane propertyScrollPane = new JScrollPane( propertyPane );
        
        // --- La vue outline et ses scrollbars ---
        JTree outlineTree = new JTree();
        JScrollPane outlineScrollPane = new JScrollPane( outlineTree );
        
        
        // --- Et maintenant on assemble le tout avec de JSplitPane ---
        JSplitPane documentSplitPane = new JSplitPane(
                JSplitPane.HORIZONTAL_SPLIT, editorScrollPane, outlineScrollPane );
        documentSplitPane.setResizeWeight( 0.8 );
        
        JSplitPane rightSplitPane = new JSplitPane(
                JSplitPane.VERTICAL_SPLIT, documentSplitPane, propertyScrollPane );
        rightSplitPane.setResizeWeight( 0.8 );
        
        JSplitPane mainSplitPane = new JSplitPane(
                JSplitPane.HORIZONTAL_SPLIT, projectScrollPane, rightSplitPane );
        contentPane.add( mainSplitPane /*, BorderLayout.CENTER */ );    

        // Pour changer la taille d'un séperateur de panneaux
        // mainSplitPane.setDividerSize( 100 );        // Bof
        
        // Pour changer un composant dans le JSplitPane après sa construction
        // setTopComponent, setBottomComponent, setLeftComponent, setRightComponent
    }
    
    // --- Point d'entrée du programme ---
    public static void main(String[] args) throws Exception {
        UIManager.setLookAndFeel( new NimbusLookAndFeel() );
        JSplitPaneSample frame = new JSplitPaneSample();
        frame.setVisible(true);
    }
}
Exemple d'utilisation de la classe JSplitPane

Et voici le résultat produit par cet exemple de code Swing.

Exemple d'utilisation de composants de type JSplitPane


Utilisation d'un JEditorPane pour afficher du HTML Utilisation d'un composant JTabbedPane