11.07.2015 Views

Les IHM en java - Free

Les IHM en java - Free

Les IHM en java - Free

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

<strong>Les</strong> <strong>IHM</strong> <strong>en</strong> <strong>java</strong>Programmation classique :main()--------Architecture c<strong>en</strong>tralisé, séqu<strong>en</strong>tielle.Problème :Peu adapté aux cas où le programme doit répondre à beaucoup de sollicitation extérieures, dont onconnaît pas l'ordre à priori.-> Programmation événem<strong>en</strong>tiellee i -> le main écoute -> traitem<strong>en</strong>twhile truesi e itraiter e iApplication aux graphisme <strong>en</strong> Java3 catégories d'objets1) sources d'évènem<strong>en</strong>ts : cré<strong>en</strong>t (et <strong>en</strong>voi<strong>en</strong>t) des évènem<strong>en</strong>ts au programme (ex : bouton)2) évènem<strong>en</strong>ts : transport<strong>en</strong>t de l'information <strong>en</strong>tre la source et le programme.3) "écouteurs" : pr<strong>en</strong>n<strong>en</strong>t <strong>en</strong> charge la réaction aux évènem<strong>en</strong>ts.Mode de fonctionnem<strong>en</strong>t "publish/subscribe"Principe : 1) les sources publi<strong>en</strong>t un certain nombre d'informations (d'évènem<strong>en</strong>ts produits)2) les écouteurs intéressés s'inscriv<strong>en</strong>t auprès de ces sources pour être avertis desévènem<strong>en</strong>ts.3) Quand une source génère un événem<strong>en</strong>t :– elle regarde la liste des écouteurs inscrits– elle <strong>en</strong>voie l'évènem<strong>en</strong>t à chacun d'eux pour qu'ils le trai<strong>en</strong>t


Ev<strong>en</strong>tObject+getSource().Object()«interface»Ev<strong>en</strong>tList<strong>en</strong>erMyEv<strong>en</strong>t* *MySource+addMyList<strong>en</strong>er(<strong>en</strong>trée MyList<strong>en</strong>er : MyList<strong>en</strong>er)+decl<strong>en</strong>cheur()-list<strong>en</strong>er0..* 1«interface»MyList<strong>en</strong>er+traiter(<strong>en</strong>trée MyEv<strong>en</strong>t : MyEv<strong>en</strong>t)Trucdecl<strong>en</strong>cheur(){MyEv<strong>en</strong>t e = new MyEv<strong>en</strong>t(...);for(MyList<strong>en</strong>er m:list<strong>en</strong>ers)m.traiter(e);}Principaux composants graphiques<strong>java</strong>.awt; <strong>java</strong>.awt.ev<strong>en</strong>t;


ObjectM<strong>en</strong>uCompon<strong>en</strong>tCompon<strong>en</strong>t0..*-Compon<strong>en</strong>t1M<strong>en</strong>uBarM<strong>en</strong>uItem*Button TextCompon<strong>en</strong>t Label Canevas Container*M<strong>en</strong>uCheckBoxM<strong>en</strong>uTextField TextArea Panel Window*****Applet Frame DialogActionList<strong>en</strong>er*WindowList<strong>en</strong>er


<strong>java</strong>.utilEv<strong>en</strong>tObjectAWTEv<strong>en</strong>tActionEv<strong>en</strong>t Adjustem<strong>en</strong>tEv<strong>en</strong>t Compon<strong>en</strong>tEv<strong>en</strong>t……….PaintEv<strong>en</strong>t WindowEv<strong>en</strong>t FocusEv<strong>en</strong>t InputEv<strong>en</strong>tMouseEv<strong>en</strong>tKeyEv<strong>en</strong>tPrincipe de nommageXYZEv<strong>en</strong>t XYZList<strong>en</strong>er (interface)Source : addXYZList<strong>en</strong>er(XYZList<strong>en</strong>er)/!\ Pas de nommage standard des méthodes de traitem<strong>en</strong>t.Remarque :Un list<strong>en</strong>er peut avoir plusieurs méthodes de traitem<strong>en</strong>ts (si la source émet différ<strong>en</strong>ts typesd'évènem<strong>en</strong>ts)-> interfaces plus ou moins riches(ex :ActionList<strong>en</strong>er 1 méthode "actionPerformed")WindowList<strong>en</strong>er plus de 10 méthodes !)


-> "coût" d'implém<strong>en</strong>tation de ces interfaces très variable.Exemple 1 :Un bouton qui affiche "clic" quand on appuie dessus.CLICKME$<strong>java</strong> Exemple 1clic// Exemple1.<strong>java</strong>import <strong>java</strong>.awt.*;import <strong>java</strong>.awt.ev<strong>en</strong>t.*;public class Exemple1 ext<strong>en</strong>ds Frame implem<strong>en</strong>ts ActionList<strong>en</strong>er{protected Button bClick;public static void main(String args[]){new Exemple1();}public void actionPerformed(ActionEv<strong>en</strong>t e){}System.out.println("clic");public Exemple1(){super("Ex1");// initialisation des attributsbClick = new Button("click me");// placem<strong>en</strong>t des composantsadd(bClick);// inscriptionbClick.addActionList<strong>en</strong>er(this);// apparition de la f<strong>en</strong>être


}pack();setVisible(true);Container+add(<strong>en</strong>trée Compon<strong>en</strong>t)+getLayout()+setLayout(<strong>en</strong>trée LayoutManager)1 1LayoutManager+add(<strong>en</strong>trée Compon<strong>en</strong>t)Gestion de placem<strong>en</strong>t descomposantsFlowLayout BorderLayout GridLayout GridBagLayoutDéfaut pour les panelsDéfaut pour lesWindowFlowLayout : de gauche à droite et de haut <strong>en</strong> bas du container/!\ RetaillageBorderLayout : 5 zones (nord sud est ouest c<strong>en</strong>tre)GridLayout(l,c) : matrice l*cadd(comp) -> de gauche à droite et de haut <strong>en</strong> basGridBagLayout : cellules de taille variable (/!\ fastidieux)Exemple2 : Application graphique de sondage


