4-1-java toolkit

publicité
Conception d'interfaces
utilisateur en Java
Cédric Dumas
Jean-Daniel Fekete
[email protected]
contrat Creative Commons Paternité-Pas d'Utilisation CommercialePartage des Conditions Initiales à l'Identique 2.0 France License
Ecole des Mines de Nantes
Plan du cours
Architecture d ’une application graphique
interactive
La programmation AWT
La programmation avec Java Swing
2
Java et les interfaces
graphiques interactives
Langage conçu d'emblée avec une
interface graphique interactive
Ajout de mécanismes spécifiques pour les
interfaces
inner classes
2 interfaces et 2 modèles graphiques en
standard
Beaucoup d'exemples, de documentations
et d'expérience.
3
Application graphique
interactive : architecture
Les boîtes à outils 2D sont maintenant
très stéréotypées
3 composants
système de fenêtrage
API graphique
gestion de l'arbre d'affichage et d'interaction
Organisation sous forme d'objets
4
Le système de fenêtrage
Accès partagé à l'écran
Subdivision de l'écran en fenêtres
Chaque fenêtre est positionné (x, y, z) et
dimensionnée (largeur x hauteur)
Modèle graphique d'affichage
Modèle d'événements
Communication entre les applications
Gestion de ressources spécifiques
5
Les API graphiques
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
6
La gestion de l'arbre
d'affichage
Afficher = appeler une succession de
fonctions graphiques
Représentation sous forme d'un arbre
d'affichage (ou graphe directe acyclique)
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
7
La gestion de l'interaction
Les dispositifs d'entrée génèrent des
événements (petit bloc mémoire
contenant un type, un temps, une fenêtre
cible et des détails suivant le type)
La boîte à outils achemine l'événement
vers un nœud cible
Le nœud gère l'événement, ce qui peut
modifier l'état de l'arbre d'affichage
On passe à l'événement suivant
8
Acheminement des
événements
Positionnel (souris)
on regarde quel est le nœud de l'arbre le
plus près de la position
On l'envoie au plus prés, qui renvoie a son
père s'il ne veut pas le gérer
Non positionnel (clavier)
si un nœud à le "focus", on lui envoie
traduction d'une touche en caractère(s) ou action
sinon, on cherche une cible
gestion des raccourcis clavier
9
Les composants
graphiques interactifs
Le nœud est capable de s'afficher et de
gérer les événement
On lui ajoute une interface de
communication suivant sa sémantique
bouton, label, menu, ligne de texte, etc.
On appelle ce nœud communicant un
composant ou widget ou gadget ou objet
de contrôle.
10
Organisation sous forme
d'objets
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 (Component dans Java)
Chaque composant particulier spécifie une
interface particulière adaptée à sa
sémantique
11
Principales différences
entre les GUIs
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
Lire le chapitre consacré aux GUIs
12
Les boîtes à outils
graphiques interactives de
Java
Java propose deux boîtes à outils
graphiques :
AWT (Abstract Window Toolkit), simple,
petite et limitée
SWING, cohérente, grosse et extensible.
Les deux peuvent s'utiliser dans les
applets
SWING facilite la transition à partir
d'AWT.
13
Java AWT
Interface indépendante de la plate-forme
API simple (simpliste)
Composants peu nombreux
Apparence pauvre
Relativement rapide
Similaire sur toutes les plate-formes
14
Organisation d ’AWT
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.
15
Construction d ’une
application AWT
Construire un arbre d ’objets dérivés de
« Component »
Attacher des gestionnaires d ’événements
Ce sont les gestionnaires d ’événements
qui feront les actions et modifieront les
composants
16
Exemple 1 AWT
import java.awt.*;
class hw {
public static void main(String args[]) {
Frame f = new Frame("Hello World");
f.add(new Label("Hello World"));
f.pack();
f.setVisible(true);
}
}
17
Exemple 2 AWT
import java.awt.*;
import java.awt.event.*;
class hw2 {
public static void main(String args[]) {
Frame f = new Frame("Hello World");
Button b = new Button("Hello World");
b.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent e) {
System.exit(0);
}
});
f.add(b);
f.pack();
f.setVisible(true);
}
}
18
AWT: explications
Création de l ’arbre de composants :
Frame + Label ou Button
Déclaration des actions:
addEventHandler + création d ’une « inner
class »
Calcul du placement des composants:
pack
Affichage
19
AWT: composants
 Component
 Button
 Canvas
 Checkbox
 Choice
 Container
