Embed Size (px)
Citation preview
Première partie I
IHM
2/11
Plan - A - IHM
1 Introduction
2 Ingrédients d’une interface
3 Modèle MVC
3/11
Plan → A - IHM
1 Introduction
2 Ingrédients d’une interface
3 Modèle MVC
4/11
A - IHM A.I - Introduction
IHMI comme ????H comme HommeM comme Machine
5/11
A - IHM A.I - Introduction
IHMInterface Homme-Machine vs Interactions Homme-Machine
5/11
Plan → A - IHM
1 Introduction
2 Ingrédients d’une interfaceÉléments graphiquesProgrammation événementielle
3 Modèle MVC
6/11
A - IHM A.II - Ingrédients d’une interfaceII.1 - Éléments graphiques
Éléments graphiques ou widgetsConteneurs "top niveau" : fenêtres, boîtes de dialogue. . .Conteneurs "secondaires" : panneaux, boites. . ."Simples" composants :
zones d’affichage (texte ou dessins) : labels, canvas. . .interaction avec l’interface : boutons, zones de texte, cases àcocher. . .
Look & FeelGénéralement basé sur celui du gestionnaire de fenêtres sous-jacent
7/11
A - IHM A.II - Ingrédients d’une interfaceII.1 - Éléments graphiques
Structure d’une interfacehiérarchie de composantsà chaque conteneur est associé un algorithme de placement decomposants (en ligne, en grille. . . )
Exemple
Fenêtre principale−→ Panneau
−→ Boîte verticale−→ Label "Bonjour"−→ Label "Soleil"−→ Checkbox "hello"
−→ Boîte horizontale−→ Label "Au revoir"−→ Label "Lune"−→ Checkbox "bye"
8/11
A - IHM A.II - Ingrédients d’une interfaceII.2 - Programmation événementielle
Programme interactifexécution non linéaireexécution non prévisibletemps d’attente
Programmation événementielle
Parfois plusieurs types d’événementsévénement bas-niveau : clic souris, touche clavier. . .événement haut-niveau ou sémantique : action sur un bouton,obtention du focus. . .
9/11
A - IHM A.II - Ingrédients d’une interfaceII.2 - Programmation événementielle
Programme interactifexécution non linéaireexécution non prévisibletemps d’attente
Programmation événementielle2 manières de voir :
Lier des événements à des comportements des composantswidget.bind(event, handler)
Abonner des composants à des écouteurs d’événements
Parfois plusieurs types d’événementsévénement bas-niveau : clic souris, touche clavier. . .événement haut-niveau ou sémantique : action sur un bouton,obtention du focus. . .
9/11
Plan → A - IHM
1 Introduction
2 Ingrédients d’une interface
3 Modèle MVC
10/11
A - IHM A.III - Modèle MVC
Modèle / Vue / Contrôleur
Exemple : montre / chronomètre
11/11
A - IHM A.III - Modèle MVC
Modèle / Vue / Contrôleur
Vue
Exemple : montre / chronomètre
11/11
A - IHM A.III - Modèle MVC
Modèle / Vue / Contrôleur
Contrôleur
Exemple : montre / chronomètre
11/11
A - IHM A.III - Modèle MVC
Modèle / Vue / Contrôleur
Modèle
Exemple : montre / chronomètre� �private int hours ;private int minutes ;private int seconds ;� �
� �private int seconds ;� �
11/11
A - IHM A.III - Modèle MVC
Modèle / Vue / Contrôleur
11/11
