chapitre i : développement des interfaces graphiques en java€¦ · introduction 3 mme hechkel...
Post on 03-Oct-2020
6 Views
Preview:
TRANSCRIPT
Cours Programmation Objet Avancée
Chapitre I : Développement des Interfaces
Graphiques en Java
Elaboré par Mme Amina HECHKEL
AU: 2015/2016
I S E T M a h d i a
D é p a r t e m e n t T e c h n o l o g i e s d e l ’ i n f o r m a t i q u e
1
Plan
Mme Hechkel Amina 2
Introduction
Swing ou AWT ?
Les composants SWING
Containers lourds et containers légers
Composants atomiques
Gestionnaire de disposition
Gestion des événements
Méthodes d’implémentations d’un écouteur
Les adaptateurs: classes Adapter
SWING et le pattern MVC
Introduction
Mme Hechkel Amina 3
L’exécution d’un programme JAVA entraîne automatiquement
la création d’une fenêtre console
Dans le cas d’une interface graphique, le programme doit créer
explicitement la/les interfaces graphiques nécessaires.
Il existe deux grandes familles de composant graphique en
JAVA:
AWT
SWING
Introduction
Mme Hechkel Amina 4
AWT (Abstract Window Toolkit, JDK 1.1)
Swing (JDK/SDK 1.2)
Swing et AWT font partie de JFC (Java Foundation Classes)
qui offre des facilités pour construire des interfaces
graphiques
Swing est construit au-dessus de AWT
même gestion des événements
les classes de Swing héritent des classes de AWT
AWT
Mme Hechkel Amina 5
Les classes du toolkit AWT (Abstract Windows Toolkit) permettent d'écrire des interfaces graphiques indépendantes du système d'exploitation sur lesquelles elles vont fonctionner.
Cette librairie utilise le système graphique de la plateforme d'exécution (Windows, MacOS, …) pour afficher les objets graphiques.
Le toolkit contient des classes décrivant les composants graphiques, les polices, les couleurs et les images.
Hiérarchie des Composants AWT
Mme Hechkel Amina 6
La classe java.awt.Toolkit
Mme Hechkel Amina 7
Les sous-classes de la classe abstraite Toolkit implantent la partie de AWT qui est en contact avec le système d’exploitation hôte.
Quelques méthodes publiques :
getScreenSize(),
getScreenResolution(),
Beep(),
getImage(),
createImage(),
getSystemEventQueue()
getDefaultToolkit(): fournit une instance de la classe qui implante Toolkit (classe donnée par la propriété awt.toolkit)
Exemple
Mme Hechkel Amina 8
public static void main(String[] args) {
JFrame f=new JFrame("Mon dessin");
// Centrage de la fenêtre
Toolkit tk = Toolkit.getDefaultToolkit();
Dimension d = tk.getScreenSize();
int hauteurEcran = d.height;
int largeurEcran = d.width;
f.setSize(largeurEcran/2, hauteurEcran/2);
f.setLocation(largeurEcran/4, hauteurEcran/4);
// tant qu’on y est, ajoutons l’icône…
Image img = tk.getImage("image.gif");
f.setIconImage(img);
f.show ();
f.setDefaultCloseOperation (WindowConstants.EXIT_ON_CLOSE);
}
SWING
Mme Hechkel Amina 9
Swing fait partie de la bibliothèque Java Foundation Classes (JFC).
Swing a été intégrée au JDK depuis sa version 1.2. Cette bibliothèque existe séparément pour le JDK 1.1.
La bibliothèque JFC contient :
l'AWT (Abstract Window Toolkit), la boîte à outils d'origine de l'interface
utilisateur ;
Swing, la boîte à outil de l'interface utilisateur ;
L‘API d’accessibilité, qui propose des outils permettant d'intégrer des
périphériques d'entrée et sortie non standard à vos interfaces
utilisateurs;
L'API 2D, ensembles de classes cohérentes permettant des dessins de
bonnes qualité ;
Drag and Drop, API supportant le "glisser-déplacer"
Swing ou AWT ?
Mme Hechkel Amina 10
Tous les composants de AWT ont leur équivalent dans Swing
en plus joli
avec plus de fonctionnalités
Swing offre de nombreux composants qui n’existent pas dans
AWT
Il est fortement conseillé d’utiliser les composants Swing et
ce cours sera donc centré sur Swing
SWING
Mme Hechkel Amina 11
Les composants Swing forment un nouvelle hiérarchie parallèle à celle de l'AWT.
Tous héritent du composant graphique JComponent
Jcomponent hérite du composant graphique AWT Container qui permet à un composant d’en contenir d’autres.
Presque tous ces composants sont écrits en pure Java : ils ne possèdent aucune partie native sauf ceux qui assurent l'interface avec le système d'exploitation : JApplet, JDialog, JFrame, et JWindow.
Cela permet aux composants de toujours avoir la même apparence quelque soit le système sur lequel l'application s'exécute.
Hiérarchie des Composants SWING
Mme Hechkel Amina 12
Composants lourds et Composants légers
Mme Hechkel Amina 13
Pour afficher des fenêtres, Java s’appuie sur les fenêtres fournies par le système d’exploitation dans lequel tourne la JVM,
Les composants Java qui, comme les JFrame, s’appuient sur des composants du système hôte sont dit lourds.
Fenêtres de base ou «Top-level» Containers.
Les autres composants, dits légers, sont dessinés par Swing dans ces containers lourds.
Tous les composants de Swing, exceptés JApplet, JDialog, JFrame et JWindow sont des composants légers.
Les composants SWING
Mme Hechkel Amina 14
Une application est composée de trois catégories d’objets:
Les conteneurs
Les classes d'interactions, c'est-à-dire les composants
(intermédiaires et atomiques)
Les classes de liaisons, pour la gestion des événements
(Event), le gestionnaire de disposition (Layout), …etc.
Les Conteneurs
Mme Hechkel Amina 15
Les conteneurs sont des objets graphiques qui sont destinés
spécifiquement à recevoir d’autres éléments graphiques.
Les conteneurs peuvent éventuellement contenir d’autres
conteneurs.
Ils héritent de la classe Container.
Un composant graphique doit toujours être incorporer dans
un conteneur.
Containers lourds
Mme Hechkel Amina 16
Il y a 3 sortes de containers lourds (un autre, JWindow, est plus
rarement utilisé) :
JFrame fenêtre pour les applications
JApplet pour les applets
JDialog pour les fenêtres de dialogue
Pour construire une interface graphique avec Swing, il faut créer
un (ou plusieurs) container lourd et placer à l’intérieur les
composants légers qui forment l'interface graphique
Hiérarchie d’héritage des containers lourds
Mme Hechkel Amina 17
Top-Level Container : JFrame
Mme Hechkel Amina 18
La Classe JFrame :
Elle représente une fenêtre principale qui possède un titre, une
taille modifiable et éventuellement un menu
Elle utilise un conteneur ou panneau de contenu (content pane)
pour insérer des composants (ils ne sont plus insérer
directement au JFrame mais à l'objet contentPane qui lui est
associé).
La classe JFrame possède plusieurs constructeurs parmi les quel on site :
JFrame() : Constructeur par default
JFrame(String titre) : Création d’une instance en précisant le Titre de la fenêtre.
Top-Level Container: JFrame
Mme Hechkel Amina 19
Parmi les méthodes de cette classe on site :
setTitle ( String title ): donner un titre pour la fenêtre
setSize(int width, int height): permet de préciser les
dimensions de la Fenêtre.
setLocation(int x, int y): fixer l’emplacement de la fenêtre
setVisible (boolean) : par default la fenêtre est invisible, pour
la rendre visible on fait appel à cette méthode.
setBounds(x,y, width, height): permet de modifier
simultanément la taille et la position d’un composant (en
particulier un Jframe)
setIconImage ( Image image )
getContentPane (): retourne le container sur lequel les
composants vont être ajoutés.
Top-Level Container: JFrame
Mme Hechkel Amina 20
import javax.swing.*;
class MaFenetre extends JFrame {
public MaFenetre() {
super(" Ma première Fenetre ");
setSize(200,100);
setVisible(true);
this.setLocation (250 ,150); // emplacement de la fenetre
}
public static void main(String [] args){
MaFenetre maFrame = new MaFenetre();
}
}
Le comportement par défaut à la fermeture:
Il est possible de préciser comment un objet JFrame, JInternalFrame, ou
JDialog réagit à sa fermeture grâce à la méthode
setDefaultCloseOperation().
Cette méthode attend en paramètre une valeur qui peut être :
Constante Rôle
WindowConstants.DISPOSE_ON_CLOSE détruit la fenêtre
WindowConstants.DO_NOTHING_ON_CLOSE rend le bouton de fermeture
inactif
WindowConstants.HIDE_ON_CLOSE cache la fenêtre
WindowConstants.EXIT_ON_CLOSE Quitte le programme
Mme Hechkel Amina 21
Top-Level Container: JFrame
Un JDialog est une fenêtre qui a pour but un échange d’information
Java propose un certain nombre de boîtes de dialogue standard
obtenues à l’aide de méthodes de classe de la classe JOptionPane :
Boîtes de message: JOptionPane.showMessageDialog()
Affiche un message et attend que l’utilisateur clique sur OK
Boîtes de confirmation: JOptionPane.showConfirmDialog()
Affiche un message et reçoit une confirmation (OK/Annuler)
Boîtes de saisie: JOptionPane.showInputDialog()
Affiche un message et récupère une ligne entrée par l’utilisateur
Boîtes d’options: JOptionPane.showOptionDialog()
Affiche un message et récupère l’option choisie parmi plusieurs
Mme Hechkel Amina 22
Top-Level Container: JDialog
Une boîte de message fournit à l’utilisateur un message qui reste affiché tant que l’utilisateur n’agit pas sur le bouton OK.
Elle est construite à l’aide de la méthode de classe showMessageDialog de la classe JOptionPane.
JOptionPane.showMessageDialog( getFrame(),"le message", "le titre",
messageType);
Les différentes valeurs de Message Type:
Mme Hechkel Amina 23
Top-Level Container: Jdialog
Type de message Valeurs
Erreur JOptionPane.ERROR_MESSAGE
Information JOptionPane.INFORMATION_MESSAGE
Avertissement JOptionPane.WARNING_MESSAGE
Question JOptionPane.QUESTION_MESSAGE
Aucune icône JOptionPane.PLAIN_MESSAGE
Exemple 1:
public static void main ( String args []) {
JFrame f = new JFrame ("Une fenêtre") ;
f. setVisible ( true ) ;
JOptionPane.showMessageDialog (f,
" Bonjour ") ;
}
Exemple 2:
JOptionPane . showMessageDialog (f,
"Mauvais choix " ," Message d’ avertissement",
JOptionPane . ERROR_MESSAGE ) ;
Mme Hechkel Amina 24
Top-Level Container: JDialog
Une boîte de confirmation offre à l’utilisateur un choix de type
oui/non. Elle est construite à l’aide de la méthode de classe
showConfirmDialog de la classe JOptionPane.
JOptionPane.showConfirmDialog(getFrame(), "le message", "le
titre", optionType);
Le champ optionType représente le type du message et peut
prendre l’une des valeurs suivantes :
Mme Hechkel Amina 25
Top-Level Container: JDialog
Option Type Valeurs
OK JOptionPane.DEFAULT_OPTION / -1
Oui,Non JOptionPane.YES_NO_OPTION / 0
Oui,Non,Annuler JOptionPane.YES_NO_CANCEL_OPTION / 1
OK, Annuler JOptionPane.OK_CANCEL_OPTION / 2
Exemple 3:
import java . awt .* ; import javax . swing .* ; class MaFenetre extends JFrame { public MaFenetre () { super (" Une fenêtre ") ; setSize (300 , 200) ; } } public class BoiteConf { public static void main ( String args []) { JFrame f = new MaFenetre () ; f. setVisible ( true ) ; JOptionPane . showConfirmDialog (f , " Voulez - vous continuer ? ", " Sélectionnez une option ", JOptionPane.YES_NO_CANCEL_OPTION) ; } }
Mme Hechkel Amina 26
Top-Level Container: JDialog
Containers légers
Mme Hechkel Amina 27
les containers « intermédiaires » ou légers :
JPanel,
JScrollPane,
JSplitPane,
JTabbedPane,
JToolPane,
…
Le conteneur léger : JPanel
Mme Hechkel Amina 28
JPanel est la classe mère des containers intermédiaires les
plus simples.
Un JPanel sert à regrouper des composants dans une zone
d'écran.
Quelques méthodes de JPanel :
JPanel(LayoutManager) qui accepte en paramètre un objet de
placement et construit le JPanel associé à cet objet.
Void setLayout(LayoutManager): associe au Conteneur l’objet de
placement passé en paramètre.
void add(Component): ajoute ce composant au Conteneur sans
désignation de zone lorsque l’objet de placement n’en a pas besoin
(FlowLayout, GridLayout ou GridBagLayout)
void remove(Component): enlève ce composant du Conteneur
Conteneur léger : JScrollPane
Mme Hechkel Amina 29
JScrollPane est une version améliorée de JPanel qui possède des
ascenseurs de défilement vertical et horizontal.
Quelques méthodes de JScrollPane :
JScrollPane(): crée un JScrollPane vide
JScrollPane(Component): crée un JScrollPane contenant un seul
composant (celui passé en paramètre).
JScrollPane(int,int): crée un JScrollPane vide en précisant le
comportement des ascenseurs
JScrollPane(Component,int,int): crée un JScrollPane contenant un
seul composant (celui passé en paramètre) en précisant le
comportement des ascenseurs. Le premier entier définit le
comportement de l’ascenseur vertical et le dernier entier définit le
comportement de l’ascenseur horizontal
Conteneur léger : JScrollPane
Mme Hechkel Amina 30
Le comportement de l’ascenseur vertical prend les valeurs suivantes :
JScrollPane.VERTICAL_SCROLLBAR_AS_NEEDED(l’ascenseur
n’apparaît que s’il es nécessaire)
JScrollPane.VERTICAL_SCROLLBAR_NEVER (pas d’ascenseur)
JScrollPane.VERTICAL_SCROLLBAR_ALWAYS(l’ascenseur est
toujours présent)
Le comportement de l’ascenseur horizontal prend les valeurs
suivantes:
JScrollPane.HORIZONTAL_SCROLLBAR_AS_NEEDED(l’ascenseur
n’apparaît que s’il est nécessaire)
JScrollPane.HORIZONTAL_SCROLLBAR_NEVER (pas
d’ascenseur)
JScrollPane.HORIZONTAL_SCROLLBAR_ALWAYS(l’ascenseur
est toujours présent).
Résumé : Liste de Conteneurs
Conteneur Rôle
JWindow Fenêtre principale sans cadre ni menu. Les objets
descendants de cette classe peuvent servir à
implémenter des menus
JFrame Classe de fenêtre complètement fonctionnelle
JDialog Réaliser des boîtes de dialogue simples
JApplet Pas de menu, pas de boîte de dialogue sans être
incorporée dans une classe Frame.
JPanel Conteneur sans fenêtre propre. Utile pour ordonner les
contrôles.
Mme Hechkel Amina 31
Insertion de composant
Mme Hechkel Amina 32
Une fois j’ai construit ma
fenêtre, comment vais-je
créer les composants et ou
vais-je les insérer.
Les composants
Mme Hechkel Amina 33
Pour utiliser un composant, il faut créer un nouvel objet
représentant le composant et l'ajouter à un de type conteneur
qui existe avec la méthode add().
Exemples de composant :
JLabel : les étiquettes
JButton : les boutons
JTextField : les champs texte
JTextArea : les zones de texte multiligne.
JRadioButton: un ensemble de bouton
JMenutItem: un bouton dans un menu
JCheckBox: les cases à cocher.
…
Exemple de Composant
Mme Hechkel Amina 34
Les Labels:
Il faut utiliser un objet de la classe javax.swing.JLabel
Cette classe possède deux constructeurs :
JLabel() : zone Label vide.
JLabel(String): Créer une zone label avec le texte passer comme
paramètre.
Quelques méthodes :
void setText() : affecte du texte a la zone label.
void setSize(int, int): affecte une dimension au a a zone Label.
…
Exemple:
JLabel nom = new JLabel( "Nom : " );
Nom.setBounds(10,10, 100,20);
Exemple de Composant
Mme Hechkel Amina 35
Les zones de texte:
Il faut utiliser un objet de la classe javax.swing.JTextField
Cette classe possède deux constructeurs :
JTextField () : zone de texte vide.
JTextField (String): Créer une zone de texte avec le texte passer
comme paramètre.
Quelques méthodes :
void setText() : affecte du texte a la zone label.
void setSize(width, height): affecte une dimension à la zone de texte.
String getTexte() : retourne le texte ce trouvant dans la zone texte.
…
Exemple:
JTextField t1=new JTextField("");
T1.setSize(100,20);
Exemple de Composant
Mme Hechkel Amina 36
Les Boutons:
Il faut utiliser un objet de la classe javax.swing.JButton
Cette classe possède deux constructeurs :
JButton() : bouton sans Nom.
JButton(String): Permet de préciser le libellé du bouton.
Quelques méthodes :
void setLabel(String) : affecte un libellé au bouton.
void setSize(int, int): affecte une dimension au bouton.
…
Exemple:
JButton b1 = new JButton (" Valider" );
b1.setSize(100,20);
Exemple de Composant
Mme Hechkel Amina 37
Les cases à cocher:
Il faut utiliser un objet de la classe javax.swing.JCheckBox
Ses principales méthodes sont :
JCheckBox(String): construction avec définition du texte contenu
dans la case à cocher
JCheckBox(String,boolean): construction avec en plus définition
de l’état initial de la case à cocher
boolean isSelected(): qui retourne l’état de la case à cocher
(cochée ou non). Par défaut, une case à cocher est construite dans
l’état non coché (false).
void setSelected(boolean): qui définit l’état de la case à cocher
(cochée ou non).
String getText(): qui retourne le texte contenu dans la case à
cocher.
Exemple de Composant
Mme Hechkel Amina 38
Les Boutons radio: qui permet à l’utilisateur d’effectuer un choix de type oui/non.
Il faut utiliser un objet de la classe javax.swing.JRadioButton
Mais sa vocation est de faire partie d’un groupe de boutons dans lequel
une seule option peut être sélectionnée à la fois.
Un objet de type ButtonGroup sert uniquement à assurer la
désactivation automatique d’un bouton lorsqu’un autre du groupe est
activé
Un bouton radio qui n’est pas associé à un groupe, exception faite de
son aspect, se comporte exactement comme une case à cocher.
Exemple: JRadioButton bvert = new JRadioButton (" Vert ") ;
ButtonGroup groupe = new ButtonGroup () ;
groupe . add( bvert ) ;
Exemple de Composant
Mme Hechkel Amina 39
JComboBox: est un composant permettant de faire un seul choix
parmi plusieurs propositions.
Quelques méthodes de JComboBox :
JComboBox(Object[]) construction avec définition de la liste. On
peut utiliser un tableau de chaînes de caractères (String) ou de toute
autre classe d’objets.
void addItem(Object) qui ajoute une valeur possible de choix
int getSelectedIndex() qui retourne le numéro du choix actuel qui
retourne l’objet associé au choix actuel.
void setSelectedIndex(int) qui sélectionne un élément défini par son
numéro
Exemple: String [] tab = {" Option 1", " Option 2", " Option 3", " Option 4"};
JComboBox combo = new JComboBox ( tab );
Exemple de Composant
Mme Hechkel Amina 40
JMenuBar est un composant qui permet de créer une barre de menu, on
ajoute des JMenu dans la barre.
Pour définir des Menus, on utilise 3 classes JMenuBar, JMenu, JMenuItem
Un objet JMenu possède un label, et quand on clique dessus, il peut montrer un
menu déroulant
Un item d’un objet JMenu peut être un objet de type JMenuItem,
JCheckBoxMenuItem ou JRadioButtonMenuItem
La méthode addSeparator() peut être utilisée pour insérer un espace entre les
composants de la barre d’outils.
Exemple:
JMenuBar jmb = new JMenuBar ();
this . setJMenuBar ( jmb );
JMenu m1 = new JMenu (" Définir ");
m1. add( new JMenuItem (" le nom " ));
jmb. add( m1);
JMenu m2 = new JMenu (" Afficher ");
m2. add( new JMenuItem (" le prenom " ));
jmb. add( m2 );
Les gestionnaires de disposition
Mme Hechkel Amina 41
L’utilisateur peut changer la taille d’une fenêtre ; les composants de
la fenêtre doivent alors être repositionnés.
Les fenêtres (plus généralement les containers) utilisent des
gestionnaires de mise en place (Layout manager) pour
repositionner leurs composants.
Il existe plusieurs types de layout managers avec des algorithmes de
placement différents, tels que : BorderLayout, BoxLayout,
CardLayout, FlowLayout, GridLayout, GridBagLayout.
Layout Manager
Mme Hechkel Amina 42
Quand on ajoute un composant dans un container on ne donne pas la position exacte du composant.
On donne plutôt des indications de positionnement au gestionnaire de mise en place. explicites (BorderLayout.NORTH)
ou implicites (ordre d’ajout dans le container)
Un layout manager place les composants « au mieux » suivant l’algorithme de placement qui lui est propre
les indications de positionnement des composants
la taille du container
les tailles préférées des composants
Layout Manager
Mme Hechkel Amina 43
Chaque layout manager implémente l'interface
java.awt.LayoutManager. Par défaut, c'est la classe
FlowLayout qui est utilisée pour la classe Panel et la classe
BorderLayout pour Frame et Dialog.
Les layout manager ont 3 avantages :
l'aménagement des composants graphiques est délégué aux
layout manager (il est inutile d'utiliser les coordonnées
absolues)
en cas de redimensionnement de la fenêtre, les contrôles sont
automatiquement agrandis ou réduits.
ils permettent une indépendance vis à vis des plateformes.
Tailles des composants
Mme Hechkel Amina 44
Tous les composants graphiques (classe Component)
peuvent indiquer leurs tailles pour l’affichage
taille maximum
taille préférée
taille minimum
Accesseurs et modificateurs associés :
{get|set}{Maximum|Preferred|Minimum}Size
Tailles des composants
Mme Hechkel Amina 45
Taille préférée:
La taille préférée est la plus utilisée par les layout managers ; un composant peut l’indiquer en redéfinissant la méthode « Dimension getPreferredSize() »
On peut aussi l’imposer « de l’extérieur » avec la méthode « void setPreferredSize(Dimension) »
Mais le plus souvent, les gestionnaires de mise en place ne tiendront pas compte des tailles imposées de l’extérieur
Taille minimum:
Quand un composant n’a plus la place pour être affiché à sa taille préférée, il est affiché à sa taille minimum sans passer par des tailles intermédiaires.
Si la taille minimum est très petite, ça n’est pas du plus bel effet ; il est alors conseillé de fixer une taille minimum, par exemple par c.setMinimumSize(c.getPreferredSize());
Types de Gestionnaires de disposition
Mme Hechkel Amina 46
Les types les plus courants de gestionnaire de mise en place:
BorderLayout : placer aux 5 points cardinaux
FlowLayout : placer à la suite
GridLayout : placer dans une grille
BoxLayout : placer verticalement ou horizontalement
GridBagLayout : placements complexes
Le FlowLayout
Mme Hechkel Amina 47
La classe FlowLayout (mise en page flot) place les composants ligne par
ligne de gauche à droite. Chaque ligne est complétée progressivement
jusqu'à être remplie, puis passe à la suivante. Chaque ligne est centrée par
défaut. C'est la mise en page par défaut des applets.
Il existe plusieurs constructeurs :
FlowLayout( )
FlowLayout( int align) : Permet de préciser l'alignement des composants
dans le conteneur (FlowLayout.CENTER, FlowLayout.LEFT,
FlowLayout.RIGHT ... ). Par défaut, align vaut CENTER
FlowLayout(int align, int hgap, int vgap) :Permet de préciser l'alignement
et l’espacement horizontal et vertival dont la valeur par défaut est 5.
Le FlowLayout
Mme Hechkel Amina 48
public MaFenetre() {
super("Ma première Fenetre");
JButton b=new JButton();
JLabel l=new JLabel();
JTextField f=new JTextField();
b.setText("mon bouton");
l.setText("ma zone label");
f.setText("ali va au sook");
this.getContentPane().setLayout(new
FlowLayout(FlowLayout.CENTER, 10,10));
this.getContentPane().add(b);
this.getContentPane().add(l);
this.getContentPane().add(f);
this.setDefaultCloseOperation(
DISPOSE_ON_CLOSE);
setVisible(true);
pack();
}
Le BorderLayout
Mme Hechkel Amina 49
Avec ce Layout Manager, la disposition des composants est commandée par une mise en page en bordure qui découpe la surface en cinq zones : North, South, East, West, Center. On peut librement utiliser une ou plusieurs zones.
BorderLayout consacre tout l'espace du conteneur aux composants. Le composant du milieu dispose de la place inutilisée par les autres composants.
Il existe plusieurs constructeurs :
BorderLayout( )
BorderLayout (int hgap,int vgap) Permet de préciser l'espacement horizontal et vertical des composants.
Le BorderLayout
Mme Hechkel Amina 50
public MaFenetre() {
super();
setTitle("Ma Fenetre ");
setSize(300, 150);
getContentPane().setLayout(new BorderLayout(10,10));
getContentPane().add("North", new JButton(" bouton haut "));
getContentPane().add("South", new JButton(" bouton bas "));
getContentPane().add("West", new JButton(" bouton gauche "));
getContentPane().add("East", new JButton(" bouton droite "));
getContentPane().add("Center", new JButton(" bouton milieu "));
pack();
show();
this.setDefaultCloseOperation(WindowConstants.DISPOSE_ON_CLOSE);
}
Le BorderLayout
Mme Hechkel Amina 51
Le GridLayout
Mme Hechkel Amina 52
Ce Layout Manager établit un réseau de cellule
identiques qui forment une sorte de quadrillage
invisible : les composants sont organisés en lignes et
en colonnes. Les éléments insérés dans la grille ont
tous la même taille. Les cellules du quadrillage se
remplissent de droite à gauche ou de haut en bas.
Il existe plusieurs constructeurs :
GridLayout( int, int ) : Les deux premiers entiers spécifient le
nombre de lignes ou de colonnes de la grille.
GridLayout( int, int, int, int ) : permet de préciser en plus
l'espacement horizontal et vertical des composants.
Le GridLayout
Mme Hechkel Amina 53
public MaFenetre() {
super();
setTitle(" Ma Fenetre ");
setSize(300, 150);
this.getContentPane().setLayout(new GridLayout(2, 3, 10,10));
this.getContentPane().add(new Button("bouton 1"));
this.getContentPane().add(new Button("bouton 2"));
this.getContentPane().add(new Button("bouton 3"));
this.getContentPane().add(new Button("bouton 4"));
this.getContentPane().add(new Button("bouton 5
tres long"));
this.getContentPane().add(new Button("bouton 6"));
show();
setDefaultCloseOperation(WindowConstants.DISPOSE_ON_CLOSE);
}
Comment insérer les composants
Mme Hechkel Amina 54
Ayant créer le conteneur.
Étendre la classe JFrame
Choisit les composants à utiliser.
Création des boutons et zone de texte…
Choisit le layout à utiliser
Méthode setLayout(…)
On peut maintenant insérer les composants dans le conteneur.
Méthode add(…)
La Gestion des événements
Mme Hechkel Amina 55
Exposition du problème: L'utilisateur utilise le clavier et la souris pour intervenir sur le
déroulement du programme.
Le système d’exploitation engendre des événements à partir des actions de l’utilisateur.
Le programme doit lier des traitements à ces événements.
Types d'événements: Événements de bas niveau, générés directement par des actions
élémentaires de l’utilisateur.
Événements « logiques » de plus haut niveau, engendrés par plusieurs actions élémentaires, qui correspondent à une action complète de l'utilisateur.
Classes d'événements
Mme Hechkel Amina 56
Les événements sont représentés par des instances de sous-classes de java.util.EventObject.
Événements liés directement aux actions de l’utilisateur : KeyEvent : appuie sur une touche, relachement, …
MouseEvent : click par le bouton de la sourie, …
Événements de haut niveau : FocusEvent : élément ayant gagner le focus ou l’ayant perdu.
WindowEvent : fenetre ouverte, fermé, iconifiée, déiconifiée, activée ou désactivée.
ActionEvent : déclenchement d’une action.
ItemEvent : choix dans une liste, dans une boîte à cocher
ComponentEvent : composant déplacé, retaillé, caché ou montré
La Gestion des événements
Mme Hechkel Amina 57
Écouteurs:
Chacun des composants graphiques a ses observateurs (ou écouteurs, listeners)
Un écouteur doit s’enregistrer auprès des composants qu’il souhaite écouter, en lui indiquant le type d’événement qui l’intéresse (par exemple, clic de souris)
Relation écouteurs - écoutés
Un composant peut avoir plusieurs écouteurs (par exemple, 2 écouteurs un pour les clics de souris et un autre pour les frappes de touches du clavier)
Un écouteur peut écouter plusieurs composants.
La Gestion des événements
Mme Hechkel Amina 58
Une question ?
Quel message sera envoyé par le composant à ses écouteurs pour les prévenir
que l’événement qui les intéresse est arrivé ?
Réponse : à chaque type d’écouteur correspond une interface que doit
implémenter la classe de l’écouteur ; par exemple ActionListener, MouseListener ou KeyListener
Le message doit correspondre à une des méthodes de cette interface.
Exemple : les événements ActionEvent qui conduisent à des traitements simples
(écouteur ActionListener) les événements KeyEvent, au traitement plus complexe (écouteur
KeyListener et adaptateur KeyAdapter).
La Gestion des événements
Mme Hechkel Amina 59
Les événements utilisateurs sont gérés par plusieurs interfaces EventListener.
Les interfaces EventListener permettent à un composants de générer des événements utilisateurs.
Une classe doit contenir une interface auditeur pour chaque type de composant : ActionListener : clic de souris ou enfoncement de la touche Enter.
ItemListener : utilisation d'une liste ou d'une case à cocher.
MouseListener : événement de souris.
WindowListener : événement de fenêtre.
La Gestion des événements
Mme Hechkel Amina 60
La classe ActionEvent
Cette classe décrit des événements de haut niveau qui vont le plus souvent déclencher un traitement (une action) : clic sur un bouton
return dans une zone de saisie de texte
choix dans un menu
Interface ActionListener
Un objet ecouteur intéressé par les événements de type « action » (classe ActionEvent) doit appartenir à une classe qui implémente l’interface java.awt.event.ActionListener
Définition de ActionListener :
public interface ActionListener extends EventListener {
void actionPerformed(ActionEvent e); }
La Gestion des événements
Mme Hechkel Amina 61
Inscription de l’écouteur
On inscrit un tel écouteur auprès d’un composant nommé composant par la méthode composant.addActionListener(ecouteur);
On précise ainsi que ecouteur est intéressé par les événements ActionEvent engendrés par composant.
Message déclenché par un événement Un événement unActionEvent engendré par une action de l’utilisateur sur
bouton, provoquera l'envoi d'un message actionPerformed à tous les écouteurs :
ecouteur.actionPerformed(unActionEvent);
Ces messages sont envoyés automatiquement à tous les écouteurs qui se sont enregistrés auprès du bouton.
La Gestion des événements
Mme Hechkel Amina 62
Etapes d’implémentation d’un écouteur: (1ère façon) Une
classe implémentant elle même le listener.
1. Importer le groupe de classe java.awt.event
2. la classe doit déclarer qu'elle utilisera une ou plusieurs interfaces
d'écoute
3. Appel à la méthode addXXX() pour enregistrer l'objet qui gérera les
événements XXX du composant faut configurer le composant
pour qu'il possède un "écouteur" pour l'événement utilisateur
concerné.
4. implémenter les méthodes déclarées dans les interfaces : Chaque
auditeur possède des méthodes différentes qui sont appelées pour
traiter leurs évènements. Par exemple, l'interface ActionListener
envoie des évènements à une méthode nommée actionPerformed( ).
La Gestion des événements
Mme Hechkel Amina 63
Etapes d’implémentation d’un écouteur:
2ème façon: Une classe indépendante implémentant le
listener: Définir une classe, à part, qui représente l’écouteur,
implémente l’interface ActionListener et redéfinie la
méthode actionPerformed().
3ème façon: Le listener est défini comme une classe interne
qui implémente l’interface ActionListener.
4ème façon: Le listener est défini une classe interne
anonyme.
La Gestion des événements
Mme Hechkel Amina 64
Exemple :
L’écouteur ActionListener Possède comme méthode :
public void actionPerformed (ActionEvent e)
L’écouteur MouseListener possède comme méthodes :
public void mouseClicked(MouseEvent e)
public void mouseEntered(MouseEvent e)
public void mouseExited(MouseEvent e)
public void mousePressed(MouseEvent e)
public void mouseReleased(MouseEvent e)
L’écouteur KeyListener possède comme méthodes :
public void keyPressed(KeyEvent e)
public void keyReleased(KeyEvent e)
public void keyTyped(KeyEvent e)
La Gestion des événements
Mme Hechkel Amina 65
Remarque :
Dans le cas ou plusieurs composants implémente le même écouteur on
peut utilisé la méthode getSource() pour savoir le composant ayant
générer l’action ou l’événement déclenché.
public Object getSource()
Exemple:
public void actionPerformed(ActionEvent e) {
Object src = e.getSource();
if( src instanceof JButton) {
JButton var=(JButton) src;
…..
}
Exemple Complet
Mme Hechkel Amina 66
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
class MaFenetre extends JFrame
implements ActionListener {
JButton b=new JButton("jouer");
JButton rejouer=new
JButton("refaire une autre partie");
JLabel l=new JLabel("");
JTextField f=new
JTextField("insérer un numéro");
int cacher=(int)
(Math.random()*100);
public MaFenetre() {
super();
setTitle(" Mon Jeux ");
setSize(300,200);
this.getContentPane(). setLayout(new
GridLayout(4, 1, 10,10));
this.getContentPane().add(f);
this.getContentPane().add(b);
this.getContentPane().add(l);
this.getContentPane().add(rejouer);
b.addActionListener(this);
rejouer.addActionListener(this);
this.setDefaultCloseOperation(
WindowConstants.EXIT_ON_CLOSE)
;
}
Exemple Complet
Mme Hechkel Amina 67
public void actionPerformed(ActionEvent e) {
Object src=e.getSource();
if(src instanceof JButton) {
JButton var=(JButton) src;
if (var==b) {
try{ int x=Integer.parseInt(f.getText());
if(x==cacher) {
f.setText("bravo!!!");
l.setText("vous avez trouver le bon numéro");
b.setEnabled(false); }
else if(x>cacher) {
l.setText("le nombre donner est supérieur a celui rechercher");
f.setText(""); }
else if(x<cacher) {
l.setText("le nombre donner est inférieur acelui rechercher");
f.setText("");}
}
Exemple Complet
Mme Hechkel Amina 68
catch(NumberFormatException nfe) { l.setText("entrer un nombre"); f.setText(""); } } else if (var==rejouer) { cacher=(int) (Math.random()*100); f.setText(""); l.setText(" bonne chance dans la nouvelle partie"); b.setEnabled(true); }} //Méthode de test public static void main(String [] args){ MaFenetre myFrame = new MaFenetre(); } }
Les Adaptateurs
69
L’écouteur défini à partir d’une interface XXXListener doit écrire
toutes les méthodes même si elles sont vides.
Pour chaque interface XXXListener possédant plusieurs méthodes,
Java fournit une classe particulière XXXAdapter, appelée
adaptateur, qui implémente toutes les méthodes de l’interface avec
un corps vide.
Pour définir un écouteur d’événements de type XXXEvent, il suffit
alors de dériver l’écouteur de la classe XXXAdapter et de redéfinir
uniquement les méthodes voulues.
Les Adaptateurs (2)
70
Les adaptateurs d’événement portent le suffixe Adapter (au lieu de Listener).
• Interfaces : MouseListener, KeyListener
• Classes : MouseAdapter, KeyAdapter
Pour l’écouteur défini par héritage d’une classe Adapter, seules les méthodes
utiles sont écrites (les autres sont héritées vides).
Exemple :
public class MaFrame extends MouseAdapter
{ JFrame frame ;
MaFrame ()
{ monJButton . addMouseListener ( this ); }
public void mouseClicked ( MouseEvent e) {
System . exit (0); }
}
Les Adaptateurs (3)
71
class MaFenetre extends JFrame
{
public MaFenetre () {
super (" Une fenetre qui traite les clics souris ") ;
setSize (300 , 200) ;
addMouseListener ( new EcouteurSouris ()); }
}
class EcouteurSouris extends MouseAdapter
{ /* redéfinition uniquement de la méthode appelée lors d ’ un clic souris*/
public void mouseClicked ( MouseEvent e) {
System . out. println (" clic dans la fenêtre ") ;
} }
Swing et le pattern MVC
En développement graphique, le principe du MVC « Modèle - Vue – Contrôleur »
est très souvent appliqué.
Le modèle permet de récupérer et de mettre à jour les données que l'application
manipule. Il intègre les règles de mise à jour ou de récupération des données.
La vue a deux rôles principaux: l'affichage des données renvoyées par le modèle
et l'interaction avec l'utilisateur. Elle ne se charge que de l'affichage du résultat du
traitement en «écoutant» les modifications du modèle..
Le contrôleur se charge du traitement des événements utilisateur et se charge de
la synchronisation entre la vue et le modèle.
Lui même n'effectue aucune modification de données; Il se charge d'analyser les
actions effectuées par l'utilisateur et demande soit au modèle de se modifier soit à
la vue de se mettre à jour voire les deux.
Mme Hechkel Amina 72
Swing et MVC
Mme Hechkel Amina 73
Swing et MVC
Mme Hechkel Amina 74
L’approche la plus simple consiste à mettre tous les éléments dans la même
classe. La gestion des évènements est faite par des classes membres internes
anonymes.
Cette implémentation est fonctionnelle mais peu évolutive. En effet, si les
méthodes changent d’implémentation, on doit reprendre la classe
complètement. Toutefois, pour des applications simples cette solution est
rapide de mise en œuvre.
Avec MVC, Il faut définir ses propres événements pour la vue donnée ainsi le
contrôleur «écoute» les événements de la vue. La vue, quant à elle se charge
d'écouter les événements utilisateur et du modèle.
Cette approche permet, d’une part de réutiliser facilement des éléments et
d’autre part de partager le modèle entre plusieurs interfaces.
Implémentation selon le modèle MCV
Mme Hechkel Amina 75
L’implémentation du paradigme MVC consiste à séparer les éléments dans
différentes classes.
Pour assurer la sécurité de l’application, les données doivent être stockées sous
la forme de membres private et accédées à l’aide de méthodes publiques
(comme le couple get/set).
Application: Convertisseur de monnaies
On place tous les éléments liés à la modélisation du problème dans une classe:
C’est le modèle
La classe contrôleur implémente les interfaces d’écouteur (les listeners), on peut
créer d’autant de contrôleurs que d’événements possible
La vue contient les champs de saisie qui ne sont plus private mais protected pour
que la classe contrôleur puisse y accéder.
Exemple : Modèle
Mme Hechkel Amina 76
public class ConvertisseurModel {
static final float TAUX = ( float) 2.2865;
private float valEuro;
private float valDT;
public void setValeurEuro( float a) {
valEuro = a ;
valDT = valEuro / TAUX;
}
public void setValeurDT( float a) {
valDT = a;
valEuro = valDT* TAUX;
}
public float getValeurDT() { return valDT;
}
public float getValeurEuro() { return valEuro;
}
}
Exemple : Vue
Mme Hechkel Amina 77
import java.awt.*;
import javax.swing.*;
public class ConversionVue extends JFrame{
JLabel l,l2;
JButton conv;
JTextField t1, t2;
JPanel p1;
public ConversionVue(String s) {
super(s);
p1 =(JPanel) this.getContentPane();
JPanel p2 = new JPanel();
l= new JLabel("Valeur en DT");
l2= new JLabel("Euro");
t1 = new JTextField(10);
t2 = new JTextField(10);
JLabel egal = new JLabel(" = ");
p1.setLayout(new FlowLayout());
p1.add(l);
p1.add(t1);
p1.add(egal);
p1.add(t2);
p1.add(l2);
conv = new JButton("Convertir");
p2.add(conv); p1.add(p2);
Controleur c=new Controleur(this);
conv.addActionListener(c);
setBackground(Color.lightGray);
setDefaultCloseOperation(JFrame.EXIT_ON_
CLOSE);
pack();
}
public static void main(String[] args) {
ConversionVue c = new
ConversionVue("Convertisseur de monnaies");
c.setVisible(true);
}
}
Exemple: Contrôleur
Mme Hechkel Amina 78
import java.awt.event.*;
public class Controleur implements ActionListener{
ConversionVue vue;
ConvertisseurModel model; Controleur(ConversionVue c)
{
vue=c;
model=new ConvertisseurModel(); }
public void actionPerformed(ActionEvent e) {
if(e.getActionCommand().equals("Convertir") && (! vue.t1.getText().equals("")))
{
model.setValeurDT(Float.parseFloat(vue.t1.getText()));
vue.t2.setText(Float.toString(model.getValeurEuro()));
}
}
}
Résultat
Mme Hechkel Amina 79
top related