I.S.E.T Bizerte
TP : Interface Graphique en Java
TP : Interface graphique en java
(AWT/Swing)
Objectifs
Se familiariser avec les différents outils
proposés dans les bibliothèques Awt et
Swing.(widgets, container, layout)
S’initier à la gestion d’évènements (listeners)
-
-
Type
Durée
Outils
Formatif
3h00
Eclipse
Pour commencer !!
Pour créer une interface graphique, 2 bibliothèques de composants graphiques (Fenêtre,
boutons, zones de texte, labels, combo, etc) sont disponibles dans le JDK :
AWT (Abstract Windowing Toolkit) la plus ancienne (package java.awt),
SWING qui contient les nouvelles classes de composants dérivées des classes
AWT (package javax.swing).
Pour créer une fenêtre, on procédera en 2 étapes :
L'aspect visuel : création de la fenêtre et ajout des composants
La gestion des événements : interaction avec les utilisateurs (souris, clavier ;…)
Création de la fenêtre
Pour créer une fenêtre, il faut créer une classe dérivée de la classe JFrame.
import javax.swing.JFrame;
public class Fenetre1 extends JFrame {
}
Les caractéristiques de cette fenêtre seront définies dans le constructeur de cette fenêtre
import javax.swing.JFrame;
public class Fenetre1 extends JFrame {
public Fenetre1(){//Constructeur
/* Appel du constructeur de la classe mère Jframe avec le mot clé
super pour donner un titre à la fenêtre */
super("Fenetre 1");
this.setBounds (0,0,200,200); //Taille de la fenêtre
}
}
Mme CHALOUAH Anissa
1
I.S.E.T Bizerte
TP : Interface Graphique en Java
Pour tester la fenêtre, on crée une instance de cette fenêtre :
public class Testeur {
public static void main(String[] args) {
JFrame frame= new Fenetre1();
frame.setVisible(true);
}}
Ajout de composants
Publicité
Pour ajouter des composants sur la fenêtre, il faut :
Récupérer la "vitre" sur laquelle on pourra ajouter des composants. L'objet
Container agit comme une sorte de calque sur lequel on créera les composants.
Créer des instances de composants en appelant le constructeur de chacun des
composants.
Puis ajouter ces composants sur la "vitre".
import java.awt.*;
import javax.swing.*;
public class Fenetre1 extends JFrame {
//Propriétés de la fenêtre
JButton bt1,bt2;
//Constructeur
public Fenetre1(){
//Appel du constructeur pour donner un titre à la fenêtre
super("Fenetre 1");
//Récupération du container géré par JFrame
//C'est la vitre sur laquelle on pourra poser des composants
Container c=this.getContentPane();
//Création d'un bouton
bt1 = new JButton("Bouton1");
//Ajout de ce bouton au nord sur la vitre
c.add("North",bt1);
bt2 = new JButton("Bouton2");
Mme CHALOUAH Anissa
2
I.S.E.T Bizerte
TP : Interface Graphique en Java
//Ajout de ce bouton au centre sur la vitre
c.add("Center",bt2);
this.setBounds (0,0,200,200);
}
}
Positionnement des composants
SWING a résolu les problèmes de redimensionnement des fenêtres en introduisant les
Layout.
Un Layout Manager est un gestionnaire qui permet de définir la position des composants
selon des règles spécifiques.
Par défaut, le container (la vitre) de JFrame utilise un BorderLayout. Ce type de Layout
découpe la fenêtre en 5 zones. Le BorderLayout est un peu limité car il permet d'insérer
seulement 5 composants sur la fenêtre (un par zone).
Il existe d'autres types de Layout : FlowLayout, BoxLayout, GridLayout, … qui
permettront d'obtenir d'autres dispositions.
Pour modifier le type de Layout associé à la vitre :
import java.awt.FlowLayout;
public class Fenetre1 extends JFrame {
private JButton bt1,bt2;
//Constructeur
public Fenetre1(){
…
Container c=this.getContentPane();
/*choix d'un autre Layout le FlowLayout qui a pour effet de mettre
tous les éléments à la suite*/
Publicité
c.setLayout(new FlowLayout());
//Création d'un bouton
Mme CHALOUAH Anissa
3
I.S.E.T Bizerte
TP : Interface Graphique en Java
bt1 = new JButton("Bouton1");
bt2 = new JButton("Bouton2");
//Ajout de ce bouton sur la vitre
c.add(bt1);
c.add(bt2);
....
}
}
Utilisation de Panneaux (JPanel)
Pour obtenir des présentations plus élaborées, il est aussi possible d'insérer des Layouts
dans un Layout et de les combiner… Pour ce faire, il est possible de créer des panneaux
et d'y associer des Layout.
import javax.swing.*;
import java.awt.*;
public class Fenetre1 extends JFrame {
JLabel LblNom,lblTexte;
JTextField txtNom;
JButton btBonjour, btAuRevoir;
public Fenetre1(){
super("Fenetre 1");
//Récupération du container géré par JFrame (BorderLayout)
Container c=this.getContentPane();
//Création d'un panneau
JPanel pNorth = new JPanel(new FlowLayout());
//Création des composants
LblNom = new JLabel("Votre nom :");
txtNom = new JTextField(20);
lblTexte = new JLabel("bonjour");
btBonjour = new JButton("Bonjour");
btAuRevoir = new JButton("Au revoir");
Mme CHALOUAH Anissa
4
I.S.E.T Bizerte
TP : Interface Graphique en Java
//Ajout des composants au panneau
pNorth.add(LblNom);
pNorth.add(txtNom);
pNorth.add(btBonjour);
pNorth.add(btAuRevoir);
//Ajout du panneau à la vitre
c.add("North",pNorth);
c.add("Center",lblTexte);
this.setBounds (0,0,600,200);
}
public static void main(String [] args){
JFrame frame = new Fenetre1();
Publicité
frame.setVisible(true);
}
}
Positionnement absolu des composants
La maîtrise des Layout Manager est un peu délicate, pour pallier à ce problème, il est
possible de positionner les composants de manière absolue, on indique alors la position
du composant par rapport au bord droit et au bord gauche, on lui donne une largeur et
une hauteur. Pour utiliser un positionnement absolu, il faut indiquer que l'on ne
souhaite pas utiliser de Layout Manager avec la méthode : setLayout(null).
import javax.swing.*;
import java.awt.*;
Mme CHALOUAH Anissa
5
I.S.E.T Bizerte
TP : Interface Graphique en Java
public class IHMPerson2 extends JFrame {
private JLabel nom=null, age=null;
private JTextField nomT=null, ageT=null;
public IHMPerson2(){
super("IMC");
this.setSize(500,400);
this.setLocationRelativeTo(null);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
Container c=this.getContentPane();
c.setLayout(null);//on ne souhaite aucun Layout Manager
JLabel nom=new JLabel("nom :");
JLabel age=new JLabel("age :");
// label nom à 10 pixels du bord droit et du bord gauche, une
largeur de 100 et une hauteur de 30
nom.setBounds(10,10,100,30);
age.setBounds(10,50,100,30);
nomT=new JTextField();
ageT=new JTextField();
nomT.setBounds(210,10,100,30);
ageT.setBounds(210,50,100,30);
//on ajoute les composants au container
c.add(nom);
c.add(age);
c.add(nomT);
c.add(ageT);
}
public static void main(String [] args){
JFrame frame = new IHMPerson2();
frame.setVisible(true);
} }
Mme CHALOUAH Anissa
6
I.S.E.T Bizerte
TP : Interface Graphique en Java
Gestion des évènements
Pour attribuer une action à un bouton, il va falloir lui ajouter un listener, un écouteur
d'action. En java, un écouteur d'action sur un bouton est un ActionListener. Il faudra
Publicité
donc définir qui va être l'écouteur de notre bouton, dans notre cas, on va dire que c'est la
fenêtre elle même, qui va écouter notre bouton pour ne rien compliquer. Car on peut
aussi créer une autre classe qui ferait office d'écouteur.
Pour qu'une classe puisse être écouteuse d'action, il faut qu'elle implémente, l'interface
ActionListener. Pour cela, il vous suffira d'ajouter dans la signature de la classe
implements ActionListener. Ainsi, la signature de notre classe deviendra :
public class TestBouton extends JFrame implements ActionListener{
Sans oublier d'importer ActionListener et ActionEvent :
import java.awt.event.*;
Puisque nous travaillons avec un EDI tel qu'eclise , cette ligne peut générer des erreurs.
Car, quand on implémente une interface, il faut qu'on définisse ces différentes méthodes,
dans
la méthode
actionPerformed(ActionEvent e) qui va être appelée à chaque fois que l'écouteur
reçoit un événement. On va donc ajouter cette méthode dans notre classe :
ActionListener,
seulement
possède
notre
cas,
public void actionPerformed(ActionEvent e) {
}
Ensuite, on va ajouter l'écouteur à notre bouton :
bouton1.addActionListener(this);//On ajoute la fenêtre en tant
qu'écouteur du bouton
Avec ce code, il n'y a toujours rien qui se passe, mais c'est normal, puisque la méthode
actionPerformed est vide.
Maintenant, il va donc falloir définir une action dans cette méthode mais pour prendre
de bonnes habitudes, on va d'abord contrôler que l'action émane bien de notre bouton.
Pour savoir d'où vient l'action, on dispose de l'événement passé en paramètre de la
Mme CHALOUAH Anissa
7
I.S.E.T Bizerte
TP : Interface Graphique en Java
méthode actionPerformed, cet événement possède une méthode getSource(), qui va
nous dire d'où vient l'action.
Si par exemple, on veut qu'à chaque clic sur le bouton1, on affiche « Bonjour », et sur le
bouton2 « hello » il va falloir faire quelque chose du genre :
public void actionPerformed(ActionEvent e) {
if(e.getSource() == bouton1){ //Si l'action émane bien du
bouton1
System.out.println(''bonjour'');
}
if(e.getSource() == bouton2){ //Si l'action émane bien du bouton2
System.out.println(''hello'');
}
}
Mme CHALOUAH Anissa
8