conception d'interfaces utilisateur en java cédric dumas jean-daniel fekete ecole des mines de...
Post on 03-Apr-2015
114 Views
Preview:
TRANSCRIPT
Conception d'interfaces utilisateur en Java
Cédric Dumas
Jean-Daniel FeketeEcole des Mines de Nantes
Cedric.Dumas@emn.frcontrat Creative Commons Paternité-Pas d'Utilisation Commerciale-
Partage des Conditions Initiales à l'Identique 2.0 France License
2
Plan du cours
Architecture d ’une application graphique interactive
La programmation AWTLa programmation avec Java Swing
3
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.
4
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'interactionOrganisation sous forme d'objets
5
Le système de fenêtrage
Accès partagé à l'écranSubdivision de l'écran en fenêtresChaque fenêtre est positionné (x, y, z) et
dimensionnée (largeur x hauteur)Modèle graphique d'affichageModèle d'événementsCommunication entre les applicationsGestion de ressources spécifiques
6
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
7
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
8
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
9
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érerNon positionnel (clavier)
si un nœud à le "focus", on lui envoietraduction d'une touche en caractère(s) ou action
sinon, on cherche une ciblegestion des raccourcis clavier
10
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.
11
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
12
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écialisationsLire le chapitre consacré aux GUIs
13
Les boîtes à outils graphiques interactives de JavaJava 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.
14
Java AWT
Interface indépendante de la plate-forme
API simple (simpliste)Composants peu nombreuxApparence pauvreRelativement rapideSimilaire sur toutes les plate-formes
15
Organisation d ’AWT
Packages java.awt et java.appletClasses de composants (dérivées de
Component) Composants conteneurs Composants « feuille »
Classes de gestionnaire d’événementsMyriade de classes utilitaires
Image, Color, Cursor, Dimension, Font, etc.
16
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
17
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);
}}
18
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);
}}
19
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:
packAffichage
20
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
21
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é
22
Gestion des actions
Associer une action à un événement2 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
23
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
24
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
25
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.
26
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 ActionListener
actionPerformed(ActionEvent e)
addActionListener(ActionListener)
27
Les listeners
Chaque composant peut renvoyer certains événements à l'application si elle le demande
Le renvoi se fait par un ListeneractionListener, AdjustmentListener,
FocusListener, InputMethodListener, ItemListener, KeyListener, MouseListener, MouseMotionListener, TextListener, WindowListener
28
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... }
}
29
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
30
Exemple adapté
public class MyClass extends MouseAdapter {
...
someObject.addMouseListener(this);
...
public void mouseClicked(MouseEvent e) {
//Event handler implementation goes here...
}
}
31
Rappel sur les "inner classes"
Existent depuis Java 1.13 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
32
Syntaxe des inner classes
class a { static class B { … } …}class a { class B { … } …}class a { type method(args) { …
Thread t = new Thread() { void run() { … } }; …} }
33
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
34
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... }
}
}
35
Anonymous Inner classes
public class MyClass extends Applet {
...
someObject.addMouseListener(
new MouseAdapter() { public void mouseClicked(MouseEvent e) { //Event handler implementation goes here... }
}
);
...
}
}
36
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
37
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
38
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
39
...ou Layout Manager
BorderLayout Découpe en 5
régions: south, north, east, west, center
Aucun : .setBounds(x,y,h,l);
40
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 »
41
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
42
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, imageOn peut tracer le contour ou remplir les
rect, roundRect, oval, arc et polygonesOn ne peut pas changer l ’épaisseur des
traits ou faire des pointillés par exemple.
43
Récupération d’un Graphics
Pas de composant ZonedeDessinrafraichissement :
public static void main(...) {[…}JPanel pa = new JPanel();Graphics g = pa.getGraphics();g.drawOval(10,10,50,50); // centre supérieur
gche}
44
Dessiner à tous les coups
Public class MonPanel extends JPanel {public void PaintComponent(Graphics g) {
super.paintComponent(g);g.drawOval(10,10,50,50);}
}
45
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 code
la couleur
46
Les Images
Image: tableau de pixelspeut ê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 ’APIIci, le plus simple.
47
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 gOn peut dessiner l’image sur le graphics
courant.
48
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 imagesAttention, dans une applet, getImage
ne marche que sur le répertoire de l ’URL de l ’applet
49
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
50
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
51
Les métriques de polices
Ascent hauteur / ligne de baseLeading avance / début à
gauchecharWidth largeur d ’un caractèrecharsWidth largeur de plusieurs
caractères
52
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
53
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(); … }
54
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) …
55
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();
56
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
57
Les Applets
Applet dérive de PanelDé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
58
Surprises avec les Applets
Des mécanismes de sécurité sont activésLe 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 fixeL’apparence varie d ’une machine à
l’autre (les fonts disponibles par exemple).
59
Organisation graphique d'une interface
Connaître les utilisateursConcevoir avec eux l'interfaceSe rattacher à des choses connues
code de couleurs, organisation spatiale, vocabulaire, etc.
Tester les interfaces
60
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émentationConception participativeUse casesAnalyse des tâches : que fait-il et
comment le fait-il ?
61
Faire participer les utilisateurs
Dessin d'interfaces sur papierPrototypage rapide et scénarios
d'utilisationCycle de développement en spirale
62
Hiérarchisation de l'information
Organiser les écrans de manière hiérarchique
Utiliser un vocabulaire simpleBien délimiter les zones
regrouper les objets similaires détacher les objets différents
Faire appel à des graphistes
63
Utilisation des couleurs
Concevoir avec des niveaux de gris puis passer à la couleur 10% de daltoniens ou autres trouble de
la perceptionUtiliser peu de couleursUtiliser des teintes pastels et des
couleurs complémentaires
64
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
65
Animations, images et sons
Attention à ne pas divertir l'attentionL'œ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êteImage très colorées perturbantesSons à éviter, sauf pour les erreurs graves
redondance pour les erreurs
66
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.
67
Programmation avec Java SWING
Généralités sur Java SWINGSWING et AWTConcepts de SWINGUne application Java SWING pas à pas
TPsLes composants standards de SWINGCréer ses propres composants
68
SWING et AWT
SWING cohabite avec AWT et utilise le minimum de ses services
Tous les composants sont redéfinisAWT n ’est pas régulier
pas de canvas dans un menuSWING est totalement régulier
tout conteneur peut afficher tout objet graphique
69
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
formeSéparation du composant et de son modèleSéparation du composant et de son modèle
de sélection
70
Concepts de SWING
Basé sur des containersgénériquegère collection de composantsdesign Pattern composite
71
Programmation SWING
Package javax.swingRelativement proche de AWT pour
faciliter la migration, ajout « J » avant le nom des classes:
72
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);
}}
73
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); }}
74
Mon premier Composant
JFrame fenêtre principale
JDialog fenêtre de dialogue (modale)
Jwindowshow()hide() ou dispose()toFront() ou toBack()setTitle(“titre !”)setSize(int, int) et setResizable(false)
75
Les autres composants
76
Jlabel
Javax.swing.Jlabeldescriptif : texte statique + imageexemple : 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);
77
JTextField
Javax.swing.JTextFieldsaisie 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();
78
JButton
Bouton simple à étatsJButton 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 + ojb.setBorderPainted(false);jb.setFocusPainted(false);jb.doClick();
79
JmachinButton
JToggleButton deux états (setIcon et setSelectedIcon)
JCheckBox cases à cocher
JRadioButton dans un groupe de bouttons “radio”
penser à regarder Abstract Button
80
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);
81
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 »
82
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;}
83
JComboBox
Liste déroulante (ouverte ou fermée)vector ou tableau d’objets passés en
paramètresJComboBox cb = new JComboBox( items);cb.setMaximumRowCount(4);cb.setEditable(true); // JTextField
84
JMenu
Une instance de JMenuBar par JframesetJMenuBar(JMenuBar mb);
Plusieurs Jmenu par JMenuBaradd(JMenu jm);
Plusieurs JMenuItem/JCheckboxMenu par Jmenu
add(JMenuItem mi);addSeparator();
Structurez !!!
85
JPanel
Jpanel conteneur
JScrollPane un seul composant ! barres de défilement
JScrollPane sp = new JScrollPane();sp.add(monJLabel);sp.setViewportView (monJLabel);
composants implémentant Scrollableclass MonLabel extends Jlabel implements Scrollable
Panel
ScrollPane
86
Les composants de SWING
Dialog Frame Split paneTabbed Pane
Tool bar
Internal frameLayered pane
87
Composants de Swing
File chooser Color chooser
Table Text Tree
List
Slider
Progress bar
Tool tip
88
Capacités communes des composants
(dés)activationisEnabled() setEnabled(…)
(in)visiblesetVisible(…) isVisible() module le coût de l’instanciation d’un container !
tailles réelle et souhaitableDimension getSize() ou Dimension getSize(Dimension r)setSize(…)Dimension getPreferredSize() ;setPreferredSize(Dimension r);
89
Factory
BorduresBorder mbd= new Border(
BorderFactory.createEtchedBorder()BorderFactory.createLoweredBevelBorder()BorderFactory.createTitledBorder(“Titre !”)etc… );
monJbutton.setBorder(mbd);
CurseurCursor nc = new Cursor(Cursor.CROSSHAIR_CURSOR);monJbutton.setCursor(nc);
90
Couleurs
new Color (r,g,b)new Color (r,g,b,a)0 -> 255a=255 opaque
monJbutton.setBackground(Color.white); //constantes
monJbutton.setForeground(Color.black);monJbutton.setOpaque(true);
91
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
92
Pourquoi getContentPane ?
Les containers Swing ont un JRootPane
monContainer.getContentPane().add(...)
composants « lourds » : JDialog, JFrame, JWindow Root pane
93
La classe JComponent
Tool tipBordsActions associées aux touchesPropriétésAccès aux handicapésDouble buffer
94
Comment être multi ?
Plusieurs vues :DessinListener listDessin = new
DessinListener();CoordListener listCoord = new
CoordListener();maZoneDessin.addMouseMotionListener(listD
essin);maZoneDessin.addMouseMotionListener(listC
oord);
Coordonnées : 83 28
95
Le modèle de liste
Utilisé pour les listespublic 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
96
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 CellRendererOn peut lui changer son SelectionModel
un ou plusieurs séléctionnés plusieurs contigus ou non le contrôle peut être plus fin
97
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)
98
Le modèle d'intervalle borné
BoundedRangeModelUtilisé par les sliders, scrollbar et les
progress barsMinimun <= value <= value+extent
<= MaximumJScrollBar j = new
JScrollBar(myBRModel);
99
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
100
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); }}
101
La gestion dutexte
Gestion simple et configurableNiveau de configuration très poussé
Texte simple, Texte HTML, Texte XML?Interface « Document » pour gérer
l ’intérieur d ’un textePlusieurs Viewers pour les différentes
classes de documents
102
Les composants spécifiques SWING
Dériver de JComponentpaint appelle paintComponent,
paintBorder et paintChildrenOn peut changer l’un des trois ou
paint directementSimilaire à AWTOn peut utiliser Java2D
103
Capacités d ’un Graphics2D (Java2D)
Dérive d’un GraphicsAjoute 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.
104
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
105
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 composentUne transformation courante est
appliquée aux primitives graphiques
106
Les formes
Ligne, rectangle, arcs, ellipse, polygone, etc.
Courbes quadratiques et cubiquesArea
107
Les courbes cubiques
Courbes de BézierRelativement facile à
contrôler
108
Les "area"
Permet de calculer avec des Shapes: intersection ajout, soustraction, différence
symétriqueLent mais puissant
109
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 PathOn peut itérer le long du Path
suite de segments typés connus
110
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)
111
Les remplissages
Couleur pleineComposition avec mélange
(translucide)TextureGradientPochoir
112
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(); } } }}
113
Conclusion et perspectives
Java facilite la construction d’applications graphiques interactives
Les APIs sont bien conçuesPlusieurs niveaux de complexitéProblèmes
performances parfois complexité parfois
114
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
115
Bibliographie
java.sun.com tutorials references
http://manning.spindoczine.com/sbe/
top related