Vous êtes sur la page 1sur 38

IHM : Introduction

Interactions Homme Machine Communication Homme Machine Dialogue Homme Machine Dfinition: --ensemble des dispositifs matriels et logiciels permettant un utilisateur dinteragir avec un systme interactif --un domaine de linformatique qui sintresse la conception des logiciels interactifs et de leurs interfaces qui sappuie sur des connaissances en sciences humaines et sociales : psychologie, sociologie, ergonomie, en informatique qui met au point des mthodes, des techniques, des outils

IHM : Introduction

L'IHM ne s'enseigne pas elle s'apprend Apprentissage par confrontation, mini-projet Dvelopper un logiciel

Swing

Swing

IHM : Historique
1945-1970 : Dispositifs dentre-sortie limits Tableaux de bord Imprimantes Langages de commandes 1963 : cran graphique et stylo optique 1968 : premire souris 1980 : applications grand public volution des interfaces : Clavier, souris, Interfaces graphiques, manipulation directe, 2D, 3D,

IHM ?
1970 : Interface Homme/Machine Apparition des interfaces graphiques Informatique personnelle 1980 : Interaction Homme/Machine Informatique outil 1990 : Interactions Humains-Machines TIC : informatique de communication 2000 : I. des Humains avec des Mondes Informatique rpandue, invisible, ralit virtuelle, ralit augmente, ralit mixte, interfaces tangibles Dispositif matriel et logiciel li une application Interaction homme machine Relations entre lhumain et la machine par linterface
Swing 4

Swing

Reproches aux informaticiens


Les concepteurs informaticiens S'adaptent uniquement sur le fonctionnement du systme traitent linterface en dernier pensent que tous les utilisateurs leur ressemblent ne sont pas forms lanalyse de besoins, travailler avec des utilisateurs ne comprennent pas que les besoins voluent au cours de conception 1.

Pourquoi tudier lIHM ?


conomiques 50 90 % des cots de dveloppement pour les dapplications interactives 2. Sociales des gens qui sont diffrents de vous utiliseront vos logiciels des interfaces mal conues cotent cher 3. Scientifiques et techniques Les interfaces utilisateurs sont difficiles mettre au point Les gens sont inattendus Existence de techniques, mthodes et dmarches rigoureuses 4. Professionnelles Vous aurez travailler pour des entreprises qui font des logiciels pour des utilisateurs, pas seulement pour des machines
Swing 6

Swing

volution de la notion d'interface


largissement des problmatiques parallle l'volution technique conviviale , utilisable , facile comprendre et utiliser lment structurant les systmes d informations cran de texte et clavier interface dispositif matriel, change d'information, codage/dcodage interfaces graphiques utilisateur, tche, facteurs humains, langage multimdia, capteurs, reconnaissance vocale, activit, acteurs humains, communication papier lectronique, tableau ou bureau interactif, mdiaspace travail coopratif, machines comme lment d'un espace interactif informatique vestimentaire, ralit augmente/ virtuelle, ordinateur vanescent, interface tangible/ sans couture
Swing 7

Concepts de base des interfaces graphiques


WIMPS : Windows, Icones, Menus, Pointers Manipulation directe souris, visualisation immdiate du rsultat de la manipulation apprentissage rapide, efficace aussi pour les experts limite les efforts de mmorisation permet l'exprimentation (vrification immdiate, rversibilit)

Swing

En tant que concepteur


Retenez que Ce nest pas lutilisateur de sadapter vos ides, certes gniales Mais cest au concepteur de sadapter lactivit de lutilisateur Pour cela il y a Des sciences (humaines) : ergonomie (des logiciels), psychologie, sociologie Des mthodes : conception centre utilisateur Des techniques : entretiens, incidents critiques etc.

Qui construit des interfaces ?


Une quipe Pourquoi ? Idalement Graphistes Spcialistes de linteraction Ergonomes Marketing Rdacteurs techniques Ingnieurs spcialiss dans les tests Dveloppeurs Informatiques Utilisateurs
9 Swing 10

Swing

Exemples des interfaces


C:\Program Files\Java\jdk1.6.0_23\demo\jfc\SwingSet2

Swing

11

Swing

12

Installer et configurer JAVA


