B-2-b - La classe de la fenêtre

Regardons maintenant le code qui a été généré pour la classe interfaceDébut :

import java.awt.*;

import java.awt.event.*;

import javax.swing.*;

public class interfaceDébut extends JFrame { JPanel contentPane;

BorderLayout borderLayout1 = new BorderLayout(); /**Construire le cadre*/ public interfaceDébut() { enableEvents(AWTEvent.WINDOW_EVENT_MASK); try { jbInit(); } catch(Exception e) { e.printStackTrace(); } } /**Initialiser le composant*/

private void jbInit() throws Exception {

contentPane = (JPanel) this.getContentPane(); contentPane.setLayout(borderLayout1);

this.setSize(new Dimension(400, 300));

this.setTitle("Ma première interface graphique avec Jbuilder"); }

/**Remplacé, ainsi nous pouvons sortir quand la fenêtre est fermée*/

protected void processWindowEvent(WindowEvent e) { super.processWindowEvent(e); if (e.getID() == WindowEvent.WINDOW_CLOSING) { System.exit(0); } } }

Les bibliothèques importées

import java.awt.*;

import java.awt.event.*;

import javax.swing.*;

Il s'agit des bibliothèques java.awt, java.awt.event et javax.swing. Les deux premières étaient les seules disponibles pour construire des interfaces graphiques avec les premières versions de Java. La bibliothèque javax.swing est plus récente. Ici, elle est nécessaire pour la fenêtre de type JFrame qui est utilisée ici.

Les attributs

JPanel contentPane;

BorderLayout borderLayout1 = new BorderLayout();

JPanel est un type conteneur dans lequel on peut mettre des composants. BorderLayout est l'un des types de

gestionnaire de mise en forme disponibles pour placer les composants dans le conteneur. Dans tous nos exemples, nous n'utiliserons pas de gestionnaire de mise en forme et placerons nous-mêmes les composants à un endroit précis du conteneur. Pour cela, nous utiliserons le gestionnaire de mise en forme null.

Le constructeur de la fenêtre /**Construire le cadre*/ public interfaceDébut() { enableEvents(AWTEvent.WINDOW_EVENT_MASK); try { jbInit(); } catch(Exception e) { e.printStackTrace(); } } /**Initialiser le composant*/

private void jbInit() throws Exception {

contentPane = (JPanel) this.getContentPane(); contentPane.setLayout(borderLayout1);

this.setSize(new Dimension(400, 300));

this.setTitle("Ma première interface graphique avec Jbuilder"); }

1 Le constructeur commence par dire qu'il va gérer les événements sur la fenêtre (enableEvents), puis il lance la méthode jbInit.

2 Le conteneur (JPanel) de la fenêtre (JFrame) est obtenu (getContentPane) 3 Le gestionnaire de mise en forme est fixé (setLayout)

4 La taille de la fenêtre est fixée (setSize) 5 Le titre de la fenêtre est fixé (setTitle) Le gestionnaire d'événements

/**Remplacé, ainsi nous pouvons sortir quand la fenêtre est fermée*/

