Conception d’IHM en Java

Concepts Généraux
Dr. BELHADAD Yehya
1 - Modèles de fenêtrage 2

 Sans superposition

 Avec superposition

 Hiérarchique
2 - Les API graphiques 3

 Dans une fenêtre, une application

dessine en utilisant des fonctions qui
prennent des paramètres
2 catégories en 2D
 orientée pixel
 orientée "dimension réelle", ou
"indépendante de la résolution"
 Richesse variable suivant les plate
formes
3 - La gestion de l'arbre 4

d'affichage
 Afficher = appeler une succession de
fonctions graphiques
 Représentation sous forme d'un arbre
d'affichage
 On affiche récursivement, en profondeur
d'abord, tous les nœuds de l'arbre
 On modifie l'arbre pour changer l'affichage
puis on réaffiche
 5

JFrame

JTree JPanel

JPanel JToolbar

JRadioButton JButton

JRadioButton JButton
2 – Arbre Swing

JFrame

JToolBar JPanel JList

JButton JButton JButton JTextArea

3 - La gestion de l'arbre d'affichage
Organisation sous forme d'objets
7

 Les langages à objets permettent de

représenter ces nœuds comme des objets
ayant une interface
 Tous les nœuds héritent d'une classe de
base (JComponent dans Swing)
 Chaque composant particulier spécifie une
interface particulière adaptée à sa
sémantique
Principales différences 8

 Il existe un grand nombre de boîtes à outils

graphiques interactives (Graphical User
Interfaces ou GUI)
 Langage / portabilité / performances /
mécanismes de communications /
extensibilité / rapidité de développement /
robustesse
 Pas de "meilleur" mais des spécialisations
Les boîtes à outils graphiques
interactives de Java
9

 Javapropose deux boîtes à outils

graphiques :
AWT (Abstract Window Toolkit),
simple, petite et limitée
SWING, cohérente, grosse et
extensible.
Conception d’IHM en Java
AWT
Java AWT 11

 Interface indépendante de la plate-

forme
 API simple (simpliste)
 Composants peu nombreux
 Apparence pauvre
 Relativement rapide
 Similaire sur toutes les plate-formes
Organisation d ’AWT 12

 Packages java.awt et java.applet

 Classes de composants (dérivées de
Component)
 Composants conteneurs
 Composants « feuille »
 Classes de gestionnaire d’événements
 Myriade de classes utilitaires
 Image, Color, Cursor, Dimension, Font, etc.
Conception d’IHM en Java
SWING
Java SWING 14

 SWING implémente tous les composants en

Java
 SWING offre plusieurs mécanismes originaux,
pratiques et puissants
 SWING peut se programmer à plusieurs
niveaux
 SWING est très gros et a des performances
variables.
Concepts de SWING 15

 Basé sur des containers

 générique
 gère collection de composants
Programmation SWING 16

 Package javax.swing
 Relativement proche de AWT pour
faciliter la migration, ajout « J » avant
le nom des classes:
Construction d ’une 17

application
 Construire un arbre d ’objets dérivés de
« JComponent »
 Attacher des gestionnaires d ’événements
 Ce sont les gestionnaires d ’événements qui
feront les actions et modifieront les
composants
Exemple 18

import java.awt.*;
import javax.swing.*;

class hwSwing {

public static void main(String args[]) {

JFrame f = new JFrame("Mini");
f..setPreferredSize(new Dimension(400,400));
f.pack();
f.setVisible(true);
}

}
Autre approche 19

import java.awt.*;
import javax.swing.*;

public class Test {

public static void main(String args[]) {
Simple f = new Simple();
f.pack();
f.setVisible(true);
}
}
public class Simple extends JFrame {
JLabel texte = new JLabel("Hello World");
public Simple() {
getContentPane().add(texte); }
}
Arbre Swing 20

JFrame

JTree JPanel

JPanel JToolbar

JRadioButton JButton

JRadioButton JButton
Mon premier Composant 21

 JFrame
 fenêtre principale
 JDialog
 fenêtre de dialogue (modale)
 Jwindow
show()
hide() ou dispose()
toFront() ou toBack()
setTitle(“titre !”)
setSize(int, int) et setResizable(false)
JLabel 22

 Javax.swing.Jlabel
 descriptif : texte statique + image
 exemple : devant un champ de saisie
JLabel jl = new Jlavel(“Label 1”);
ou jl.setText(“Label 1”); // -> .getText()

jl.setIcon(new ImageIcon(“java.gif”));

jl.setVerticalTextPosition(SwingConstants.BOTTO
M)
jl.setHorizontalTextPosition(SwingConstants.CEN
TER);
JTextField 23

 Javax.swing.JTextField
 saisie de texte (non typé)
JTextField jt = new
JTextField(“Thomas”);
String nom = new String(“Thomas”);
jt.setText(nom);
jt.setColumns(nom.length());
jt.copy(); jt.cut(); jt.paste();
JButton 24

 Bouton simple à états

