TP 3 : Interface Graphique 1 - l`informatique c`est de la loisir

Département Informatique
POO
I4
2009-2010
TP 3 : Interface Graphique 1
Plan :
* But
* Objectif
* Introduction : présentation de Netbeans
* Utilisation des composants : fenêtre, bouton, zones de texte, label
* Paramétrer les composants, conventions de programmation
* Ajouter les événements
* Récapitulatif
Réalisation :
1. GHARBI Sami
2. ECHY Meriam
3. HAMDANI Hanen
Coordinateur:
ZIDI Kamel
1
Département Informatique
POO
I4
2009-2010
But :
On veut créer une application graphique permettant d'ajouter un texte saisi par l'utilisateur,
dans une zone de texte multi-ligne et un bouton Quitter qui permet d’arrêter l'application.
Déployer cette application et la tester sur une architecture hôte.
Objectif :
A la fin de ce TP, il faut avoir une fenêtre comme la suivante avec les événements de chaque
composant :
I) Introduction : présentation de NetBeans :
NetBeans est un EDI (environnement de développement intégré) permettant l'édition, la
compilation et la construction des programmes java. L'édition peut être assistée par la
complétion du code et le dessin des interfaces graphiques de manière WYSIWYG en
générant le code en arrière plan.
2
Département Informatique
POO
I4
2009-2010
6
4
2
1
3
5
Interface de NetBeans
1: espace de design (fenêtre)
2: palette des composants graphiques
3: palette des propriétés du composant sélectionné sur l’espace de design
4: explorateur des projets
5 : explorateur des composants
II) Les composants nécessaires :
Composant
Classe (javax.swing)
fenêtre
JFrame
bouton
JButton
zone de texte
JTextField
zone de texte multi-ligne
JTextArea
label
JLabel
3
Département Informatique
POO
I4
2009-2010
III) Création d’un projet :
Cliquer sur le bouton New Project de la barre d’outils :
Choisir le type de projet : Java Application pour créer une application graphique :
Définir les propriétés du projet :
nom, chemin, définir une classe Main, le définir comme projet principal.
4
Département Informatique
POO
I4
2009-2010
IV) Composant racine : fenêtre :
IV-1) Ajouter une fenêtre :
Pour ajouter une fenêtre au projet on sélectionne le dossier :
Source Packages->New->JFrame Form
IV-2) Paramétrer une fenêtre :
Donner un nom à la classe de la fenêtre. Par exemple le nom Principale :
5
Département Informatique
POO
I4
2009-2010
Un espace de dessin apparaît. La palette des composants apparaît aussi :
6
Département Informatique
POO
I4
2009-2010
IV-3) Les éléments de base d’une fenêtre :
Utilisation des objets de la fenêtre :
Une fenêtre graphique peut se manipuler sous forme graphique (utilisez l’onglet Design) ou
sous forme textuelle (onglet Source). La construction d’une interface se fait en mode Design.
Tous les objets graphiques nécessaires à une interface sont regroupés dans l’onglet Palette.
Lorsqu’un objet graphique est sélectionné à la souris, l’onglet Properties permet de manipuler
ses propriétés (couleur, position, forme,….).
7
Département Informatique
POO
I4
2009-2010
Les principales propriétés d’une fenêtre :
Propriété
Signification
title
Titre de la fenêtre
resizable
Booléen définissant si la fenêtre peut changer de taille (un
bouton redimensionner est activé ou désactivé)
true: la fenêtre peut changer de taille.
false: la fenêtre est de taille fixe (boite de dialogue).
defaultCloseOperation Définit que fait le bouton X de la fenêtre:
EXIT_ON_CLOSE: la fermeture arrête l'application.
HIDE: la fermeture cache la fenêtre et l'application
continue à tourner.
8
Département Informatique
POO
I4
2009-2010
Pour donner un nom à une fenêtre, on la sélectionne et on donne un nom au niveau de la
propriété title. Par exemple ici PRINCIPALE. On obtiendra alors une fenêtre comme suit :
V) Ajouter un bouton :
Un composant bouton est une variable de type javax.swing.JButton.
Propriétés:
Propriété
Signification
text
Texte affiché sur le bouton
font
Définit la police utilisée pour le texte
foreground Couleur du texte
icon
Icône ajoutée au bouton
Au niveau du text on va modifier le nom du bouton, dans ce TP on va créer deux boutons OK
et Quitter
Dans la liste des composants et au niveau Palette on va sélectionner Button.
VI) Ajouter une zone de texte :
Un composant texte est une variable de type javax.swing.JTextField. Ici il est nommé Nom.
9
Département Informatique
POO
I4
2009-2010
Propriétés:
Propriété
Signification
text
Texte contenu dans la zone lors de lancement de
la fenêtre.
font
Définit la police utilisée pour le texte
foreground Couleur du texte
Méthodes
setText(String S): affiche dans la zone de texte la chaîne S.
getText(): renvoie le texte contenu dans une zone de texte.
VII) Ajouter une zone de texte multi ligne :
Un composant texte multi ligne est une variable de type javax.swing.JTextArea. Ici on va
avoir l’affichage dans JTextArea de « Bonjour monsieur X » en cliquant sur le bouton
OK, X c’est le nom saisie par l’utilisateur.
Propriétés:
Propriété
Signification
text
Texte contenu dans la zone lors de lancement de la fenêtre.
font
Définit la police utilisée pour le texte
foreground Couleur du texte
Méthodes
setText(String S): affiche dans la zone de texte la chaîne S.
append(String S): ajouter la chaîne S à la fin de zone de texte.
getText(): renvoie le texte contenu dans une zone de texte.
VIII) Ajouter des événements :
Chaque composant peut réagir à des événements utilisateur. Il suffit de choisir
l'événement en question et la méthode qui sera lancée si l'événement est réalisé. La
méthode s'appelle dans ce cas Handler. Dans la fenêtre Properties de chaque composant
un bouton Events permet de choisir l'événement adéquat
10
Département Informatique
POO
I4
2009-2010
Événement du bouton
Événement
Type associé
Signification
Clic
actionPerformed
Lorsqu'on clic avec la souris
IX) Créer un Handler :
Il suffit de donner un nom de méthode qui sera associée au clic du bouton et y ajouter le
code adéquat.
Pour le bouton Quitter refaire le même travail (choisir l’événement) et le code permettant
d'arrêter l'application est:
System.exit(0);
X) Récapitulatif :
Une application graphique java est un projet de type Java Application. Le composant de
base d’une application java est une fenêtre (sous classe de javax.swing.JFrame). Cette
dernière contient les autres composants. Chaque composant peut être paramétré grâce à
ses propriétés.
Créer les handler : tout composant est censé émettre des événements, d’ou il est utile de
lui créer un handler pour chaque événement.
Générer l'exécutable : la construction du projet permet de créer un fichier jar qui
représente l’exécutable java.
11