Conception d Interfaces Homme Machine avec Swing

Transcription

1 Conception d Interfaces Homme Machine avec Swing MVC : Modèle Vue Contrôleur Cas pratique : Les Jlists

2 Rappel concernant le MVC Motif de conception pour les IHM Découplage de l IHM et du code applicatif Repose sur le principe Abonneur / Abonnés (prog. événementielle) Utilisé extensivement dans Swing Applicable à d autres domaines 1

3 Illustration du MVC Contrôleur event modif Notification Abonnement query(update(..)) (addobserver( )) Modèle Vue Celsius Vue Farenheit 2

4 Illustration du MVC (diagramme de séquence) Controler Model View setx( ) setchanged() sety( ) addobserver( ) setchanged() notifyobservers() update(observable, Object) getx() 3

5 Observable/Observer «à la main» 4

6 Observable/Observer «à la main» MonObservable Côté abonneur # boolean changed # List observers # boolean yaeuduchangement() + void achangé() + void abonnerobserveur(monobserveur) + void désabonnerobserveur(monobserveur) # void prévenirobserveurs() # void prévenirobserveurs(monobservable, Object) MonObserver void yadunouveau() void yadunouveau(monobservable, Object) Côté abonné 5

7 Etude de cas : Les JLists 1. Une JList simple avec un nombre fixe de choix 2. Une Jlist modifiable dynamiquement (ie. utilisation du modèle par défaut) 3. Idem mais avec un modèle ad hoc (ie. fait «à la main») 4. Idem mais avec une visualisation spécifique des items de la liste (ajout d une image) De 2 à 3 : principes réapplicables à d autres composants 6

8 JListSimpleExample 7

9 JListSimpleExample Création de l ensemble des chaînes composant la JList Création de la JList à partir de cet ensemble (un tableau d objet) Abonnement d un listener de sélection (propre à la JList) Et puis c est tout! 8

10 ListSelectionModel SINGLE_SELECTION Only one item can be selected at a time. When the user selects an item, any previously selected item is deselected first. SINGLE_INTERVAL_SELECTIO N Multiple, contiguous items can be selected. When the user begins a new selection range, any previously selected items are deselected first. MULTIPLE_INTERVAL_SELECT ION The default. Any combination of items can be selected. The user must explicitly deselect items. 9