Tlcharger et installer jdk x.x.x_xx Configurez l'environnement Java sous Windows - Aprs l'installation de Java Development Kit sous Windows, et pour faciliter les taches de compilation et dexcution il est ncessaire de le configurer. Effectuez les tapes suivantes pour rendre des outils Java accessible 1. Cliquez sur Dmarrer> Panneau de configuration > Systme > Onglet avanc 2. Cliquez sur le bouton variable denvironnement. Vous obtenez la fentre des variables denvironnement, contenant une partir user et une partie systme. 3. Dans la partie user, cliquez sur nouveau . Ajoutez une nouvelle variable PATH et associez la valeur suivante : C :\Program Files\Java\ jdk x.x.x_xx \bin ;%Path% .
Swing 13

Interface Graphique: awt & swing


Java, permet de crer des interfaces graphiques homme machines (IHM). Tous les outils ncessaires pour raliser des interfaces graphiques existent dans les deux paquetages suivants : java.awt et javax.swing. Les interfaces (IHM) font intervenir de nos jours des lments que l'on retrouve dans la majorit des systmes d'exploitation : les fentres, les listes de choix, les menus droulants, les boutons, les boutons radios, etc... awt =1re boite outil de java awt: aspect change d'une plateforme une autre. swing = extension swing : faire que tout fonctionne de manire identique partout.
Swing 14

Interface Graphique: awt & swing


awt (Abstract Window Toolkit) (java.awt): C'est pour construire des IHM que le package awt est inclus dans toutes les versions de Java. awt s'appuie sur les ressources systmes Catgories de classes : graphique (couleurs, fontes, formes, ) composants (Component) (fentres, boutons, menus, ) gestionnaires (position des composants)

awt

Swing

15

Swing

16

swing

Mon premier exemple

Swing

17

Swing

18

Interface Graphique: Structure


JFrame conteneurs: Japplet, JFrame, Jpanel, JSplitPane, JTabbedPane,... composants atomiques : JButton, Jlist, JPopupMenu

Interface Graphique: conteneurs

Dans une application Swing, on instanciera un cadre JFrame qui permet davoir une fentre principale. Une JFrame est une fentre avec un titre et une bordure.

gestionnaire de disposition : LayoutManager La JFrame est un composant qui contient tous les autres. interaction avec lutilisateur : gestionnaire dvnements Boite de dialogue La plupart des composants graphiques ont une taille par dfaut, qui peut d'ailleurs tre nulle.

Swing

19

Swing

20

Interface Graphique: conteneurs

Interface Graphique: conteneurs


JFrame cadre = new javax.swing.JFrame(" Deuxime exemple ");

on instancie ici la classe JFrame en passant au constructeur une chane de caractres pour le titre de la fentre.
panneau.setPreferredSize(new Dimension(324, 240));

le panneau ait 324pixels de largeur et 240 pixels de hauteur.


panneau.setBackground(Color.YELLOW);

le panneau ait la couleur jaune pour couleur de fond. cadre.setContentPane(panneau); le containeur de la fentre soit un panneau. cadre.setLocation(500, 500); : on positionne le cadre. cadre.pack(); : la mthode pack: calcule la dimension de la fentre en fonction de ce qui est mis l'intrieur. cadre.setVisible(true); par dfaut, une fentre est invisible ; on demande ici ce que la fentre soit visible
Swing 21 Swing 22

Interface Graphique: conteneurs


JLabel label = new JLabel("Bonjour"); on instancie ici un label en passant au constructeur une chane de caractres cadre.add(label); lajout de label cadre.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

Interface Graphique: conteneurs

par dfaut, lorsqu'on ferme une fentre, cela ne termine pas l'application. On demande par cette instruction que l'application se termine quand on ferme la fentre.

Swing

23

Swing

24

Interface Graphique: conteneurs


JPanel

Interface Graphique: conteneurs


Un JPanel est un conteneur lmentaire destin contenir d'autres composants. Il est muni d'un gestionnaire de placement Il organise les lments au fur et mesure qu'ils sont intgrs l'interface, de gauche droite, la manire des mots d'une phrase.

Swing

25

Swing

26

Interface Graphique: conteneurs

Interface Graphique: conteneurs


