1 / 63

Interfaces graphiques

Interfaces graphiques. Hervé Frezza-Buet. Préambule. Au commencement étaient les langages de commande mv /poche/kleenex Poubelle/ Ecran : interface textuelle Apparition d’écrans Bitmap Nouvelles interfaces utilisateur. Préambule. Xerox (Xerox Parc de Palo Alto) Concept de fenêtre+souris

connor
Download Presentation

Interfaces graphiques

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Interfaces graphiques Hervé Frezza-Buet

  2. Préambule • Au commencement étaient les langages de commande • mv /poche/kleenex Poubelle/ • Ecran : interface textuelle • Apparition d’écrans Bitmap • Nouvelles interfaces utilisateur

  3. Préambule • Xerox (Xerox Parc de Palo Alto) • Concept de fenêtre+souris • Application commerciale • Apple Macintosh • … puis Microsoft Windows. • Sun et Apollo (monde Unix), systèmes propriétaires. • Monde Unix : X Windows (1987) (MIT + IBM + DEC + …)

  4. Application Préambule • Applications graphiques asynchrones avec l’utilisateur Les interfaces textuelles sont synchrones Utilisateur > 2 + 3 5 > 2 + a Segmentation fault

  5. Application Dessin événement Click Dessin Bouge souris événement Préambule • Applications graphiques asynchrones avec l’utilisateur Utilisateur ok

  6. Préambule • Applications graphiques asynchrones avec l’utilisateur • Autres exemples • Simulateurs • Jeux vidéo • ...

  7. Préambule • Quelques précisions • Le système gère la carte graphique • Le système gère des fenêtres

  8. Préambule • Quelques précisions • … pourtant, c’est ce que font • Mac OS • Windows

  9. Préambule • Quelques précisions • Cas d’Unix (et Linux) : • La gestion des fenêtre est un processus comme un autre (qui prend la carte graphique) • Les différentes composantes sont bien isolées • Présentation de X Windows • Les autres s’en déduisent • Dans tous les cas, fouiller la doc… … avec les concepts de ce cours en tête !

  10. Plan • Concepts des systèmes de fenêtre • ex : Serveurs X Windows d’Unix ou XWin32 de Windows • Surcouches de développement : Les Widgets. • Programmation

  11. > ls toto titi tutu > cp toto tata > rm titi Concepts : X Windows • Architecture client-server Cas « classique » : Utilisateur au niveau du client, application au niveau du serveur. Appli

  12. > ls toto titi tutu > cp toto tata > rm titi > ls toto titi tutu > cp toto tata > rm titi > ls toto titi tutu > cp toto tata > rm titi > ls toto titi tutu > cp toto tata > rm titi Concepts : X Windows • Architecture client-server Cas « classique » : Utilisateur au niveau du client, application au niveau du serveur.

  13. Concepts : X Windows • Architecture client-server Cas X Windows : Les applications sont clientes des serveurs de fenêtres (les fenêtres sont sur le poste de l’utilisateur…) Appli X

  14. X X X X Concepts : X Windows • Architecture client-server Cas X Windows : Les applications sont clientes des serveurs de fenêtres

  15. Concepts : X Windows • Architecture client-server • Portabilité • Terminaux X : exploitation du réseau • Séparation entre système de fenêtre et système d’exploitation.

  16. Concepts : X Windows • Architecture client-serveur : Exemple d’application X Vous : Programmeur Client de X Utilisateur : Kasparov (même pas fichu de faire du C) échecs X Grosse machine (calculateur) Machine avec une bonne carte vidéo

  17. Protocole X Windows Xlib Concepts : X Windows • Structure d’une application X • Ouverture d’un canal d’affichage TCP/IP vers le serveur (spécificité X Windows) • Demande au serveur de créer des ressources • Mise en attente d’événements provenant du serveur. Boucle « infinie », durant laquelle on peut aussi créer et détruire des ressources

  18. Les fenêtres et pixmaps • Fenêtres : Structuration hiérarchique de la surface de l'écran en zones rectangulaires  Notion d'arbre de parenté des fenêtres Un arbre par écran !

  19. 2 22 1 2 3 1 21 23 3 21 22 23 31 32 31 32 321 Les fenêtres et pixmaps root 321 Nota : Relation d'ordre entre sœurs root

  20. Les fenêtres et pixmaps Une ancêtre est retirée • États d'une fenêtre On peut quand même dessiner Affichée (map) Décelable Création occultée Retirée (unmap) Visible Indécelable Partiel- lement visible Totale- ment visible

  21. Les fenêtres et pixmaps • Window Manager • Application qui sollicite (XSelectInput) un type d'événement particulier sur Root • Le serveur redirige alors les requêtes de position et dimension vers cette application (unique).

  22. Les fenêtres et pixmaps • Window Manager : Exemple Applications clientes de X réseau tetris réseau Un Window Manager

  23. Les fenêtres et pixmaps • Window Manager : Exemple XCreateSimpleWindow réseau tetris Retirée réseau Un Window Manager

  24. Les fenêtres et pixmaps • Window Manager : Exemple réseau tetris Événement spécifique réseau Un Window Manager

  25. Les fenêtres et pixmaps • Window Manager : Exemple réseau tetris XCreateSimpleWindow réseau Un Window Manager

  26. Les fenêtres et pixmaps • Window Manager : Exemple réseau tetris XReparentWindow réseau Un Window Manager

  27. Les fenêtres et pixmaps • Window Manager : Exemple réseau tetris réseau Un Window Manager

  28. Les fenêtres et pixmaps • Window Manager : Exemple XMapWindow réseau tetris Indécelable réseau Un Window Manager

  29. Les fenêtres et pixmaps • Window Manager : Exemple réseau tetris Événement spécifique réseau Un Window Manager

  30. Les fenêtres et pixmaps • Window Manager : Exemple réseau tetris XMapWindow réseau Un Window Manager

  31. Les fenêtres et pixmaps • Window Manager • Il en existe de nombreux, avec des comportements rigolos… • fvwm, enlightment, afterstep, etc… • Il existe aussi des applications bizarres : • xcafard, xsnow… • Gestion de thèmes

  32. Les fenêtres et pixmaps • Les pixmaps • Il s'agit de ressources (Pixmap) dans lesquelles ont peut dessiner, comme les fenêtre. • Les pixmaps ne s'affichent pas, ne sont pas hiérarchiques. • Type : Pixmap , Window = Drawable

  33. Les fenêtres et pixmaps • Les pixmaps : rôle • Stocker des motifs • texture de fond, • texture de bordure • Stocker un dessin • pour le curseur • … • Dessiner off-screen, puis copier le dessin terminé dans une fenêtre • ...

  34. Les contextes graphiques • Il s'agit d'un ensemble de caractéristiques pour le dessin • Création d'un contexte • Configuration du contexte • Dessin dans ce contexte Display * canal_aff; XGCValues val; unsigned long mask; /* 0 => valeurs par défaut */ GC contexte; contexte = XCreateGC (canal_aff,un_drawable,0,&val); XFreeGC (canal_aff,contexte);

  35. événement sollicités File requête Tampon Client Les événements • Le serveur informe le client d'événements générés par l'utilisateur, ou par d'autres clients. Allocation et configuration X Lecture

  36. Les événements • Boucle de lecture d'événements Display * canal_aff; XEvent evt; int stop; … stop = 0; While (!stop) { if(!XEventsQueued(canal_aff,QueuedAfterReading)) { XFlush(canal_aff); UnPasDeCalculEnTacheDeFond(); } else { XNextEvent(canal_aff,&evt); switch(evt.type) { case ButtonPress : … break; … }} }

  37. Les événements • Fonction de traitement case ButtonPress : cout << "Le bouton " << evt.xbutton.button << " est pressé au point " << evt.xbutton.x << ',' << evt.xbutton.y << endl; break;

  38. Les événements • Fonction de traitement case Expose : if(evt.xexpose.count ==0) { /* on redessine toute la fenêtre */ } break;

  39. Plan • Concepts des systèmes de fenêtre • ex : Serveurs X Windows d’Unix ou XWin32 de Windows • Surcouches de développement : Les Widgets. • Programmation

  40. Les Widgets • Système graphique (Xlib, SDK) puissant, mais programmation laborieuse. • Boîtes à outil • boutons • menus • … … en appelant quelques fonctions simples.

  41. Les Widgets • Boîtes à outil  tous les objets graphiques sont assortis • Portabilité… parfois • Ex : Gtk+ existe sous X Windows et Windows.

  42. Xlib Applications Les Widgets Protocole X Windows #include <X11/Xlib.h> Toolkits #include <gtk/gtk.h>

  43. Les Widgets • Widgets (terme X) = objets graphiques, organisés de façon hiérarchique. • Quelques boîtes • Gtk+ : librairie C, X Windows et Windows • Xt, Motif : librairie C, X Windows • Swing : objets Java, portable... • MFC, Forms : librairie C++, Windows • C'est toujours le même principe...

  44. Les Widgets • Les widgets sont des classes génériques, correspondant aux fenêtres. • On définit des callbacks, fonctions appelées quand quelque chose se produit • Ex : Le widget Bouton appelle un callback "press" quand on clique dessus.

  45. Les Widgets • La librairie se charge de masquer la boucle d'événements, le programmeur ne programme que des callbacks • En C++ et Java, MonBouton hérite de Bouton, et je surcharge la méthode Activate de la classe Bouton • En C, il y a une fonction du genre AddCallback(button,ma_fonction,…).

  46. Les Widgets • Structure d'un programme • Création des widgets • Définition des callbacks • Lancement de la boucle (parfois implicite)

  47. Les Widgets • Types de Widgets : Boutons • Buttons • Radio Buttons • Check Buttons • Drawn Buttons • …

  48. Les Widgets • Types de Widgets : Dialogues • Fenêtres filles de root • File selector • Warning message • Window • ...

  49. Les Widgets • Types de Widgets : Containers • Widgets qui ont des fils, dont ils assurent la disposition à l'écran • Paned • Frames titre

More Related