Swinguez!! JFrame, JPanel, JComponent, LayoutManager, BorderLayout

Dernière mise à jour le par BunoCS .

Swinguez !!! - Partie 1 : Premiers Pas

Introduction

Je vous propose ce petit tutoriel pour la création d'interface graphique en JAVA, il se décomposera en plusieurs parties que je concevrai selon mon temps libre et l'engouement suscité...J'espère qu'il vous sera utile et sera assez didactique. Je tient avant tout m'excuser pour des éventuelles fautes d'orthographes et de français. Si vous avez des remarques/suggestions, n'hésitez pas!!

Cette première partie, intitulée "Premiers Pas" est consacrée, comme son nom l'indique, à une initiation rapide à l'élaboration d'interface graphique en JAVA.

Concepts abordés :

- Swing
- les JFrame
- les JPanel
- les layouts, LayoutManager
- les JComponent

Swing

Qu'est ce Swing ?!! si vous pensez que c'est une danse, c'est que vous n'avez pas fait beaucoup de Java...bon trêve de plaisanterie, une définition de Swing, vue sur Wikipédia résume en quelques phrases Swing :

Swing est une bibliothèque graphique pour le langage de programmation Java, faisant partie du package Java Foundation Classes (JFC), inclus dans J2SE. Swing constitue l'une des principales évolutions apportées par Java 2 par rapport aux versions antérieures.

Swing offre la possibilité de créer des interfaces graphiques identiques quelque soit le système d'exploitation sous-jacent, au prix de performances moindres qu'en utilisant Abstract Window Toolkit (AWT). Il utilise le principe Modèle-Vue-Contrôleur (MVC) et dispose de plusieurs choix d'apparence (de vue) pour chacun des composants standard.

Vous devez comprendre en gros, que Swing permet de construire des interfaces graphiques en Java affichable sur toute JVM (Java Virtual Machine) de n'importe quel système qui se respecte(portabilité)

Entrons dans le vif du sujet

Pour créer des interfaces graphiques, il est nécessaire de connaître et de maîtriser certains objets de base de Swing :

Les fenêtres, les JFrame

Les JFrame sont l'équivalent des fenêtres. Elles ont un titre, une dimension, un aspect et des éléments graphique affichés à l'intérieur.

Les JFrame font partie du package javax.swing, il faudra l'inclure avant toute utilisation avec un import. Nous allons voir comment ouvrir une fenêtre JFrame pas à pas, vous allez voir que c'est pas compliqué.

import javax.swing.*;
public  class test
{
    public static void main(String args * )
    {
        JFrame  f  = new JFrame("Hello World!!");
        f.setVisible(true);
    }
}

Tapez ce code dans "test.java" puis compilez ce petit programme (javac test.java) , puis lancez le programme (java test).

Vous verrez une petite fenêtre :

Cette fenêtre est assez minuscule, si vous la redimensionnez à la main, vous verrez apparaître son titre et son contenu vide. Comme on n'a pas spécifié de dimension pour notre JFrame, Swing ouvre une fenêtre avec une dimension par défaut (ici 0x0). Nous verrons plus loin, que l'on n'a pratiquement jamais besoin de spécifier nous même la dimension d'une JFrame.

Par défaut, une JFrame est toujours invisible, c'est-à-dire que la fenêtre est créée mais jamais affichée par défaut. C'est pour cela que l'on rajoute la ligne f.setVisible(true); qui permet de rendre visible la fenêtre.

Lorsque vous fermez la fenêtre,vous constaterez que Java ne rends pas la main au système, le programme java tourne toujours. Lorsque vous créez une JFrame, un Thread c'est-à-dire un programme d'arrière plan est créé. Par défaut, Swing ne tue pas le processus lorsque l'on ferme la JFrame avec la souris.

Notre deuxième petit programme va nous ouvrir une fenêtre avec une dimension par défaut et va quitter le logiciel lorsqu'on ferme la fenêtre avec la souris :

import  javax.swing.*;
import  java.awt.*;
public class test
{
    public static void main(String args[])
    {
        JFrame f=new JFrame("Hello World!!");
        f.setSize(new Dimension(200,200));
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.setVisible(true);
    }
}

On n'a rajouté que deux lignes :
- setSize permet de spécifier la dimension de la fenêtre
- setDefaultCloseOperation permet de définir l'opération par défaut que l'on veut lorsqu'on ferme la fenêtre. Le paramètre JFrame.EXIT_ON_CLOSE spécifie que l'on quitte le logiciel lorsqu'on ferme la JFrame.

Vous voyez donc qu'il n'est pas très difficile d'ouvrir une fenêtre avec Swing. Ouvrir une fenêtre seule sans rien à l'intérieur n'a pas grand intérêt, nous allons voir maintenant voir comment placer des composants à l'intérieur.

Contenu des fenêtres, les JPanel, les layouts et les JComponent

Pour ajouter des objets à une JFrame, on a besoin de JPanel. Un JPanel est en quelque sorte une boite dans laquelle on peut placer des composants de l'interface graphique. Un JPanel sert uniquement à stocker les objets, il est secondé par un LayoutManager pour les placer au bon endroit dans une fenêtre.

En effet, dans Swing, on place les objets non pas à une abscisse/ordonnée précise mais on les place avec une stratégie gérée par les LayoutManager. C'est le LayoutManager qui se charge de définir la position de l'objet dans la fenêtre. Par exemple, une des stratégies possible est de placer tous les objets en ligne les uns à cotés des autres. Un JPanel possède une unique stratégie de placement, un unique LayoutManager.