JTabbedPane Permet davoir des onglets Permet de mieux grer lespace de travail Un panneau onglets est reprsent par la classe JTabbedPane. Il organise les lments au fur et mesure qu'ils sont intgrs l'interface, de gauche droite, la manire des mots d'une phrase.

Swing

27

Swing

28

Interface Graphique: conteneurs


JTabbedPane : Constructeurs JTabbedPane() : Cration d'un panneau onglets vierge. Si le nombre d'onglets devient important ces derniers se placent automatiquement sur plusieurs lignes. JTabbedPane(int placement) : Cration d'un panneau onglets vierge. Les onglets, se place dans l'une des quatre orientations prvues suivant la constante spcifie en argument : JTabbedPane.TOP, JTabbedPane.BOTTOM, JTabbedPane.LEFT ou JTabbedPane.RIGHT.

Interface Graphique: conteneurs


JTabbedPane : Constructeurs JTabbedPane(int placement, int rgle) : vous avez la possibilit de faire en sorte que les onglets, quel que soit leur nombre, reste systmatiquement sur une seule ligne. Dans ce cas l, des flches supplmentaires apparaissent afin que vous puissiez naviguer dans l'ensemble de vos onglets. Voici les deux constantes que vous pouvez alors utiliser : JTabbedPane.WRAP_TAB_LAYOUT (par dfaut) ou JTabbedPane.SCROLL_TAB_LAYOUT.

Swing

29

Swing

30

Interface Graphique: conteneurs


JTabbedPane : Ajout de nouveaux onglets :
1- void addTab(String titre, Component contenu) : Ajout d'un nouvel onglet avec son titre, en spcifiant le composant enfant qui propose le contenu dsir. 2- void addTab(String titre, Icon icne, Component contenu) : 1 + une icne. 3- void addTab(String titre, Icon icne, Component contenu, String aide) : 2+une bulle d'aide qui s'activera lors du passage du curseur de la souris. 4- void insertTab(String titre, Icon icne, Component contenu, String aide, int emplacement) : On peut spcifier la position dsire dans l'ordre des onglets dj tabli.
Swing 31

Interface Graphique: conteneurs


JTabbedPane : Gestion des onglets :
1- void remove(Component contenu) : Suppression de l'onglet et de son contenu correspondant au composant choisi. 2- void remove(int index) : Suppression de l'onglet spcifi et de son contenu. 3- void removeAll() : Suppression de tous les onglets et de leur contenu. 4- void setBackgroundAt(int index, Color fond) : Proposer une couleur de fond pour l'onglet slectionn. 5- void setComponentAt(int index, Component contenu) : Proposer un autre contenu pour l'onglet slectionn. 6- void setEnabledAt(int index, boolean actif) : Permet d'activer ou de dsactiver un onglet spcifique. 7- void setForegroundAt(int index, Color fond) : Proposer une couleur du titre pour l'onglet slectionn.
Swing 32

Interface Graphique: conteneurs


JTabbedPane : Le panneau onglets:
8- void setIconAt(int index, Icon icne) : Proposer une nouvelle icne pour l'onglet slectionn. 9- void setSelectedIndex(int index) : Slectionne l'onglet. 10-void setTitleAt(int index, String titre) : Spcifie le titre de l'onglet slectionn. 11-void setToolTipTextAt(int index, String aide) : Spcifie la bulle d'aide associ l'onglet slectionn. Exemples:

Swing

33

Swing

34

Interface Graphique: conteneurs


JScrollPane:
JScrollPane est un conteneur permettant de munir un composant de barres de dfilement. Ceci permet de visualiser des composants plus grands que l'espace dans lequel ils sont visualiss. Les JScrollBars sont munies d'une stratgie d'affichage qui peut tre : VERTICAL_SCROLLBAR_AS_NEEDED : la ScrollBar verticale n'est visible que si elle est ncessaire. VERTICAL_SCROLLBAR_NEVER : la ScrollBar verticale n'est jamais visible VERTICAL_SCROLLBAR_ALWAYS : la ScrollBar verticale est toujours visible HORIZONTAL_SCROLLBAR_AS_NEEDED : la ScrollBar horizontale n'est visible que si elle est ncessaire. HORIZONTAL_SCROLLBAR_NEVER : la ScrollBar horizontale n'est jamais visible HORIZONTAL_SCROLLBAR_ALWAYS : la ScrollBar horizontale est toujours visible
Swing 35 Swing 36

