Créer une interface graphique
en Java
Créer une interface graphique en Java 1 / 19
Sommaire
1 Introduction
2 Une première fenêtre
3 La notion d’écouteur
4 Un bouton dans la fenêtre
5 La fenêtre écoute le bouton
Créer une interface graphique en Java 2 / 19
Sommaire
1 Introduction
2 Une première fenêtre
3 La notion d’écouteur
4 Un bouton dans la fenêtre
5 La fenêtre écoute le bouton
Introduction
Introduction
Java permet d’écrire des programmes possédant une interface
graphique 1 . Celle-ci permet de gérer l’interaction avec l’utilisateur sans
passer par la console 2 . Le jeu des entrées/sorties est géré par le biais
d’un ensemble complet de composants graphiques ou «widgets» : bouton,
case à cocher, zone de saisie, liste-déroulante, etc.
Les actions (réponses) de l’utilisateur, sont le plus souvent prises en
compte par le biais d’une gestion de la souris (clic, position,
déplacement) ou du clavier (caractères saisis, touches enfoncées,. . .).
Avec la notion d’écouteur, Java offre la possibilité de «connecter» les
composants graphiques aux actions (entrées) de l’utilisateur : un bouton
pourra par exemple réagir au clic de l’utilisateur en déclenchant une
action particulière, programmée à l’avance.
1. on parle de gui : Graphical User Interface.
2. Deux exemples de programmes à interface graphique : GeoGebra et Eclipse. Ce
sont tous les deux des logiciels libres et open-source, et d’ailleurs écrits en Java.
Créer une interface graphique en Java 3 / 19
Introduction
Introduction (suite)
On va introduire ces notions en montrant comment :
créer une fenêtre ;
gérer un clic dans la fenêtre ;
créer un bouton et gérer un clic sur ce bouton.
Créer une interface graphique en Java 4 / 19
Sommaire
1 Introduction
2 Une première fenêtre
3 La notion d’écouteur
4 Un bouton dans la fenêtre
5 La fenêtre écoute le bouton
Une première fenêtre
Une première fenêtre
But : créer une fenêtre qui servira de support pour d’autres composants
(boutons,. . .)
Le paquetage Java à importer : import [Link].*
Une fenêtre est un objet de la classe JFrame. Pour créer une fenêtre
répondant aux besoins précis de l’application qu’on développe 3 , on créera
une classe qui dérivera de la classe JFrame puis on instanciera un objet
de cette classe :
public class MaFenetre extends JFrame
MaFenetre fen = new MaFenetre();
Un minimum d’actions doivent être réalisées sur cette fenêtre pour qu’elle
prenne corps dans le programme :
lui donner un titre (optionnel) ;
lui donner une taille, en pixels ;
la rendre visible.
Le programme minimal ci-dessous réalise ces actions (tester sous
Eclipse) :
3. qui nécessitera des composants précis, disposés selon un agencement particulier.
Créer une interface graphique en Java 5 / 19
Une première fenêtre
Une première fenêtre (suite)
import javax .swing .∗;
public class MaFenetre extends JFrame { // MaFenetre dérive de JFrame
// constructeur
public MaFenetre(String titre , int larg , int haut) {
setTitle ( titre );
setSize ( larg , haut);
}
public static void main(String [] args) {
MaFenetre fen = new MaFenetre("Ma première fenêtre", 300, 150);
fen . setVisible ( true );
}
Créer une interface graphique en Java 6 / 19
Une première fenêtre
Une première fenêtre (suite)
Remarques :
on a utilisé ci-dessus la notion de constructeur : il s’agit d’une
méthode qui sera automatiquement appelée lors de la création d’un
nouvel objet de la classe. Il peut (c’est le cas ici) comporter des
arguments.
on voit comment fonctionne la notion d’héritage : les méthodes
setTitle et setSize ne sont pas définies dans la classe
MaFenetre, mais par la classe JFrame. Or MaFenetre dérive de
JFrame, donc elles sont «connues» à l’intérieur de la classe
MaFenetre.
d’autres méthodes peuvent être appelées sur une JFrame (se
documenter et tester). Par exemple :
I changer sa couleur de fond (setBackground) ;
I indiquer son positionnement sur l’écran (setBounds) ;
I autoriser/interdire son redimensionnement (setResizable)
I indiquer le comportement lors de la fermeture de la fenêtre
(setDefaultCloseOperation)
Créer une interface graphique en Java 7 / 19
Sommaire
1 Introduction
2 Une première fenêtre
3 La notion d’écouteur
4 Un bouton dans la fenêtre
5 La fenêtre écoute le bouton
La notion d’écouteur
La notion d’écouteur
Avec la notion d’écouteur Java permet de faire en sorte que des
événements produits par un objet (bouton,. . .) soient automatiquement
transmis à un autre objet, qu’on appelle écouteur du premier. Cet objet
écouteur traite alors ces événements en déclenchant les méthodes
appropriées.
On va montrer ici comment les clics de la souris générés dans la fenêtre
peuvent être écoutés (et traités) par la fenêtre elle-même. Plus
précisément on va faire en sorte que chaque clic dans la fenêtre provoque
l’affichage d’un message dans la console.
Créer une interface graphique en Java 8 / 19
La notion d’écouteur
La notion d’écouteur (suite)
Dans cet exemple :
les événements sont des objets de la classe MouseEvent et
correspondent à des clics de la souris, ou à son entrée (ou sortie) du
composant graphique ;
ils sont traités, selon leur type, par un objet écouteur qui doit
implémenter la classe 4 écouteur associée à cette catégorie
d’événements 5 .
4. plus exactement, il s’agit d’une interface Java.
5. on peut voir celle-ci comme un «patron» que doit reproduire la classe de l’objet
écouteur.
Créer une interface graphique en Java 9 / 19
La notion d’écouteur
La notion d’écouteur (suite)
Ici cette classe se nomme MouseListener. Elle contient les
méthodes suivantes :
// que faire lors d'un clic
public void mouseClicked(MouseEvent ev){}
// que faire lors de l'appui d'un bouton
public void mousePressed(MouseEvent ev){}
// que faire lors du relâchement d'un bouton
public void mouseReleased(MouseEvent ev){}
// que faire lors de l'entrée de la souris
public void mouseEntered(MouseEvent ev){}
// que faire lors de la sortie de la souris
public void mouseReleased(MouseEvent ev){}
Créer une interface graphique en Java 10 / 19
La notion d’écouteur
La notion d’écouteur (suite)
La classe de l’objet écouteur ne redéfinit en fait que les méthodes de
MouseListener dont elle a besoin (ici ce sera mouseClicked).
Dans la déclaration de cette classe implements MouseListener
indique que cette classe sera susceptible d’écouter ce type
d’événements.
enfin l’objet source doit s’attacher à l’objet écouteur, afin de lui
transmettre les événements qui seront produits, à l’aide de
addMouseListener().
On remarque qu’ici l’objet source et écouteur sont le même, à savoir la
fenêtre.
Le code ci-dessous montre comment réaliser cette gestion des clics
(tester ce code).
Créer une interface graphique en Java 11 / 19
La notion d’écouteur
La notion d’écouteur (suite)
import javax .swing .∗;
import java .[Link] .∗;
public class MaFenetre extends JFrame
implements MouseListener { // la fenêtre sera un écouteur des MouseEvent
public MaFenetre(String titre , int larg , int haut) { // constructeur
setTitle ( titre );
setSize ( larg , haut);
this .addMouseListener(this ); // la fenêtre est son propre écouteur
}
public void mouseClicked(MouseEvent e) { // que faire si clic ds la fenêtre
[Link]. println (" clic dans la fenêtre " ); }
public void mouseEntered(MouseEvent e) {} // méthodes non utilisées
public void mouseExited(MouseEvent e) {} // mais à implémenter
public void mousePressed(MouseEvent e) {}
public void mouseReleased(MouseEvent e) {}
public static void main(String [] args) {
MaFenetre fen = new MaFenetre("fenetre qui gère les clics ", 300, 150);
fen . setVisible ( true );
}
}
Créer une interface graphique en Java 12 / 19
La notion d’écouteur
La notion d’écouteur (suite)
On peut facilement améliorer le programme précédent en le rendant
capable de déterminer, à chaque clic de souris, l’origine (coordonnées
(x,y)) de ce dernier et en affichant ces coordonnées.
L’objet de la classe MouseEvent qui est transmis à la méthode
MouseClicked dispose en effet de méthodes, getX() et getY(), qui
renvoient ces coordonnées 6 .
Le code source ci-dessous illustre cette possibilité (le tester).
6. celles-ci sont relatives au composant où le clic s’est produit.
Créer une interface graphique en Java 13 / 19
La notion d’écouteur
La notion d’écouteur (suite)
import javax .swing .∗;
import java .[Link] .∗;
public class MaFenetre extends JFrame
implements MouseListener { // la fenêtre sera un écouteur des MouseEvent
public MaFenetre(String titre , int larg , int haut) { // constructeur
setTitle ( titre );
setSize ( larg , haut);
this .addMouseListener(this ); // la fenêtre est son propre écouteur
}
public void mouseClicked(MouseEvent e) { // que faire si clic ds la fenêtre
int x = [Link](); int y = [Link]();
[Link]. println (" clic dans la fenêtre au point de coordonnées " + x
+ " , " + y);
}
public void mouseEntered(MouseEvent e) {} // méthodes non utilisées
public void mouseExited(MouseEvent e) {} // mais à implémenter
public void mousePressed(MouseEvent e) {}
public void mouseReleased(MouseEvent e) {}
public static void main(String [] args) {
MaFenetre fen = new MaFenetre("fenetre qui gère les clics ", 300,150);
fen . setVisible ( true );
}
}
Créer une interface graphique en Java 14 / 19
Sommaire
1 Introduction
2 Une première fenêtre
3 La notion d’écouteur
4 Un bouton dans la fenêtre
5 La fenêtre écoute le bouton
Un bouton dans la fenêtre
Un bouton dans la fenêtre
On montre maintenant comment on peut ajouter à une fenêtre un
bouton, gérer son positionnement et l’associer à un écouteur.
Un bouton est un objet de la classe JButton. On peut indiquer, par son
constructeur, l’étiquette qui figurera sur le bouton :
JButton monbouton = new JButton("texte");
Pour l’ajouter à la fenêtre, il est nécessaire de récupérer le contenu de
celle-ci 7 , et d’ajouter le bouton à ce contenu :
getContentPane().add(monBouton);
7. Un fenêtre Java est constituée d’une racine, d’un contenu et d’une vitre. Les
composants graphiques sont placés sur le contenu de la fenêtre.
Créer une interface graphique en Java 15 / 19
Un bouton dans la fenêtre
Un bouton dans la fenêtre (suite)
Le positionnement du bouton dans la fenêtre est géré par le gestionnaire
de mise en forme de celle-ci. On peut choisir un gestionnaire en appelant
la méthode setLayout sur le contenu de la fenêtre. Un choix possible 8
est celui du gestionnaire FlowLayout
getContentPane().setLayout(new FlowLayout());
Le code suivant se contente d’afficher un bouton dans le fenêtre.
8. qui permet, contrairement au gestionnaire par défaut, d’avoir un bouton dont la
taille n’occupe pas toute la fenêtre.
Créer une interface graphique en Java 16 / 19
Un bouton dans la fenêtre
Un bouton dans la fenêtre (suite)
import javax .swing .∗;
import java .awt.∗;
public class MaFenetre extends JFrame {
public MaFenetre(String titre , int larg , int haut) { //constructeur
setTitle ( titre );
setSize ( larg , haut);
monBouton = new JButton("texte"); // création du bouton
getContentPane().setLayout(new FlowLayout()); // choix du gest . de
// mise en forme
getContentPane().add(monBouton); // ajout du bouton à la fenêtre
}
private JButton monBouton;
public static void main(String [] args) {
MaFenetre fen = new MaFenetre("fenetre avec un bouton", 300, 150);
fen . setVisible ( true );
}
}
Créer une interface graphique en Java 17 / 19
Sommaire
1 Introduction
2 Une première fenêtre
3 La notion d’écouteur
4 Un bouton dans la fenêtre
5 La fenêtre écoute le bouton
La fenêtre écoute le bouton
La fenêtre écoute le bouton
Un bouton est une source d’événements de la classe ActionEvent, ne
contenant qu’un seul type d’événement géré par la méthode
actionPerformed de l’interface ActionListener
Pour que le bouton soit écouté par la fenêtre il faut :
que la fenêtre implémente l’interface ActionListener et redéfinisse
la méthode actionPerformed
que le bouton (objet source des événements) soit attaché à son
écouteur (la fenêtre) avec la méthode addActionListener(), à
laquelle on doit passer la référence à la fenêtre.
Cette démarche donne le code suivant (à tester) :
Créer une interface graphique en Java 18 / 19
La fenêtre écoute le bouton
La fenêtre écoute le bouton (suite)
import javax .swing .∗;
import java .awt.∗;
import java .[Link] .∗;
public class MaFenetre extends JFrame
implements ActionListener { // la fenêtre peut écouter un bouton
// constructeur
public MaFenetre(String titre , int larg , int haut) {
setTitle ( titre );
setSize ( larg , haut);
monBouton = new JButton("texte"); // création du bouton
[Link](this); // le bouton est écouté par la fenêtre
getContentPane().setLayout(new FlowLayout()); // choix du gest . de
// mise en forme
getContentPane().add(monBouton); // ajout du bouton à la fenêtre
}
public void actionPerformed(ActionEvent e) { // que faire si appui
[Link]. println ("appui sur le bouton"); // sur le bouton
}
private JButton monBouton;
public static void main(String [] args) {
MaFenetre fen = new MaFenetre("fenetre avec un bouton", 300,150);
fen . setVisible ( true );
}
} Créer une interface graphique en Java 19 / 19