Panel
ScrollPane
Window
• Dialog
– FileDialog
• Frame
Label
List
Scrollbar
TextComponent
• TextArea
• TextField
 MenuComponent
MenuBar
MenuItem
• CheckBoxMenuItem
• Menu
– PopupMenu
20
Parcours des événements
Plusieurs boucles envoient des
événements dans une file unique
System.getSystemEventQueue()
Un Thread lit la file et distribue les
événements à la racine de l ’arbre des
composants associé à la fenêtre de
l ’événement
L ’événement est acheminé au composant
auquel il est destiné
21
Gestion des actions
Associer une action à un événement
2 types d ’événements
issu du système de fenêtrage (bas niveau)
issu d ’un composant ou d’un sous-système
Java (haut niveau)
2 niveaux de gestion
dérivation des composants
association de gestionnaires d’actions
22
Les événements
Package java.awt.event.*
Héritent de la classe java.awt.AWTEvent
identificateur (numéro unique)
consumed (a-t-il été utilisé?)
source (qui l'a émis)
Envoyés dans une file unique
Toolkit.getSystemEventQueue()
Lus par un thread spécique
23
Types d’événements
Interaction utilisateur
Evénements émis
Clic sur un JPanel
MouseEvent
Frappe d’une touche sur un JPanel
KeyEvent
Iconification d’un fenetre
WindowEvent
Clic sur un bouton
ActionEvent
Ajout d’une lettre dans un JTextField
DocumentEvent
Sélection d’un item dans une JList
ListSelectionEvent
24
Dérivation d ’un composant
(obsolète)
Redéfinition de la méthode
processEvent(AWTEvent e)
Test de la classe de l ’événement
 if (e instanceof FocusEvent)
processFocusEvent((FocusEvent)e);
else
super.processFocusEvent(e);
Ne pas oublier d ’appeler super sinon, rien
ne marche plus.
25
Association de
gestionnaires d ’actions
Pour chaque famille
d ’événements, une
interface « listener »
est définie
MouseListener,
MouseMoveListener,
KeyListener, etc.
Chaque classe
composant définit
« add<nom>Listener(
<nom>Listener )
Frame
Button
addActionListener(
ActionListener)
ActionListener
actionPerformed(
ActionEvent e)
26
Les listeners
Chaque composant peut renvoyer certains
événements à l'application si elle le
demande
Le renvoi se fait par un Listener
actionListener, AdjustmentListener,
FocusListener, InputMethodListener,
ItemListener, KeyListener, MouseListener,
MouseMotionListener, TextListener,
WindowListener
27
Exemple
public class MyClass implements MouseListener {
...
someObject.addMouseListener(this);
...
public void mousePressed(MouseEvent e) { }
public void mouseReleased(MouseEvent e) { }
public void mouseEntered(MouseEvent e) { }
public void mouseExited(MouseEvent e) { }
public void mouseClicked(MouseEvent e) { ...//Event handler implementation
goes here... }
}
28
Les adaptateurs
Les Adapters sont des classes concrètes
qui facilitent l'utilisation des Inner Classes
Pour chaque Listener ayant plusieurs
méthodes, un Adapter est défini
Il implémente toutes les méthodes en ne
faisant rien
Seules les méthodes faisant quelque
chose doivent être implémentés par des
inner classes
29
Exemple adapté
public class MyClass extends MouseAdapter {
...
someObject.addMouseListener(this);
...
public void mouseClicked(MouseEvent e) {
//Event handler implementation goes here...
}
}
30
Rappel sur les "inner
classes"
Existent depuis Java 1.1
3 versions
classe définie dans l'espace de nommage
d'une autre classe
classe définie dans le contexte d'une autre
classe
classe anonyme définie au fil du code dans le
contexte courant
31
Syntaxe des inner classes
class a { static class B { … } …}
class a { class B { … } …}
class a { type method(args) { …
Thread t = new Thread() { void run() {
… } };
…} }
32
Définition d ’un Listener
4 méthodes
Définition d’une classe qui implémente
l’interface ActionListener
Définition de l’interface ActionListener dans
la classe qui gère l’action
Utilisation des « inner classes », définition à
la volée du code
Utilisation d ’un classe « Adapter » pour ne
pas avoir à définir toutes les méthodes
33
Inner classes
public class MyClass extends Applet {
...
someObject.addMouseListener(new MyAdapter());
...
class MyAdapter extends MouseAdapter {
public void mouseClicked(MouseEvent e) { ...//Event handler
implementation goes here... }
}
}
34
Anonymous Inner classes
public class MyClass extends Applet {
...
someObject.addMouseListener(
new MouseAdapter()
{ public void mouseClicked(MouseEvent e) {
//Event handler implementation goes here... }
}
);
...
}
}
35
Calcul du placement
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
36
Mise en place d ’un
gestionnaire de placement
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
37
Les gestionnaires de
placement...
FlowLayout
Place les composants
de gauche à droite
CardLayout
Superpose les
composants
GridLayout
Découpe en une grille
régulière sur laquelle
les composants sont
placés
GridBagLayout
Découpe en une grille
et place les
composants sur une
ou plusieurs cases
38
...ou Layout Manager
BorderLayout
Découpe en 5 régions:
south, north, east,
west, center
Aucun :
.setBounds(x,y,h,l);
39
Affichage dans AWT
Deux cas de figure:
composant primitif, l ’affichage est laissé au
« peer »
composant redéfini, l ’affichage est géré par
update et paint
En principe, seul le Canvas est censé être
dérivé pour modifier son affichage
L ’affichage se fait sur une surface
graphique, le « Graphics »
40
Graphics
Java définit deux interfaces pour le
graphique passif: Graphics et Graphics2D
Graphics implémente un modèle
graphique très simple et orienté pixel
Graphics2D implémente un modèle
graphique sophistiqué indépendant de la
résolution
On peut aussi créer une image et créer un
graphique pour dessiner dessus
41
Capacités d ’un Graphics
Les attributs sont:
Color, PaintMode, Font, clip, origin, taille
Les primitives graphiques sont:
line, rect, roundRect, oval, arc, polyline,
polygon, string, image
On peut tracer le contour ou remplir les
rect, roundRect, oval, arc et polygones
On ne peut pas changer l ’épaisseur des
traits ou faire des pointillés par exemple. 42
Récupération d’un
Graphics
Pas de composant ZonedeDessin
rafraichissement :
public static void main(...) {
[…}
JPanel pa = new JPanel();
Graphics g = pa.getGraphics();
g.drawOval(10,10,50,50); // centre supérieur gche
}
43
Dessiner à tous les coups
Public class MonPanel extends JPanel {
public void PaintComponent(Graphics g) {
super.paintComponent(g);
g.drawOval(10,10,50,50);
}
}
44
Les couleurs
Modèle simple: 3 composants rouge, vert
et bleu
Modèle complexe : ColorSpace, Color et
ColorModel
ColorSpace est un espace de couleur (RGB,
CIEXYZ, etc)
Color représente une couleur dans un espace
de couleur
ColorModel spécifie comment une image
45
code la couleur
Les Images
Image: tableau de pixels
peut être
chargé du WEB ou d ’un fichier
créé pour accélérer l’affichage
créé pour éviter des clignottements
créé pour dessiner dedans
Plusieurs niveaux d ’API
Ici, le plus simple.
46
Création d ’une image
Dans Component:
Image img = createImage(largeur, hauteur)
Pour dessiner dedans, créer un Graphics :
Graphics g = img.createGraphics();
g.setBackground(getBackground());
On peut ensuite dessiner dans g
On peut dessiner l’image sur le graphics
courant.
47
Chargement d ’une image
java.awt.Toolkit.getImage(String file);
java.awt.Toolkit.getImage(URL url);
createImage fait la même chose mais ne
partage pas les images
Attention, dans une applet, getImage ne
marche que sur le répertoire de l ’URL de
l ’applet
48
Affichage d ’une image
Graphics.drawImage(Image img, int x, int
y, ImageObserver o);
Plusieurs autres version qui retaillent
l ’image
java.awt.image.ImageObserver interface
boolean imageUpdate(Image i, int info, int x,
int y, int w, int h)
appelé lors d ’un chargement incrémental
d ’image
49
Les polices de caractères
Java utilise des caractères Unicode (16
bits)
Les polices traduisent des suites de
caractères en suite de glyphes affichables
Une police a un nom, un style et une taille
noms systèmes: Dialog, DialogInput,
Monospaced, Serif, SansSerif, Symbol
Styles: PLAIN, BOLD, ITALIC
La famille est gérée en interne
50
Les métriques de polices
Ascent
Leading
charWidth
charsWidth
caractères
hauteur / ligne de base
avance / début à gauche
largeur d ’un caractère
largeur de plusieurs
51
Exemple de composant
spécifique dans AWT
Un composant Canvas affiche une liste de
dessins
On dérive le Canvas pour ajouter une liste
d’affichage
On définit une interface simple pour les
objets de la liste d ’affichage
On modifie paint pour afficher la liste
52
Imprimer
La classe qui imprime dérive de Graphics
et doit être passée à la méthode
« printAll(Graphics g) » de la racine des
composants à imprimer
Pour obtenir le Graphics, il faut un
java.awt.PrintJob
class PrintJob { PrintJob();
void end();
Graphics getGraphics();
…}
53
Imprimer (2)
Pour obtenir un PrintJob, utiliser un
dialogue d’ impression
java.awt.Toolkit.getPrintJob(Frame f, String
jobtitle, JobAttributes jobAttributes,

PageAttributes pageAttributes)
On peut tester dans la méthode « paint »
si on affiche à l ’écran ou si on imprime:
if (g instanceof PrintGraphics) …
54
Imprimer (3)
PrintJob pjob = getToolkit().getPrintJob(frame,
"Printing Test",
null, null);
if (pjob != null) {
Graphics pg = pjob.getGraphics();
if (pg != null) {
root.printAll(pg);
pg.dispose(); // flush page
}
pjob.end();
55
AWT et les applets
Les applets sont téléchargées à partir de
pages WEB
 <applet
codebase="http://java.sun.com/applets/NervousText/
1.1" code="NervousText.class" width=400 height=75>
<param name="text" value="Welcome to HotJava!">
<hr> If you were using a Java-enabled browser such
as HotJava, you would see dancing text instead of
this paragraph. <hr> </applet>
Le classe NervousText doit dériver de
Applet dans java.Applet
56
Les Applets
Applet dérive de Panel
Définit les méthodes suivantes:
void init() appelé une fois au chargement
void start() appelé quand la page s’affiche
void stop() appelé quand la page disparaît
String getParameter(String) récupère un
argument passé en paramètre
57
Surprises avec les Applets
Des mécanismes de sécurité sont activés
Le focus n’est pas implicitement sur
l’applet, elle ne reçoit pas les touches du
clavier par défaut
Il faut que la taille de la fenêtre soit fixe
L’apparence varie d ’une machine à l’autre
(les fonts disponibles par exemple).
58
Organisation graphique
d'une interface
Connaître les utilisateurs
Concevoir avec eux l'interface
Se rattacher à des choses connues
code de couleurs, organisation spatiale,
vocabulaire, etc.
Tester les interfaces
59
Comment connaître les
utilisateurs ?
Pas d'introspection: vous n'êtes pas un
utilisateur type!
Modèle mental de l'utilisateur vs. Modèle
d'implémentation
Conception participative
Use cases
Analyse des tâches : que fait-il et
comment le fait-il ?
60
Faire participer les
utilisateurs
Dessin d'interfaces sur papier
Prototypage rapide et scénarios
d'utilisation
Cycle de développement en spirale
61
Hiérarchisation de
l'information
Organiser les écrans de manière
hiérarchique
Utiliser un vocabulaire simple
Bien délimiter les zones
regrouper les objets similaires
détacher les objets différents
Faire appel à des graphistes
62
Utilisation des couleurs
Concevoir avec des niveaux de gris puis
passer à la couleur
10% de daltoniens ou autres trouble de la
perception
Utiliser peu de couleurs
Utiliser des teintes pastels et des couleurs
complémentaires
63
Utilisation des polices de
caractères
Prendre des polices réglées pour les
écrans et non traditionnelles à
l'impression
Pas d'italique ou de penché mais plutôt du
gras
Utiliser des couleurs contrastées fond /
lettre
Faire attention à la taille
64
Animations, images et
sons
Attention à ne pas divertir l'attention
L'œil est très sensible aux animations:
il est attiré par ce qui bouge
il ne peut pas contrôler cette attirance
peut provoquer de la fatigue et des maux de
tête
Image très colorées perturbantes
Sons à éviter, sauf pour les erreurs graves
redondance pour les erreurs
65
Java SWING
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 souvent lent.
66
Programmation avec Java
SWING
Généralités sur Java SWING
SWING et AWT
Concepts de SWING
Une application Java SWING pas à pas
TPs
Les composants standards de SWING
Créer ses propres composants
67
SWING et AWT
SWING cohabite avec AWT et utilise le
minimum de ses services
Tous les composants sont redéfinis
AWT n ’est pas régulier
pas de canvas dans un menu
SWING est totalement régulier
tout conteneur peut afficher tout objet
graphique
68
Concepts de SWING
Séparation du composant et de son
apparence
plusieurs apparences existent: Windows,
Unix, Mac et « Metal »
L ’apparence par défaut dépend de la plate
forme
Séparation du composant et de son
modèle
Séparation du composant et de son
modèle de sélection
69
Concepts de SWING
Basé sur des containers
générique
gère collection de composants
design Pattern composite
70
Programmation SWING
Package javax.swing
Relativement proche de AWT pour faciliter
la migration, ajout « J » avant le nom des
classes:
71
Exemple
import java.awt.*;
import javax.swing.*;
class hwSwing {
public static void main(String args[]) {
JFrame f = new JFrame("Hello World");
Jlabel texte = new JLabel("Hello World");
f.getContentPane().add(texte);
f.pack();
f.setVisible(true);
}
}
72
Autre approche
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); }
}
73
Mon premier Composant
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)
74
Les autres composants
75
Jlabel
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.BOTTOM)
jl.setHorizontalTextPosition(SwingConstants.CENTER); 76
JTextField
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();
77
JButton
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();
78
JmachinButton
JToggleButton
deux états (setIcon et setSelectedIcon)
JCheckBox
cases à cocher
JRadioButton
dans un groupe de bouttons “radio”
79
Exemple de Radio
ButtonGroup grp = new ButtonGroup();
JRadioButton r1 = new JRadioButton(“it1”);
JRadioButton r2 = new JRadioButton(“it2”);
r2.setSelected(true);
grp.add(r1);
grp.add(r2);
80
Le modèle de bouton
poussoir
Modèle utilisé 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 »
81
Le modèle de bouton
poussoir (2)
public interface ButtonModel extends ItemSelectable
{
attribute boolean armed;
attribute boolean selected;
attribute boolean enabled;
attribute boolean pressed;
attribute boolean rollover;
attribute int mnemonic;
attribute String actionCommand;
attribute ButtonGroup group;
listener ActionListener;
listener ItemListener;
listener ChangeListener;
}
82
JComboBox
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
83
JMenu
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 !!!
84
JPanel
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
85
class MonLabel extends Jlabel implements Scrollable
Les composants de SWING
Dialog
Tabbed Pane
Frame
Split pane
Tool bar
Internal frame
Layered pane
86
Composants de Swing
List
File chooser
Progress bar
Color chooser
Tool tip
Slider
Table
Text
Tree
87
Capacités communes des
composants
(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);
88
Factory
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);
89
Couleurs
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);
90
Quelques difficultés à
retenir
Conteneurs de fenêtre : ne pas ajouter
directement avec "add" mais ajouter avec
"getContentPane()"
Pas de multi-threading, sauf autorisation
explicite dans la documentation
91
Pourquoi getContentPane ?
Les containers Swing ont un JRootPane
monContainer.getContentPane().add(...)
composants « lourds » : JDialog, JFrame, JWindow
Root pane
92
La classe JComponent
Tool tip
Bords
Actions associées aux touches
Propriétés
Accès aux handicapés
Double buffer
93
Comment être multi ?
Plusieurs vues :
DessinListener listDessin = new DessinListener();
CoordListener listCoord = new CoordListener();
maZoneDessin.addMouseMotionListener(listDessin);
maZoneDessin.addMouseMotionListener(listCoord);
Coordonnées : 83 28
94
Le modèle de liste
Utilisé pour les listes
public interface ListModel {
int getSize();
Object getElementAt(int index);
Listener ListDataListener;
}
Facilite l ’affichage d ’un conteneur par
une liste
CellRenderer pour changer l ’apparence
des items
95
Création d ’une liste
String[] data = {« un », « deux »};
Jlist l = new JList(data);
JList peut être créé avec un modèle ou un
tableau (le modèle est créé implicitement)
On peut lui changer son CellRenderer
On peut lui changer son SelectionModel
un ou plusieurs séléctionnés
plusieurs contigus ou non
le contrôle peut être plus fin
96
Le modèle de boîte
combiné (combo box)
Comme List plus un item sélectionné
Le modèle de sélection est « un seul »
Peut être modifiable ou non (ajout
implicite d ’un item saisi au clavier dans la
liste)
97
Le modèle d'intervalle
borné
BoundedRangeModel
Utilisé par les sliders, scrollbar et les
progress bars
Minimun <= value <= value+extent <=
Maximum
JScrollBar j = new
JScrollBar(myBRModel);
98
Le modèle d'arbre JTree
TreeModel
Object getRoot(), Object getChild(Object
parent, int index), int getChildCount(Object
parent), boolean isLeaf(Object node),
valueForPathChanged(TreePath p, Object
newValue), int getIndexOfChild(Object
parent, Object child), TreeModelListener
Pour déplacer, ajouter ou retirer une
colonne dans une table
99
Le modèle de
table JTable
JTable(Object[][] rowData, Object[] columnNames)
JTable(Vector rowData, Vector columnNames)
new AbstractTableModel() {
public String getColumnName(int col) {
return columnNames[col].toString();
}
public int getRowCount() { return
rowData.length; }
public int getColumnCount() { return
columnNames.length; }
public Object getValueAt(int row, int col) {
return rowData[row][col];
}
public boolean isCellEditable(int row, int col)
{ return true; }
public void setValueAt(Object value, int row,
int col) {
rowData[row][col] = value;
fireTableCellUpdated(row, col);
}
}
100
La gestion du
texte
Gestion simple et configurable
Niveau de configuration très poussé
Texte simple, Texte HTML, Texte XML?
Interface « Document » pour gérer
l ’intérieur d ’un texte
Plusieurs Viewers pour les différentes
classes de documents
101
Les composants
spécifiques SWING
Dériver de JComponent
paint appelle paintComponent,
paintBorder et paintChildren
On peut changer l’un des trois ou paint
directement
Similaire à AWT
On peut utiliser Java2D
102
Capacités d ’un
Graphics2D (Java2D)
Dérive d’un Graphics
Ajoute les attributs suivants:
composite, paint, stroke, RenderingHints,
transform
Les primitives obéissent à la
transformation affine installée
Les « stroke » et « paint » définissent les
attributs d ’affichage des remplissages et
des traits.
103
Les objets géométriques
de Java2D
Package java.awt.geom.*
Définit les objets de gestion de la
géométrie et leurs interfaces
104
Les transformations
affines
Spécifie à la fois l ’échelle en X et Y, la
rotation, la translation et des
déformations affines
Les transformations se composent
Une transformation courante est
appliquée aux primitives graphiques
105
Les formes
Ligne, rectangle, arcs, ellipse, polygone,
etc.
Courbes quadratiques et cubiques
Area
106
Les courbes cubiques
Courbes de Bézier
Relativement facile à
contrôler
107
Les "area"
Permet de calculer avec des Shapes:
intersection
ajout, soustraction, différence symétrique
Lent mais puissant
108
La notion de "Path"
Forme définie par son contour
point de départ
suite de lignes ou courbes
levé du crayon
fermeture
On peut remplir ou tracer le Path
On peut itérer le long du Path
suite de segments typés connus
109
Les traits
Nombreux attributs:
épaisseur, style de fin (end cap), style de
join (join style), pointillé
BasicStroke : transformer un trait en son
contour (pour lui appliquer un
remplissage)
110
Les remplissages
Couleur pleine
Composition avec mélange (translucide)
Texture
Gradient
Pochoir
111
Imprimer avec Java2D
public void actionPerformed(ActionEvent e) {
if (e.getSource() instanceof JButton) {
PrinterJob printJob =
PrinterJob.getPrinterJob();
printJob.setPrintable(this);
if (printJob.printDialog()) {
try {
printJob.print();
} catch (Exception ex) {
ex.printStackTrace();
}
}
}
}
112
Conclusion et perspectives
Java facilite la construction d’applications
graphiques interactives
Les APIs sont bien conçues
Plusieurs niveaux de complexité
Problèmes
performances parfois
complexité parfois
113
Bibliographie
 Designing the User Interface; Ben Shneiderman, Addison-Wesley
1997; ISBN 0201694972
 Developing User Interfaces, Dan R. Olsen, Morgan Kaufmann,
1998; ISBN 1558604189
 The Java Class Libraries : Java.Applet, Java.Awt, Java.Beans (Vol 2)
P. Chan, R. Lee Addison-Wesley, 1997; ISBN 0201310031
 The JFC Swing Tutorial: A Guide to Constructing GUIs
K. Walrath, M. Campione; Addison-Wesley, 1999; ISBN 0201433214
 Systèmes d'information et Interaction Homme-Machine, Ed. C.
Kolski, 2000; Hermes.
 The Java Tutorial
http://java.sun.com/docs/books/tutorial/index.html
114
Bibliographie
java.sun.com
tutorials
references
http://manning.spindoczine.com/sbe/
115
Téléchargement