Interface Graphique: conteneurs


JScrollPane: Constructeurs
JScrollPane( ) Cre un JScrollPane sans composant vue, avec des politique horizontale et verticale AS_NEEDED JScrollPane(Component vue ) Cre un JScrollPane avec composant vue, avec des politique horizontale et verticale AS_NEEDED JScrollPane(Component vue, int vPolitique, int hPolitique) Cre un JScrollPane avec composant vue, une politique horizontale et une politique verticale JScrollPane(int vPolitique, int hPolitique) Cre un JScrollPane sans composant vue, mais avec une politique horizontale et une politique verticale
Swing 37

Interface Graphique: conteneurs


JScrollPane: quelques mthodes void setViewPortView( Component c) visualiser.
void setVerticalScrollBarPolicy(int p) la ScrollBar verticale. int getVerticalScrollBarPolicy() Affecte le composant Scrollable

Affecte la stratgie d'affichage de

void setHorizontalScrollBarPolicy( int p) de la ScrollBar verticale. int getHorizontalScrollBarPolicy()

Affecte la stratgie d'affichage

void setWheelScrollingEnabled(boolean b) Si b vaut true on peut scroller verticalement le composant avec la roulette de la souris.
Swing 38

Swing

39

Swing

40

Interface Graphique: conteneurs


JSplitPane :
Permet de diviser en deux lespace zone La barre de division qui apparait entre les deux composants peut tre dplace. L'orientation du JSplitPane peut tre :
JSplitPane.HORIZONTAL_SPLIT

Interface Graphique: conteneurs


JSplitPane : Constructeurs
JSplitPane() Cre un JSplitPane horizontal et affichage non continu. JSplitPane(int orientation) Cre un JSplitPane orient suivant orientation

et affichage non continu. JSplitPane(int orientation, boolean continu) Cre un JSplitPane orient suivant orientation et continu si continu vaut true.
JSplitPane(int orientation, boolean continu, Component cGauche, Component cDroit)

les deux composants sont aligns

horizontalement
JSplitPane.VERTICAL_SPLIT

les deux composants sont aligns

verticalement

Cre un JSplitPane orient suivant orientation et continu si continu vaut true. Les deux composants sont cGauche et cDroit. JSplitPane(int orientation, Component cGauche, Component cDroit) Cre un JSplitPane orient suivant orientation et affichage non continu. Les deux composants sont cGauche et cDroit.

Swing

41

Swing

42

Interface Graphique: conteneurs


JSplitPane : quelques Mthodes
int getDividerSize() Retourne la taille de la barre de division. Affecte la taille de la barre de division.

void setDividerSize(int s)

int getDividerLocation() Retourne la position de la barre de division. void setDividerLocation(int l) division. Affecte la position (en valeur absolue) de la barre de

void setDividerLocation(double d) division. double getResizeWeight()

Affecte la position (en valeur relative) de la barre de

Retourne le taux de redistribution de l'espace supplmentaire.

Exemple:
Swing 43 Swing 44

Interface Graphique: conteneurs


Box:
Le conteneur Box utilise le gestionnaire de layout BoxLayout, mais ce gestionnaire de mise en page est automatiquement attribu, si vous n'avez jamais besoin de travailler de faon explicite.

Exemple:

Swing

45

Swing

46

Swing

47

Swing

48

Interface Graphique: LES COMPOSANTS GRAPHIQUES


Les panneaux contiennent des tiquettes (JLabel) un champ de texte (JTextField) une liste (JList) et une combobox (JComboBox) des boutons cocher (JCheckBox) des bordures (TitledBorder) des boutons radio (JRadioButton) des boutons ordinaires (JButton) zone de saisie multilignes (JTextArea) JScrollBar

Interface Graphique: LES COMPOSANTS GRAPHIQUES