Les composants de l'interface graphique sont des classes qui héritent de la classe JComponent. Il en existe déjà un bon nombre par défaut dans Swing : les labels, les zones de texte éditables, les scrollbars, les boutons, les tables etc... et il est bien sur possible de créer ses propres composants (sujet peut être d'un futur tutorial).

Voici une petite liste des noms des classes des composants :

JLabel label (un texte)
JTextField un champ texte éditable
JButton un bouton
JComboBox une combo box

Vous verrez, qu'il est très facile de créer et de placer ces objets.

Pour commencer, nous allons rajouter à notre exemple précédent, un texte centré sur la largeur de la fenêtre.

Le texte sera un JLabel. On créé simplement cet objet en faisant :
JLabel lab=new JLabel("Bonjour tout le monde");

Un composant ne sert a rien si on a pas de JPanel où le stocker. Pour créer un JPanel :
JPanel pan=new JPanel();

Il faut lui définir un LayoutManager, il en existe beaucoup dans Swing. Nous allons utiliser un FlowLayout qui a la particularité de pouvoir placer notre JLabel centré sur la largeur de la fenêtre :
FlowLayout bl = new FlowLayout(FlowLayout.CENTER)
Le paramètre FlowLayout.CENTER spécifie l'alignement que l'on désire, ici on veut centrer.

Pour attacher le LayoutManager auPanel :
pan.setLayout(bl);

Enfin, il ne faut pas oublier d'ajouter le JLabel au panel (une des erreurs classiques!) :
pan.add(lab);

Pour finir, une JFrame lors de sa création, créé déjà un JPanel, ici nous avons créé notre propre JPanel pan, une deuxieme erreur classique est d'oublier de redéfinir le panel de la JFrame(sinon notre JPanel ne sera pas affiché !), on le fait tout simplement par :
setContentPane(pan)

Voici le programme complet :

import  javax.swing.*;
import  java.awt.*;
public  class    test extends JFrame
{
    public test()
    {
        super("Hello World !");     //défini le titre
        setSize(new Dimension(200,200));  //la taille

        JPanel pan=new JPanel(); //Panel
        FlowLayout bl = new FlowLayout(FlowLayout.CENTER);   //layoutManager
        pan.setLayout(bl);    //attache le layoutManager au panel           

        JLabel  lab=new JLabel("Bonjour le monde!!");  //créé un label
        pan.add(lab);  //l'ajoute au panel       

        setContentPane(pan);  //defini le panel de la JFrame
        setVisible(true);  //affiche la JFrame

       setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); //opération par défaut ala fermeture
    }

    public static void main(String args[])
    {
        new test();
    }
}

Voici une capture du résultat :

Il faut noter, qu'on peut aussi placer d'autre JPanel dans un JPanel. Chaque sous panel ayant son propre LayoutManager, on peut créer ainsi une interface graphique complète, qui sera l'objet d'un prochain tutoriel.

Voici un exemple plus complet, pour ceux qui veulent en apprendre un peu plus :

import  javax.swing.*;
import  java.awt.*;
public class test extends JFrame
{
    public test()
    {
        super("Hello World!");                 //défini le titre
        setSize(new Dimension(300,300));        //la taille       

        JPanel pan=new JPanel();              //panel
        BoxLayout    bl=new BoxLayout(pan,BoxLayout.Y_AXIS);   //layoutManager
        pan.setLayout(bl);                      //attache le layoutManager au panel           

        JLabel  lab=new JLabel("Bonjour le monde!!");  //créé un label
        pan.add(lab);           //l'ajoute au panel       

        JTextField  tf=new JTextField("Editez !"); //un champ texte!
        pan.add(tf);       

        //un 2eme panel qui va etre imbriqué dans le 1er panel !
        JPanel  pan2=new   JPanel();   //2eme panel
        bl=new BoxLayout(pan2,BoxLayout.X_AXIS);  //un autre alignement
        pan2.setLayout(bl);       

        lab=new JLabel("ComboBox:");
        pan2.add(lab);  //ajout dans le 2eme panel
        String  c[] ={"Un","Deux","Trois","Zéro !"};   //contenu de la comboBox
        JComboBox   cb=new JComboBox(c);
        pan2.add(cb);       

        //ajoute le panel 2 dans le panel 1!
        pan.add(pan2);       

        //un dernier composantpour la route...
        JButton but=newJButton("C'est un bouton !!");
        pan.add(but);       

        //
        setContentPane(pan);        //defini le panel de la JFrame
        setVisible(true);           //affiche la JFrame
       setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); //opération par défaut a la fermeture
    }   

    public static void main(String args[])
    {
        new test();
    }
}

Voici une capture du résultat :

Liens

La doc Java est indispensable pour développer mais malheureusement elle est en anglais, jetez y un oeil quand même pour approfondir :

http://java.sun.com/j2se/1.4.2/docs/api/

Consultez les pages sur les JFrame, JPanel, JComponent, JLabel et FlowLayout

Fin

Et oui, ce petit tutoriel est déjà fini !! Vous pouvez déjà vous entraîner à créer vos interfaces graphiques.

A voir également
Ce document intitulé « Swinguez!! JFrame, JPanel, JComponent, LayoutManager, BorderLayout » issu de CodeS SourceS (codes-sources.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Créer un jar executable avec eclipse
Swing - Partie 2 : ActionListener, Listener, JButton
Rejoignez-nous