Êtes vous pour ou contre ?OUINONRésultats : 65% pour.Deux possibilités de placem<strong>en</strong>t :– BorderLayout– GridLayout(3,1)// Sondage.<strong>java</strong>import <strong>java</strong>.awt.*;import <strong>java</strong>.awt.ev<strong>en</strong>t.*;import moi.compteur.*;public class Sondage ext<strong>en</strong>ds Frame implem<strong>en</strong>ts ActionList<strong>en</strong>er{protected Label lQestion, lRes;protected Button bPour, bContre;protected Compteur cPour, cContre;public Sondage(){super("Sondage");// initialisation attributslQestion = new Label("Etes vous pour ou contre ?");lRes = new Label("Resultat : N/A");bPour = new Button("Pour");bContre = new Button("Contre");cPour = new Compteur();cContre = new Compteur();// placem<strong>en</strong>tadd("North", lQuestion);add("South", lRes);add("West", bPour);add("East", bContre);// inscriptionbPour.addActionList<strong>en</strong>er(this);bContre.addActionList<strong>en</strong>er(this);


}**** addWindowList<strong>en</strong>er(new FermeF<strong>en</strong>etre) ***// apparitionpack();setVisible(true);public void actionPerformed(ActionEv<strong>en</strong>t e){}if(e.getSource().equals(bPour))elsecPour.incr();cContre().incr();lRes.setText("Resultats : " + (100*cPour.valeur())/(cPour.valeur() +cContre.valeur()) + "% pour");}public static void main(String args[]){}new Sondage();Deux remarques :1) Stratégie du "actionPerformed" unique pas valable si <strong>IHM</strong> complexe2) La f<strong>en</strong>être ne se ferme pas ! (pas de WindowList<strong>en</strong>er)idée 1 : Sondage implem<strong>en</strong>te WindowList<strong>en</strong>erpublic void windowClosing(WindowEv<strong>en</strong>t e){System.exit(0);}pb : ne compile pas.-> 11 méthodes à écrireidée 2 : utiliser un "adapter" qui wrappe les méthodes du list<strong>en</strong>er <strong>en</strong> ne faisant ri<strong>en</strong>.Pb : Sondage ne peut pas hériter de Frame et de WindowAdapter.-> Il faut donc passer par une classe intermédiairepublic class FermeF<strong>en</strong>etre ext<strong>en</strong>ds WindowAdapter{public void windowClosing(WindowEv<strong>en</strong>t e){System.exit(0);


}}cf les *** du prog au dessus/!\ Conseil : Lorsque l'<strong>IHM</strong> est riche-> associer 2 gestionnaire à chaque objet graphique (plus modulaire, plus lisible)class GerePour implem<strong>en</strong>ts ActionList<strong>en</strong>er{public void actionPerformed(ActionEv<strong>en</strong>t e){// action}}pb : pas d'accès au sondage depuis GerePourclass GerePour implem<strong>en</strong>ts ActionList<strong>en</strong>er{Sondage s;public GerePour(Sondage s){this.s=s;}public void actionPerformed(ActionEv<strong>en</strong>t e){s.cPour.incr()....}}Remarque : inopérant si attributs inaccessibles (privés)idée 3 : faire une "inner class"Définition : Une inner class (classe interne) à la classe C est définie à l'intérieur de la définition deC.Proposition : accès libre aux attributs de CDébut TD demain :Annuaire


AbonneAnnuaire+nom() : string+numero() : string+ajouter(<strong>en</strong>trée Abonne : Abonne)+chercherNom(<strong>en</strong>trée Numero : string) : string+chercherNumero(<strong>en</strong>trée Nom : string) : string+sauver(<strong>en</strong>trée nomFiche : string)+charger(<strong>en</strong>trée nomFiche : string)NomNumero+ Charger Sauver

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!