Jlabel : Un Label affiche une seule ligne de texte (tiquette) non modifiable. En gnral, les tiquettes ne traitent pas d'vnements. Pour afficher un texte, on peut utiliser la mthode setText ou une version surcharge du constructeur. Pour acher une image, on doit utiliser un composant intermdiaire, licone (ImageIcon). Le constructeur ImageIcon est capable de charger des images jpeg, gif et png. Le constructeur de JLabel est surcharg pour accepter un objet ImageIcon en paramtre.

Swing

49

Swing

50

Interface Graphique: LES COMPOSANTS GRAPHIQUES


Jlabel : Emplacement : 1. JLabel.BOTTOM 2. JLabel.CENTER 3. JLabel.LEFT 4. JLabel.RIGHT 5. JLabel.TOP Exmple:

Interface Graphique: LES COMPOSANTS GRAPHIQUES

Swing

51

Swing

52

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JTextField : Le champ de texte est un dispositif d'entre de texte sur une seule ligne. Il est source dActionEvent On peut dfinir un champ de texte comme tant ditable ou non. Mthodes : void setText(String text) String getText() pour mettre ou retirer du texte dans le TextField Exemple:

Swing

53

Swing

54

Interface Graphique: LES COMPOSANTS GRAPHIQUES

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JList : Constructeurs : JList() // modle vide JList(ListModel dataModel) // cas gnral JList(Object[] listData) // tableau JList(Vector listData) // vecteur Cration dune liste partir dun tableau (liste non modifiable) : String[] data = {"A", "B", "C", "D"}; JList liste = new JList(data); Accs au modle, donc au contenu: for(int i = 0; i < list.getModel().getSize(); i++) { System.out.println(list.getModel().getElementAt(i));

Swing

55

Swing

56

Interface Graphique: LES COMPOSANTS GRAPHIQUES


La classe JComboBox permet la slection d'une entre parmis une squence. Le composant est constitu de deux parties : un diteur qui affiche la slection courante et permet ou non d'entre des valeurs et une liste droulante qui affiche les choix possibles. Deux modes de fonctionnement diffrents : Non ditable : ComboBoxModel Editable : MutableComboBoxModel Exemple:

Swing

57

Swing

58

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JCheckBox : bote cocher qui peut tre slectionne ou non. Il est source dActionEvent On peut dfinir un champ de texte comme tant ditable ou non. Mthodes : La slection ou la dselection est notifie par un ItemEvent un couteur implmentant linterface ItemListener. la mthode getStateChange() de ItemEvent retourne une constante : ItemEvent.DESELECTED ou ItemEvent.SELECTED. la mthode getItem() de ItemEvent renvoie la chane contenant l'tiquette de la case cocher considre Exemple:
Swing 59 Swing 60

Interface Graphique: LES COMPOSANTS GRAPHIQUES

Interface Graphique: LES COMPOSANTS GRAPHIQUES


TitledBorder : Une bordure permettant l'inclusion dune chane de caractres Exemple:

Swing

61

Swing

62

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JRadioButton : possde des mthodes constructeurs dont les arguments et les fonctionnalits sont les mmes. Pour les organiser en groupe, crer une classe dobjet : ButtonGroup

Exemple:

Swing

63

Swing

64

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JButton : Constructeurs : JButton (String text); JButton (ImageIcon picture); JButton (String text, ImageIcon picture); Mthodes : void addActionListener (ActionListener object); void setText (String text); void setActionCommand (String cmd); void setIcon (ImageIcon icon); void requestFocus(); Exemple:
Swing 65 Swing 66

Interface Graphique: LES COMPOSANTS GRAPHIQUES

Swing

67

Swing

68

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JTextArea : zone de texte plusieurs lignes Constructeurs. JTextArea() Construit une nouvelle instance de JTextArea. JTextArea(int l, int c) Construit une nouvelle instance de JTextArea, lignes l et c colonnes. JTextArea(String texte) Construit un JTextArea avec un texte initial. JTextArea(String texte, int l, int c) Mthodes: String getText() String getText(int d, int l) String getSelectedText() void setText(String t) void append(String t) void insert(String t, int pos) void replaceRange(String t,int d,int f) int getColumns( ) void replaceSlection(String t) void setEditable(boolean) Exemple:
Swing 69 Swing 70

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JScrollBar : barre de dfilement

Swing

71

Swing