JButton jb= new JButton(“OK”,new
ImageIcon(“boc.gif));
jb.setRolloverIcon(new ImageIcon(“cob.gif”));
jb.setPressedIcon(new ImageIcon(“ocb.gif”));
jb.setDisabledIcon(new
ImageIcon(“obc.gif”));
jb.setMnemonic(‘o’); // ALT + o
jb.setBorderPainted(false);
jb.setFocusPainted(false);
jb.doClick();
JmachinButton 25

 JToggleButton
 deux états (setIcon et setSelectedIcon)
 JCheckBox
 cases à cocher
 JRadioButton
 dans un groupe de boutons “radio”
Exemple de Radio 26

ButtonGroup grp = new ButtonGroup();

JRadioButton r1 = new
JRadioButton(“it1”);
JRadioButton r2 = new
JRadioButton(“it2”);
r2.setSelected(true);
grp.add(r1);
grp.add(r2);
Le modèle de bouton poussoir 27

 Modèleutilisé pour les CheckBox,

RadioButton et Button
 Plusieurs niveaux d ’utilisation
 gère l’état du bouton, au repos, sous le
pointeur, appuyé et relâché.
 Gère la notification vers les listeners
 Gère l ’envoie d ’un événement « action »
JComboBox 28

 Liste
déroulante (ouverte ou
fermée)
 vector ou tableau d’objets passés
en paramètres
JComboBox cb = new JComboBox(
items);
cb.setMaximumRowCount(4);
cb.setEditable(true); // JTextField
JMenu 29

 Une instance de JMenuBar par Jframe

setJMenuBar(JMenuBar mb);
 Plusieurs Jmenu par JMenuBar
add(JMenu jm);
 Plusieurs
JMenuItem/JCheckboxMenu
par Jmenu
add(JMenuItem mi);
addSeparator();
 Structurez !!!
JPanel 30

 JPanel
 conteneur

 JScrollPane Panel
 un seul composant !
 barres de défilement
JScrollPane sp = new JScrollPane();
sp.add(monJLabel);
sp.setViewportView (monJLabel); ScrollPane
 composants implémentant Scrollable
class MonLabel extends Jlabel implements Scrollable
Les composants de SWING 31

Dialog Tabbed Pane Frame Split pane

Tool bar

Internal frame
Layered pane
Composants de Swing 32

List

File chooser Tool tip

Color chooser
Progress bar

Slider
Table Text Tree
Capacités communes des
composants
33

 (dés)activation
isEnabled() setEnabled(…)
 (in)visible
setVisible(…) isVisible()
 module le coût de l’instanciation d’un container !
 tailles réelle et souhaitable
Dimension getSize() ou Dimension getSize(Dimension
r)
setSize(…)
Dimension getPreferredSize() ;
setPreferredSize(Dimension r);
Factory 34

 Bordures
Border mbd= new Border(
BorderFactory.createEtchedBorder()
BorderFactory.createLoweredBevelBorder()
BorderFactory.createTitledBorder(“Titre !”)
etc… );
monJbutton.setBorder(mbd);
 Curseur
Cursor nc = new Cursor(Cursor.CROSSHAIR_CURSOR);
monJbutton.setCursor(nc);
Couleurs 35

 new Color (r,g,b)

 new Color (r,g,b,a)
 0 -> 255
 a=255 opaque
monJbutton.setBackground(Color.white);
//constantes
monJbutton.setForeground(Color.black);
monJbutton.setOpaque(true);
Conception d’IHM en Java
Swing : la gestion du placement
des composants
Calcul du placement 37

 Le placement est calculé dans les

conteneurs
 Soit les composants sont placés
explicitement (x, y, largeur, hauteur)
 Soit ils sont gérés par un « LayoutManager »
qui calcul ces paramètres dynamiquement
 besoins du composant (taille min, max, normale)
+ positionnement relatif
Mise en place d ’un
gestionnaire de placement
38

 Les conteneurs définissent la méthode

setLayout(layoutManager) pour changer le
gestionnaire par défaut
 Le gestionnaire par défaut change d ’une
classe de conteneur à une autre
 La méthode pack() déclenche le calcul du
placement
 La méthode invalidate() rend le placement
courant invalide
Les gestionnaires de 39

placement...
 FlowLayout  GridLayout
 Place les composants  Découpe en une
de gauche à droite grille régulière sur
laquelle les
 CardLayout
composants sont
 Superpose les placés
composants
 GridBagLayout
 Découpe en une
grille et place les
composants sur une
ou plusieurs cases
...ou Layout Manager 40

 BorderLayout
 Découpe en 5
régions: south, north,
east, west, center
 Aucun :
.setBounds(x,y,h,l);
Conclusion 41

 Java
facilite la construction
d’applications graphiques interactives
 Les APIs sont bien conçues
 Plusieurs niveaux de complexité
 Problèmes
 performances parfois
 complexité parfois