Programmation événementielle et composants dinterface (« widgets »)

  • View
    103

  • Download
    0

Embed Size (px)

Transcript

  • Page 1
  • Programmation vnementielle et composants dinterface ( widgets )
  • Page 2
  • Logiciel traditionnel, sans interface utilisateur { Lire les entres dun fichier Effectuer des calculs crire les sorties dans un fichier }
  • Page 3
  • avec interface utilisateur minimale { Lire les entres du clavier Effectuer des calculs crire les sorties sur lcran }
  • Page 4
  • dans une boucle Rpter { Afficher linvite de commandes Lire la commande Excuter la commande crire les sorties sur lcran }
  • Page 5
  • Logiciel vnementiel ( event-driven program) Rpter { Attendre un vnement Traiter lvnement }
  • Page 6
  • Logiciel vnementiel pour une interface graphique Afficher linterface (fentre(s), etc.) Rpter { Attendre un vnement dentre e switch(e.type) { case KEY_PRESS:... case MOUSE_BUTTON:... case MOUSE_MOTION:... } Si ncessaire, mettre jour laffichage } Boucle dvnements
  • Page 7
  • Logiciel traditionnel: Le logiciel a le contrle . Le logiciel peut prendre le temps ncessaire pour traiter les entres. Lutilisateur doit attendre. Les entres sont limites aux chanes de caractres. Logiciel graphique interactif: Lutilisateur doit (avoir limpression de) avoir le contrle . Le logiciel doit traiter chaque vnement assez rapidement pour rpondre en temps rel. Lutilisateur peut gnrer diffrents vnements tout moment.
  • Page 8
  • Structure, ou classe, dvnement Event { unsigned long int timestamp; int type; // KEY_PRESS, MOUSE_... int x, y; int key; boolean flag...... }
  • Page 9
  • Sortes dvnements (1) KEY_DOWN ou _PRESS (touche appuye), KEY_UP ou _RELEASE (touche relche), KEY_TYPED (synonyme pour DOWN + UP) Attributs: temps, caractre ASCII (a, b, c, ), touche de clavier (F1, F2, PageUp, Esc, ), sil sagit dune auto-rptition ou non, coordonnes (x, y) de la souris, tat des touches de modification (Ctrl, Shift, etc.)
  • Page 10
  • Sortes dvnements (2) MOUSE_DOWN ou _PRESS (bouton appuy), MOUSE_UP ou _RELEASE (bouton relch), MOUSE_CLICK (synonyme pour DOWN + UP) MOUSE_DOUBLE_CLICK, MOUSE_MOTION ou _MOVEMENT (mouvement), MOUSE_DRAG (glissement) Attributs: temps, bouton (1-5) (gauche, droit, milieu, ), coordonnes (x, y), tat de tous les boutons (utile pour les combinaisons), tat des touches de modification (Ctrl, Shift, etc.) Taux dchantillonnage de la position dpend habituellement de la charge CPU
  • Page 11
  • Autres sortes dvnements?
  • Page 12
  • Page 13
  • Sortes dvnements (3) RESIZE (redimensionnement), MAXIMIZE, MINIMIZE Attributs: temps, nouvelles dimensions (width, height) WINDOW_CLOSE Permet au logiciel de sauvegarder ses donnes, faire le mnage, etc.
  • Page 14
  • Autres sortes dvnements?
  • Page 15
  • Sortes dvnements (4) MOUSE_ENTER (souris entre dans la fentre), MOUSE_LEAVE ou _EXIT (souris sort de la fentre) Attributs: semblable ceux des autres vnements de souris REDRAW ou EXPOSE ou PAINT (demande de redessiner) Peut tre gnr par un redimensionnement, un mouvement dune autre fentre, ou par une demande du client mme Attributs: rectangle(s) redessiner (x, y, width, height), c.--d. les rectangles endommags ( damaged )
  • Page 16
  • Rectangles endommags
  • Page 17
  • Boucle dvnements en C avec Xlib (UNIX/X11) XEvent event; ouvrir une fentre while (!quit) { XNextEvent(..., &event); // attend le prochain vnement switch (event.type) { case Expose:... // redessiner case ConfigureNotify:... // redimensionnement case ButtonPress:... // bouton de souris case ButtonRelease:... // bouton de souris case MotionNotify:... // mouvement de souris case KeyPress: // touche de clavier switch (XLookupKeysym(&event.xkey,...)) { case XK_F1:... // afficher de laide case XK_Escape: quit=true; break; } break; }
  • Page 18
  • Boucle dvnements Xlib comment travailler en mme temps while (!quit) { while (0 == XEventsQueued(...)) { // Peut avancer une animation, simulation, des calculs, etc. faireUnPeuDeTravail(); usleep(100000); // dormir une fraction de seconde } XNextEvent(..., &event); switch (event.type) { case... } Optionnel Une autre faon de faire du travaille en mme temps: utiliser des vnements spciaux
  • Page 19
  • Sortes dvnements (5) TIMER ou TIMEOUT (un dlai de temps expir), IDLE (le CPU est libre) Envoys au client sur demande seulement Permettent de faire un peu de travail en attendant dautres vnements Les timeouts peuvent tre envoys de faon priodique (exemple: pour une animation), ou seulement une fois (ex: pour retarder une action)
  • Page 20
  • Exemples dactions retardes Affichage dune infobulleOuverture dun sous-menu
  • Page 21
  • Traitement dvnements en C avec GLUT (OpenGL) void drawHandler() {... // redessiner } void reshapeHandler( int width, int height ) {... // redimensionnement } void mouseHandler( int button,int state,int x,int y ) { // boutons de souris if (button==GLUT_LEFT_BUTTON && state==GLUT_DOWN)... } void passiveMotionHandler( int x, int y ) {... // mouvement de souris } void motionHandler( int x, int y ) {... // glissement de souris } void keyboardHandler( unsigned char key, int x, int y ) {... // touches normales } void specialKeyHandler( int key, int x, int y ) {... // touches spciales } int main(... ) { glutInit... glutCreateWindow( "My Window" ); glutDisplayFunc( drawHandler ); glutReshapeFunc( reshapeHandler ); glutMouseFunc( mouseHandler );... glutMainLoop(); } Ces sous-routines sappellent des event handlers (traiteurs dvnements) ou callbacks O est la boucle dvnements?
  • Page 22
  • Classes dvnements, architecture oriente objets Event KeyEventMouseEvent MouseButtonEventMouseMotionEvent
  • Page 23
  • Les informations dcrivant les vnements peuvent tre encodes dans une structure (exemple: Xlib), une ou plusieurs classes (ex: Java), ou de simples paramtres (ex: GLUT). Ces informations peuvent tre traites par une seule sous-routine, ou par plusieurs sous-routines selon le type dvnement. (Ces sous-routines sappellent event handlers (traiteurs dvnements), ou callbacks , ou sont des mthodes dobjets event listeners (couters dvnements)) La boucle dvnements peut tre situe dans le code du client (ex: Xlib), ou lextrieur (dans une librarie ou framework ; ex: GLUT).
  • Page 24
  • Quelques exemples en Java
  • Page 25
  • Quelques lments des interfaces graphiques
  • Page 26
  • Les fentres
  • Page 27
  • Page 28
  • Curseurs standards de X11 Les curseurs de souris (ou pointeurs)
  • Page 29
  • Curseur de souris, ou pointeur hotspot
  • Page 30
  • Les curseurs de texte ( caret )
  • Page 31
  • Les widgets
  • Page 32
  • Les boutons
  • Page 33
  • Page 34
  • Page 35
  • Les cases cocher ( checkbox ) Pour des choix binaires et indpendants
  • Page 36
  • Les boutons radio Pour des choix mutuellement exclusifs
  • Page 37
  • Les infobulles ( tooltips )
  • Page 38
  • Page 39
  • Barre de dfilement ou glisseur ( scrollbar ou slider ) Dfileur ( thumb ou slider )
  • Page 40
  • Barre de dfilement contextuelle ( popup slider )
  • Page 41
  • Barre de progrs
  • Page 42
  • Les champs Champs de texte Champs numriques Avec spinner Avec units Avec barre de dfilement
  • Page 43
  • Les menus item ou commande ( menu item )
  • Page 44
  • Barre de menus
  • Page 45
  • Menu droulant ( Pull-down menu )
  • Page 46
  • Menu contextuel ( popup menu ou context-sensitive menu )
  • Page 47
  • Cest quoi la diffrence entre popup et context-sensitive ?
  • Page 48
  • Les menus doptions ( option menus )
  • Page 49
  • Affichage de sous-menus
  • Page 50
  • Les ellipses
  • Page 51
  • Menus dtachs ou menus flottants ( Tear-off menus )
  • Page 52
  • Liste droulante ( Pick list ou Scrolling list )
  • Page 53
  • Menu divis ( Split menu )
  • Page 54
  • Page 55
  • Page 56
  • Les cadres
  • Page 57
  • Les onglets
  • Page 58
  • Page 59
  • Des onglets hirarchiques ?
  • Page 60
  • Les sparateurs
  • Page 61
  • Page 62
  • Page 63
  • Un bouton + menu
  • Page 64
  • Crateur de tables
  • Page 65
  • Les palettes de boutons
  • Page 66
  • Les barres doutils
  • Page 67
  • Des botes de dialogue
  • Page 68
  • 2 sortes de botes de dialogue Modale ( modal ) Oblige lutilisateur de complter son interaction avec la bote avant de retourner la fentre principale Non-modale ( modeless ) Plu