72

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JPasswordField : composant qui permet l'dition d'une ligne simple dont les caractres sont cachs Constructeurs: JPasswordField() Construction d'un JPasswordField. JPasswordField(Document doc, String txt, int c) JPasswordField(int c) Construction d'un JPasswordField avec un nombre de colonnes maximum. Mthodes : char[] getPassword() Retourne un tableau de caractres contenant le mot de passe saisi. void setEchoChar(char c) Change le caractre cho des caractres taps. char getEchoChar() Exemple:
Swing 73 Swing 74

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JEditorPane : permet de saise de texte riche multilignes. Ce type de texte peut contenir des informations de mise en pages et de formatage. Exemple:

Swing

75

Swing

76

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JProgressBar : Ce contrle est une barre de progression. La classe JProgressBar possde plusieurs styles : BORDER, INDETERMINATE, SMOOTH, HORIZONTAL, VERTICAL Exemple:

Swing

77

Swing

78

Interface Graphique: LES COMPOSANTS GRAPHIQUES


JSlider: Les JSlider permettent la saisie graphique dun nombre. Un JSlider doit contenir les bornes max et min. Exemple:

Swing

79

Swing

80

Interface Graphique: JTree


Le composant JTree permet de visualiser une structure d'arbre. Une instance de JTree ne contient pas de donnes, mais simplement une vue de donnes. Arbre : Un arbre est cr partir dun TreeModel Il existe plusieurs modles de slection slection dun seul lment slection de plusieurs lments contigus slection de plusieurs lments disparates On peut indiquer un CellRenderer pour afficher une cellule de faon particulire. On peut indiquer un CellEditor pour changer la valeur dune cellule Exemple:
Swing 81 Swing 82

Swing

83

Swing

84

Interface Graphique: JTable


JTable : JTable affiche des donnes dans un tableau TableModel rgit la gestion des donnes On peut fournir les donnes dans un tableau bidimensionnel dobjets : Object[][]et utiliser le DefaultTableModel,mais il vaut mieux tendre AbstractTableModel. La slection est rgi par une modle de slection De plus, il y a un modle de colonnes. Un tableau est entour dascenseurs, en gnral.

Interface Graphique: JTable


Constructeurs : JTable() modles par dfaut pour les trois modles JTable(int numRows, int numColumns) avec autant de cellules vides JTable(Object[][] rowData, Object[] columnNames) avec les valeurs des cellules de rowData et noms de colonnes columnNames. JTable(TableModel dm) avec le modle de donnes dm, les autres par dfaut. JTable(TableModel dm, TableColumnModel cm) avec modle de donnes et modle de colonnes fournis. JTable(TableModel dm, TableColumnModel cm, ListSelectionModel sm) Les trois modles sont fournis. JTable(Vector rowData, Vector columnNames) ici, les donnes sont fournies par colonne. Exemple :

Exemple:
Swing 85 Swing 86

Swing

87

Swing

88

Interface Graphique: Menu


Menu : Pour crer un menu droulant, il y a essentiellement 3 oprations : cration de la barre menu : JMenuBar menuBar=new JMenuBar(); cration des menus : JMenu couleur=new JMenu("couleur"); menuBar.add(couleur); JMenu taille=new JMenu("taille"); menuBar.add(taille); cration des options : rouge=new JMenuItem("rouge"); rouge.addActionListener(this);couleur.add(rouge); bleu=new JMenuItem("bleu"); bleu.addActionListener(this);couleur.add(bleu); Naturellement, il faudra ajouter la barre des menus la fentre, et adjoindre aux difrentes options comme indiqu ci-dessus. Exemple 1:
Swing 89 Swing 90

Interface Graphique: Menu

Exemple 2

Swing

91

Swing

92

Interface Graphique: JFileChooser


Un JFileChooser permet de slectionner un fichier en parcourant larborescence du systme de fichier. Exemple :

Swing

93

Swing

94

Interface Graphique: JColorChooser


Un JColoChooser permet de choisir une couleur. Exemple :

Swing

95

Swing

96

Interface Graphique: gestionnaire de disposition


Layout est une technique qui permet de placer des composants dans un container. Layout place les composants les uns par rapport aux autres. Layout organise les composants lorsque la taille du container varie. Layout gre le positionnement. Gestionnaires les plus courants : BorderLayout, BoxLayout, CardLayout, FlowLayout, GridLayout, GridBagLayout.

