ICS4U - Unité 3 - Activité 1 - Introduction à la construction d'interfaces graphiques - Génie informatique

UNITÉ 3 - ACTIVITÉ 1

INTRODUCTION À LA CONSTRUCTION D'INTERFACES GRAPHIQUES

Une interface utilisateur graphique (GUI - Graphical User Interface) est une fenêtre contenant différentes parties graphiques dont des boutons, étiquettes, zones de texte, menus et autres qui permettent à l'utilisateur d'effectuer différentes opérations sans avoir à connaître les commandes codées pour effectuer ces opérations. Dans les interfaces utilisateur graphiques, les différents symboles graphiques reliés à des fonctions peuvent être activés à l'aide de la souris.

La technologie à interface utilisateur graphique ainsi que la souris a été conçue par la compagnie Xerox. En 1981, la compagnie Xerox développe le Star 8010, premier ordinateur à interfaces utilisateur graphiques accompagné d'une souris. Par la suite, en 1983, la compagnie Apple développe son premier ordinateur à interfaces utilisateur graphiques accompagné d'une souris, le Lisa.

Aujourd'hui le plus populaire des GUI est certainement le tout nouveau système d'exploitation Microsoft Windows 10.

1 - Le logiciel utilisé

Il existe plusieurs logiciels permettant de construire des programmes à interfaces graphiques utilisant le langage de programmation C#. Le logiciel utilisé pour ce cours est Microsoft Visual Studio Community offert gratuitement à partir du site https://www.visualstudio.com/fr/vs/visual-studio-express/.

2 - Convention des codes

Puisqu'un programme C# à interfaces utilisateur graphiques peut contenir une multitude d'objets, il est important que chaque objet ait un nom très descriptif. C'est pourquoi, il est recommandé de débuter le nom de chaque objet par trois caractères spécifiques correspondant au type de contrôle de cet objet.

Le tableau ci-dessous énumère les trois caractères devant servir de préfixe au nom de chaque objet selon le contrôle que l'objet représente.

Préfixe	Type de contrôle	Exemple
`lbl`	`Étiquette (label)`	`lblNom`
`txt`	`Zone de texte (text box)`	`txtPrenom`
`cmd`	`Bouton de commande (command button)`	`cmdOK`
`shp`	`Forme géométrique (shape)`	`shpTriangle`
`lin`	`Ligne (line)`	`linHaut`
`frm`	`Feuille de travail (form)`	`frmPrincipale`
`fra`	`Cadre (frame)`	`fraCentre`
`img`	`Image (image)`	`imgLogoEquipe1`
`pic`	`Zone d'image (picture box)`	`picEleve1`
`tmr`	`Minuterie (timer)`	`tmrPenaliteVisiteur`
`lst`	`zone de liste (list box)`	`lstEtudiants`
`opt`	`Bouton d'option (option box)`	`optOuiNon`
`chk`	`Case à cocher (check box)`	`chkLoto649_1`
`cbo`	`Zone de liste modifiable (combo box)`	`cboLogiciels`
`drv`	`Liste de lecteurs(drive list)`	`drvDisponible`
`dir`	`Liste de répertoires (directory list)`	`dirC`
`fil`	`Liste de fichiers (file list)`	`fil_C_java`
`vsb`	`Barre de défilement vertical (vertical scroll bar)`	`vsbDroite`
`hsb`	`Barre de défilement horizontal (horizontal scroll bar)`	`hsbBas`
`dat`	`Accès aux données (data object)`	`datBase1`
`prg`	`Barre de progression (progress bar)`	`prgTelechargement`
`mme`	`Multimédia (multimedia)`	`mmeVideo1`
`tlb`	`Barre d'outils (tool bar)`	`tlbProprietes`
`ani`	`Animation (animation)`	`aniBouton1`
`mnu`	`Barre de menus (menu bar)`	`mnuFichier`

4 - Premier programme à interfaces utilisateur graphiques C#

Comme le veut la tradition lors du début de l'apprentissage d'un nouveau langage de programmation, le premier programme va permettre d'afficher le texte Bonjour le monde! et en modifier sa taille en cliquant sur des boutons.