Programmation interfaces graphiques

Programmation d’Interfaces Graphiques
IV – Programmation événementielle & ‘Widgets’ de base
Stéphane HUOT Dpt. Informatique
DUT Informatique – S2 – 2010-2011

[PIG]
Cours IV
Prog. Evt

Introduction
I didn’t do it
• Programmation événementielle • Événements/Contrôles de base • Syntaxe VB

2

[PIG]
Cours IV
Prog. Evt

Application Interactive
externes:
• dispositifs d’entréeutilisateur (souris, clavier, tablette, …) • capteurs (température, vitesse, …)

3 [PIG]
Cours IV
Prog. Evt

4

Programmation Evénementielle

• Une application interactive (graphique ou non) doit réagir à des événements
o

• Une interface graphique (Graphical User Interface/GUI) est constituée de contrôles (Widgets) avec lesquels l’utilisateur interagît
o

o

en entrée:l’utilisateur effectue une saisie ou actionne un contrôle en sortie: les contrôles présentent des informations à l’utilisateur une action de l’utilisateur sur un contrôle une activité interne

o

internes:
• horloge • changements d’états (variables, ressources, …)

• Un événement est généré par le système suite à
o o

Programmation événementielle

Arrivée aléatoire des événements

[PIG]Cours IV
Prog. Evt

Gestion des événements

5 [PIG]
Cours IV
Prog. Evt

Illustration
Gestionnaire d’événements Réflexes
Reflexe 1

6

• Un événement non géré ne produira aucune action • Le programmeur gère les réactions aux événements
o

Evénements
Evt 1

(de type A)

(pour evts de type A)

o

programme le(s) ‘réflexe(s)’ à un/aux événement(s) un réflexe est déclenchélorsque sont événement se produit: le code correspondant est exécuté

(de type B)

Evt 2

(de type A)

Evt 3

Boucle infinie en attente des événements

(pour evts de type B)

Reflexe 2

[PIG]
Cours IV
Prog. Evt

Éléments de la programmation événementielle

7 [PIG]
Cours IV
Prog. Evt

Syntaxe VB.NET
Contrôle qui a émis l’événement

8

• Les contrôles (ou ‘Widgets’: objetsgraphiques interactifs) • Les événements (signaux système) • Les réflexes ou procédures évenementielles (ou ‘Listeners’)

Par défaut: NomControle_NomEvenement

Private Sub reflexe(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles nomControle.nomEvenement ‘Code de l’action à réaliser End Sub Le ou les événements gérés par ce réflexe L’événement émis

[PIG]
Cours IV
Prog.Evt

Exemple
clic!

9 [PIG]
Cours IV
Prog. Evt

Contrôles

10

• Composants graphique ‘standards’ (widgets) • Containers = contrôles qui en contiennent d’autres: Form (feuille), Panel, GroupBox • Objets (POO)
o

btnHello.Click

Attributs: propriétés position, taille, couleurs, etc. Événements: actions à gérer click, double-click, redimensionnement, etc.

Private SubReflexeHello(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnHello.Click MessageBox.show(“Hello”) End Sub
o o

Méthodes: réflexes/réactions aux événements

[PIG]
Cours IV
Prog. Evt

Quelques propriétés
• Apparence
o o o

11 [PIG]
Cours IV
Prog. Evt

Principe du ‘Focus’
un seul contrôle par fenêtre possède le focus le contrôle avec le focus reçoit les entrées

12• Forme du contrôle
o

Size
• Width; Height

o

Location
• X; Y

Cursor Backcolor Forecolor Name Enabled Visible

• Focus = contrôle actuellement actif (sélectionné)
o o

• Texte
o o o

• Identité/Activité
o o o

TextAlign Font Text

• Tous les contrôles actifs (enabled) peuvent recevoir le focus à tour de rôle
o

touche ‘Tab’ et propriété ‘TabIndex’

• Événements‘Enter’ et ‘Leave’

[PIG]
Cours IV
Prog. Evt

Les événements

13 [PIG]
Cours IV
Prog. Evt

Événements de ‘form’

14

• Un même contrôle peut déclencher plusieurs types d’événements • Ils peuvent être déclenchés depuis le code • Un même réflexe peut gérer plusieurs événements • Un même événement peut être géré par plusieurs réflexes

• Activated: quand la feuille prend le focus…