Swing

97

Swing

98

Interface Graphique: BorderLayout


Le BorderLayout spare un container en cinq zones: nord, sud, ouest, est, et centre. "nord" et "sud" occupent toute la largeur, "ouest" et "est" occupent la hauteur qui reste, "centre" occupe la place restante. Lorsque lon agrandit le container, le centre s'agrandit. Les autres zone prennent uniquement lespace qui leur est ncessaire. Exemple:

Swing

99

Swing

100

Interface Graphique: BoxLayout


Un BoxLayout permet dempiler les composants du container ( verticalement ou horizontalement) BoxLayout donne chaque composant la place quil demande En utilisant ce layout on peut rajouter des blocs invisible. Exemple:

Swing

101

Swing

102

Interface Graphique: CardLayout


CardLayout aide construire des botes de dialogue composes de plusieurs onglets. Un onglet se compose gnralement de plusieurs contrles : on insre des panneaux dans la fentre utilise par le CardLayout. Exemple:

Swing

103

Swing

104

Interface Graphique: FlowLayout


Par dfaut le gestionnaire de prsentation d'un panel est de type FlowLayout. Un FlowLayout permet de ranger les composants dans une ligne. Si lespace est trop petit FlowLayout ajoute une ligne de plus. Exemple:

Swing

105

Swing

106

Interface Graphique: GridLayout


GridLayout tablit un rseau de cellules identiques qui forment une sorte de quadrillage invisible : les composants sont organiss en lignes et en colonnes. Les lments insrs dans la grille ont tous la mme taille. Les cellules du quadrillage se remplissent de droite gauche ou de haut en bas.

Exemple:

Swing

107

Swing

108

Interface Graphique: GridBagLayout


GridBagLayout (grille tendue) est le plus riche en fonctionnalits : le conteneur est divis en cellules gales mais un composant peut occuper plusieurs cellules de la grille et il est possible de faire une distribution dans des cellules distinctes. Un objet de la classe GridBagConstraints permet de donner les indications de positionnement et de dimension l'objet GridBagLayout. Exemple:

Swing

109

Swing

110

Interface Graphique: Gestion des vnements


Il est possible daffecter un vnement un objet grce des classes spciales appeles listeners. Ces classes nous permettent dcouter les actions effectues sur un objet swing et de lancer la fonction adquat laction produite. Les deux classes : java.awt.event.MouseMotionAdapter et java.awt.event.ActionListener nous permettent lcoute des actions. Lorsqu'un vnement se produit : il est reu par le composant avec lequel l'utilisateur interagit (un bouton, un curseur, un champ de texte, ...). Ce composant transmet cet vnement un autre objet, un couteur qui possde une mthode pour traiter lvnement.
Swing 111 Swing 112

Interface Graphique: Gestion des vnements


Les vnements utilisateurs sont grs par plusieurs interfaces EventListener. Les interfaces EventListener permettent un composant de gnrer des vnements utilisateurs. Une classe doit contenir une interface auditeur pour chaque type de composant :
ActionListener : clic de souris ou enfoncement de la touche Enter ItemListener : utilisation d'une liste ou d'une case cocher MouseMotionListener : evnment de souris, WindowListener : vnement de fentre TextListener : Changement de valeur dans une zone de texte
Swing 113 Swing

Interface Graphique: Gestion des vnements


AdjustmentListener :Dplacement d'une chelle ComponentListener :Savoir si un composant a t cach, affich ContainerListener : Ajout d'un composant dans un Container FocusListener : Pour savoir si un lment a le "focus" KeyListener : Pour la gestion des vnements clavier

114

Interface Graphique: Gestion des vnements


Interface ActionListener void actionPerformed(ActionEvent e)

Interface Graphique: Gestion des vnements


ActionListener : Exemple 1

Interface MouseListener

void mousePressed(MouseEvent e) void mouseReleased(MouseEvent e) void mouseClicked(MouseEvent e) void mouseEntered(MouseEvent e) void mouseExited(MouseEvent e) void actionPerformed(ActionEvent e)
Swing 115 Swing 116

Interface Graphique: Gestion des vnements