protected void processWindowEvent(WindowEvent e) { super.processWindowEvent(e);

if (e.getID() == WindowEvent.WINDOW_CLOSING) { System.exit(0);

}

Le constructeur avait indiqué que la classe traiterait les événements de la fenêtre. C'est la méthode

processWindowEvent qui fait ce travail. Elle commence par transmettre à sa classe parent (JFrame) l'événement WindowEvent reçu puis si celui-ci est l'événement WINDOW_CLOSING provoqué par le clic sur le bouton de

fermeture de la fenêtre, l'application est arrêtée. Conclusion

Le code de la classe de la fenêtre est différent de celui présenté dans l'exemple de début de chapitre. Si nous utilisions un autre outil de génération Java que Jbuilder nous aurions sans doute un code encore différent. Dans la pratique, nous accepterons le code produit par Jbuilder pour construire la fenêtre afin de nous concentrer uniquement sur l'écriture des gestionnaires d'événements de l'interface graphique.

IV-B-3 - Dessiner une interface graphique

IV-B-3-a - Un exemple

Dans l'exemple précédent, nous n'avions pas mis de composants dans la fenêtre. Construisons maintenant une fenêtre avec un bouton, un libellé et un champ de saisie :

Les champs sont les suivants :

n° nom type rôle

1 lblSaisie JLabel un libellé

2 txtSaisie JTextField une zone de saisie

3 cmdAfficher JButton pour afficher dans

une boîte de dialogue le contenu de la zone de saisie txtSaisie

En procédant comme pour le projet précédent, construisez le projet interface2.jpr sans mettre pour l'instant de composants dans la fenêtre.

Dans la fenêtre ci-dessus, sélectionnez la classe interface2.java de la fenêtre. A droite de cette fenêtre, se trouve un classeur à onglets :

L'onglet Source donne accès au code source de la classe interface2.java. L'onglet Conception permet de construire visuellement la fenêtre. Sélectionnez cet onglet. Vous avez devant vous le conteneur de la fenêtre, qui va recevoir les composants que vous allez y déposer. Il est pour l'instant vide. Dans la fenêtre de gauche est montrée la structure de la classe :

this représente la fenêtre

contentPane son conteneur dans lequel on va déposer

des composants ainsi que le mode de mise en forme de ces composants dans le conteneur (BorderLayout par défaut) borderLayout1 une instance du gestionnaire de mise en

forme

Sélectionnez l'objet this. Sa fenêtre de propriétés apparaît alors sur la droite : Certaines de ces propriétés sont à noter :

background pour fixer la couleur de fond de la fenêtre foreground pour fixer la couleur des dessins sur la

fenêtre

JMenuBar pour associer un menu à la fenêtre

title pour donner un titre à la fenêtre

resizable pour fixer le type de fenêtre

font pour fixer la police de caractères des

écritures dans la fenêtre

L'objet this étant toujours sélectionné, on peut redimensionner le conteneur affiché à l'écran en tirant sur les points d'ancrage situés autour du conteneur :

Nous sommes maintenant prêts à déposer des composants dans le conteneur ci-dessus. Auparavant, nous allons changer le gestionnaire de mise en forme. Sélectionnez l'objet contentPane dans la fenêtre de structure :

Puis dans la fenêtre de propriétés de cet objet, sélectionnez la propriété layout et choisissez parmi les valeurs possibles, la valeur null :

Cette absence de gestionnaire de mise en forme va nous permettre de placer librement les composants dans le conteneur. Il est temps maintenant de choisir ceux-ci.

Lorsque le volet Conception est sélectionné, les composants sont disponibles dans un classeur à onglets en haut de la fenêtre de conception :

Pour construire l'interface graphique, nous disposons de composants swing (1) et de composants awt (2). Nous allons utiliser ici les composants swing. Dans la barre de composants ci-dessus, choisissez un composant JLabel (3), un composant JTextField (4) et un composant JButton (5) et placez-les dans le conteneur de la fenêtre de conception.

Maintenant personnalisons chacun de ces 3 composants :

• l'étiquette (JLabel) jLabel1 Sélectionnez le composant pour avoir sa fenêtre de propriétés. Dans celle-ci, modifiez les propriétés suivantes : name : lblSaisie, text : Saisie

• le champ de saisie (JTextField) jTextfield1 Sélectionnez le composant pour avoir sa fenêtre de propriétés. Dans celle-ci, modifiez les propriétés suivantes : name : txtSaisie, text : ne rien mettre

• le bouton (JButton) : name : cmdAfficher, text : Afficher Nous avons maintenant la fenêtre suivante :

et la structure suivante :

Nous pouvons exécuter (F9) notre projet pour avoir un premier aperçu de la fenêtre en action :

Fermez la fenêtre. Il nous reste à écrire la procédure liée à un clic sur le bouton Afficher. Sélectionnez le bouton pour avoir accès à sa fenêtre de propriétés. Celle-ci a deux onglets : propriétés et événements. Choisissez événements.

La colonne de gauche de la fenêtre liste les événements possibles sur le bouton. Un clic sur un bouton correspond à l'événement actionPerformed. La colonne de droite contient le nom de la procédure appelée lorsque l'événement correspondant se produit. Cliquez sur la cellule à droite de l'événement actionPerformed :

Jbuilder génère un nom par défaut pour chaque gestionnaire d'événement de la forme

nomComposant_nomEvénement ici cmdAfficher_actionPerformed. On pourrait effacer le nom proposé par défaut et

en inscrire un autre. Pour avoir accès au code du gestionnaire cmdAfficher_actionPerformed il suffit de double-cliquer sur son nom ci-dessus. On passe alors automatiquement au volet source de la classe positionné sur le squelette du code du gestionnaire d'événement :

void cmdAfficher_actionPerformed(ActionEvent e) { }

Il ne nous reste plus qu'à compléter ce code. Ici, nous voulons présenter une boîte de dialogue avec dedans le contenu du champ txtSaisie :

void cmdAfficher_actionPerformed(ActionEvent e) {

JOptionPane.showMessageDialog(this, "texte saisi="+txtSaisie.getText(), "Vérification de la saisie",JOptionPane.INFORMATION_MESSAGE);

}

JOptionPane est une classe de la bibliothèque javax.swing. Elle permet d'afficher des messages accompagnés d'une

icône ou de demander des informations à l'utilisateur. Ici, nous utilisons une méthode statique de la classe :

parentComponent l'objet conteneur "parent" de la boîte de dialogue : ici this.

message un objet à afficher. Ici le contenu du champ

de saisie

title le titre de la boîte de dialogue

messageType le type du message à afficher. Conditionne l'icône qui sera affichée dans la boîte à côté du message. Les valeurs possibles : INFORMATION_MESSAGE, QUESTION_MESSAGE, ERROR_MESSAGE,

WARNING_MESSAGE, PLAIN_MESSAGE Exécutons notre application (F9) :