11 public class JListSimpleExample extends JPanel { private JList samplejlist; private JTextField valuefield; public JListSimpleExample() { super(); String[] entries = { "Tokyo", "Kyoto", "Nara", "Osaka", "Hiroshima", "Kobe" ; samplejlist = new JList(entries); samplejlist.setvisiblerowcount(4); samplejlist.setselectionmodel(listselectionmodel.single_selection); samplejlist.addlistselectionlistener(new ValueReporter()); JScrollPane listpane = new JScrollPane(sampleJList); JPanel listpanel = new JPanel(); listpanel.setbackground(color.white); Border listpanelborder = BorderFactory.createTitledBorder("Sample JList"); private class ValueReporter implements ListSelectionListener { public void valuechanged(listselectionevent event) { if (!event.getvalueisadjusting()) valuefield.settext(samplejlist.getselectedvalue().tostring()); 10

12 DefaultListModel La JList suit la décomposition MVC! Le tableau de chaînes de caractères est en fait transformé en un modèle de liste La JList est une vue associée à un ListModel Comme souvent: interface, classe abstraite et implémentation par défaut 11

13 DefaultModelExample On désire en plus pouvoir ajouter des items dans la liste (à l aide d un bouton) Utilisation du modèle fourni par défaut pour les JList, classe implémentant ListModel: Propose les méthodes d abonnement et de désabonnement de listener L accés via un indice à un élément et la taille de l ensemble Implémentation standard: DefaultListModel Listener sur le bouton qui modifie le modèle de liste. 12

14 DefaultModelExample Création du modèle de liste Initialisation de ce modèle (à partir du tableau) Création d un listener sur le bouton : Rajoute un item au modèle Demande le rafraîchissement de l IHM (via invalidate() et revalidate()). Repositionne le focus et la sélection sur l item ajouté A utiliser dès que l on a plus d une vue ou si le modèle évolue au cours du temps! 13

15 DefaultModelExample public class DefaultListModelExample extends JPanel { protected JList samplejlist; private DefaultListModel samplemodel; public DefaultListModelExample() { super(); String[] entries = { "Tokyo", "Nara", "Kobe", "Hiroshima", "Osaka", "Sapporo" ; samplemodel = new DefaultListModel(); for(int i=0; i<entries.length; i++) samplemodel.addelement(entries[i]); samplejlist = new JList(sampleModel); samplejlist.setvisiblerowcount(4); private class ItemAdder implements ActionListener { public void actionperformed(actionevent event) { int index = samplemodel.getsize(); samplemodel.addelement("item " + (index+1)); invalidate(); validate(); samplejlist.setselectedindex(index); samplejlist.ensureindexisvisible(index); 14

16 Un modèle spécifique Implémenter l interface ListModel : getelementat(int idx) : Given an index, this returns the data element. getsize() : This tells the JList how many entries are in the list addlistdatalistener : This lets the user add listeners that should be notified when an item is selected or deselected. removelistdatalistener :This lets the user remove listeners. Un exemple : les villes japonaises Location : ville, habitant, emblème LocationCollection : ensemble de villes LocationListModel : façade (ListModel =>LocationCollection) 15

17 La classe Location public class Location { private String town, flagfile; private long peoples; public Location(String town, long peoples, String flagfile){ settown(town); setpeoples(peoples); setflagfile(flagfile); public String tostring() { return gettown()+" ("+getpeoples()+")."; public String gettown() { return town; public void settown(string town) { this.town = town; public long getpeoples() { return peoples; public void setpeoples(long peoples) { this.peoples = peoples; public String getflagfile() { return flagfile; public void setflagfile(string flagfile) { this.flagfile = flagfile; 16

18 La classe LocationCollection public class LocationCollection { private static Location[] defaultlocations = { new Location("Tokyo", , "flags/tokyo.png"), new Location("Osaka", , "flags/osaka.png"), new Location("Nara", , "flags/nara.png"), new Location("Hiroshima", ,"flags/hiroshima.png"), new Location("Kyoto", ,"flags/kyoto.png") ; private Location[] locations; private int numberofpeoples; public LocationCollection(Location[] locations) { this.locations = locations; this.numberofpeoples = countpeoples(locations); public LocationCollection() { this(defaultlocations); public Location[] getlocations() { return locations; public int getnumberofpeoples() { return numberofpeoples; private int countpeoples(location[] locations) { int n = 0; for(int i=0;i<locations.length;i++) { n += locations[i].getpeoples(); return n; 17

19 La classe LocationListModel public class LocationListModel implements ListModel { private LocationCollection collection; public LocationListModel(LocationCollection collection) { this.collection = collection; public Object getelementat(int index) { return collection.getlocations()[index]; public int getsize() { return collection.getlocations().length; // Plutôt étendre AbstractListModel pour ces méthodes public void addlistdatalistener(listdatalistener l) { // sinon il faut gérer la liste des abonnés "à la main" public void removelistdatalistener(listdatalistener l) { 18

20 La classe JListCustomModel public class JListCustomModel extends JPanel { public JListCustomModel() { super(); Container content = getcontentpane(); LocationCollection collection = new LocationCollection(); LocationListModel listmodel = new LocationListModel(collection); JList samplejlist = new JList(listModel); Font displayfont = new Font("Serif", Font.BOLD, 18); samplejlist.setfont(displayfont); content.add(samplejlist); public static void main(string[] args) { Jframe f = new JFrame(" JList with a Custom Data Model "); f.getcontentpane().add(new JListCustomModel()); f.setdefaultcloseoperation(jframe.exit_on_close); f.pack(); f.setvisible(true); 19

21 Un afficheur dédié (Renderer) Spécialiser l affichage de la Jlist Principe de délégation l interface ListCellRenderer : getlistcellrenderercomponent(jlist list, Object value, int index, boolean isselected, boolean cellhasfocus ) Hériter de DefaultListCellRenderer Attention, cette méthode est invoquée souvent : pensez aux performances! 20

22 La classe LocationRenderer public class LocationRenderer extends DefaultListCellRenderer { private HashMap icontable = new HashMap(); public Component getlistcellrenderercomponent(jlist list, Object value, int index, boolean isselected, boolean hasfocus) { JLabel label = (JLabel) super.getlistcellrenderercomponent(list, value, index, isselected, hasfocus); if (value instanceof Location) { Location location = (Location)value; ImageIcon icon = (ImageIcon)iconTable.get(value); if (icon == null) { icon = new ImageIcon(location.getFlagFile()); icontable.put(value, icon); label.seticon(icon); return label; 21

23 La classe JListCustomRenderer public class JListCustomRenderer extends JPanel { public JListCustomRenderer() { LocationCollection collection = new LocationCollection(); LocationListModel listmodel = new LocationListModel(collection); JList samplejlist = new JList(listModel); samplejlist.setcellrenderer(new LocationRenderer()); Font displayfont = new Font("Serif", Font.BOLD, 18); samplejlist.setfont(displayfont); add(samplejlist); public static void main(string[] args) { Jframe f = new JFrame(" JList with a Custom Cell Renderer "); f.getcontentpane().add(new JListCustomRenderer()); f. setdefaultcloseoperation(jframe.exit_on_close); f.pack(); f.setvisible(true); 22

24 Synthèse du cours Le design pattern Abonneur/Abonnés Le dp MVC : Modèle Vue Controleur Découplage IHM du modèle Peut servir dans d autres contextes Base conceptuelle de nombreux autres composants Swing complexes tels que: Jlist, Jtree, Jtable 23