ActionListener : Exemple 2

Swing

117

Swing

118

Interface Graphique: Gestion des vnements


ItemListener : Exemple

Swing

119

Swing

120

Interface Graphique: Gestion des vnements


MouseMotionListener : Exemple

Swing

121

Swing

122

Interface Graphique: Gestion des vnements


TextListener : Exemple

Swing

123

Swing

124

Interface Graphique: Gestion des vnements


AdjustmentListener : Exemple

Interface Graphique: Gestion des vnements


ComponentListener : Exemple

Swing

125

Swing

126

C:\Program Files\Java\jdk1.6.0_23\demo\jfc\SwingSet2\SwingSet2.exe

Swing

127

Swing

128

Interface Graphique: Boite de dialogue


Les botes de dialogue servent envoyer un message l'utilisateur, demander une confirmation, saisir une information ... Une boite de dialogue dpend dune Jframe. Une boite de dialogue peut tre modale (lutilisateur doit rpondre avant de faire autre chose) ou non.

Interface Graphique: Boite de dialogue


Classe JOptionPane : JOptionPane composant lger et classe fille de Jcomponent. JOptionPane permet davoir les cas les plus frquents de boites de dialogue. La classe Jdialog (composant lourd) traite les non prvus par JOptionPane. Mthodes : showMessageDialog : Message d'information avec bouton OK

Objectif : Cration de lobjet boite de dialogue Affichage dune boite de dialogue Gestion du dialogue avec lutilisateur Transfert et rcupration dinformation
Swing 129

showConfirmDialog : Demande de confirmation avec boutons Oui, Non et Cancel showInputDialog : Saisie d'une information sous forme de texte, de choix dans une liste ou dans une combobox showOptionDialog : Fentres plus complexes car on peut pas configurer les composants
Swing 130

Interface Graphique: Boite de dialogue


Les 4 mthodes de JOptionPane sont surcharges. Chaque type de boite de dialogue a un aspect diffrent donn par : Icne place en haut gauche de la fentre Des boutons placs en bas de la fentre showMessageDialog nous permet de choisir : le contenu du message le titre de la bote,

Interface Graphique: Boite de dialogue


showMessageDialog : Exemple 1

le type dicne, parmi la liste suivante :

Swing

131

Swing

132

Interface Graphique: Boite de dialogue


showMessageDialog : Exemple 2

Interface Graphique: Boite de dialogue


showMessageDialog : Exemple 3

Swing

133

Swing

134

showMessageDialog : Exemple 4

Swing

135

Swing

136

Interface Graphique: Boite de dialogue


showConfirmDialog : Une bote de confirmation offre l'utilisateur un choix de type oui/non. Une bote de confirmation est construite l'aide de la mthode de classe showConfirmDialog de la classe JOptionPane.

Exemple:

Swing

137

Swing

138

Interface Graphique: showConfirmDialog

Interface Graphique: showConfirmDialog


Il existe une autre variante de la mthode showConrmDialog qui permet en outre de choisir le titre de la bote, ainsi que la nature des boutons :

Exemple :

Swing

139

Swing

140

Interface Graphique: showConfirmDialog

Swing

141

Swing

142

Interface Graphique: Boite de dialogue


showInputDialog: La bote de saisie permet lutilisateur de fournir une information sous la forme dune chane de caractres. La mthode showInputDialog de la classe JOptionPane vous permet de grer automatiquement le dialogue avec lutilisateur. Exemple 1 :

Interface Graphique: Boite de dialogue

Swing

143

Swing

144

Interface Graphique: showInputDialog Exemple 2 :

Interface Graphique: showInputDialog Exemple 2 :

Swing

145

Swing

146

Interface Graphique: Boite de dialogue


showOptionDialog : permettant un choix dune valeur parmi une liste, par lintermdiaire dune bote combo. Exemple 1 :

Swing

147

Swing

148

Interface Graphique: showOptionDialog : Exemple 2

Interface Graphique: showOptionDialog

Recherche : 1- Les botes de dialogue personnalises : Jdialog Expos + rapport pour chaque groupe form de 5 tudiants 2- environnement de dveloppement intgr :Jbuilder 3- graphiques: JCanvas /convas

Swing

149

Swing

150