
Ici nous sommes dans la section Interface utilisateur. On va apprendre à créer des éléments pour rendre dynamique les programmes. Sachez que cette partie est très importante car pour rendre agréable l'utilisation de votre programme, il faut avant tout créer une belle interface.
Pour créer un élément, il faut aller dans la boite à outils à gauche dans l'IDE (Integrated Development Environment). Sélectionnez le composant à ajouter au formulaire (bouton, label...) puis positionnez le dans le formulaire.
La console est une fenêtre du type DOS. C'est assez archaïque comme interface mais c'est la définition de la console. Dans une console on peut afficher uniquement du texte.
Pour créer une application console, aller dans Fichier puis Nouveau Projet suivit Application Console.
'Exemple de lignes de code utilisant la console
Dim LigneTapee As String = Console.In.ReadLine() 'permet de lire du texte
Console.ReadLine() 'marche aussi
Console.Out.WriteLine("Ligne à afficher") 'pour afficher du texte
Console.WriteLine 'est aussi accepté
'Petit programme en application console
Console.Out.Write("Tapez une ligne : ")
Dim LigneTapee As String = Console.In.ReadLine()
Console.Out.WriteLine("Je viens de taper : " & LigneTapee)
Les Forms sont des formulaires Windows. En programmation, on les appelle des Windows Form. VB.NET génère automatiquement une Form lors de la création d'un projet. Pour créer une nouvelle Form, cliquez sur Ajouter un formulaire dans le menu Projet. Comme chaque contrôle, les Forms possèdent des propriétés (cf tableau).Pour afficher la boîte de propriétés, cliquez sur le contrôle puis appuyez sur F4.
Tableau des propriétés d'une Form :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| BackGroundImage | L’image en arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| FormBorderStyle | Comportement de la form (bordure et barre de titre) |
| Text | Le titre de la form |
| AllowDrop | Indique si on autorise le glisser / coller |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Enabled | Indique si le contrôle est activé ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| WindowsState | L’état de la form au démarrage (minimize…) |
| AcceptButton | Le bouton d’acceptation du formulaire |
| CancelButton | Le bouton d’annulation du formulaire |
| ControlBox | Indique si le menu système est activée ou pas |
| HelpButton | Indique si le bouton d’aide est activé ou pas |
| Icon | Définit l’icône du contrôle |
| MainMenuStrip | Définit le menu principal du formulaire |
| MaximizeBox | Indique si le bouton d’agrandissement est activé |
| ShowIcon | Indique si l’icône est visible |
| ShowInTaskBar | Indique si le formulaire est visible dans la TaskBar |
| TopMost | Indique si le formulaire est au premier plan |
Bien sûr il existe d'autres fonctions...
Le bouton est le composant le plus important puisque c'est grâce à lui que l'utilisateur pourra interagir avec le programme. Un bouton permet essentiellement de valider ou d'annuler une fonction.
Tableau des propriétés d'un bouton :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| BackGroundImage | L’image en arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| FlatStyle | Le style du bouton |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| Text | Le texte du bouton |
| TextAlign | L’alignement du texte du bouton |
| AllowDrop | Indique si on autorise le glisser / coller |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Enabled | Indique si le contrôle est activé ou pas |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| AutoSize | Définit si le contrôle est dimensionné automatiquement |
Un label est un élément permettant d'informer l'utilisateur d'une chose. Par exemple, pour indiquer à l'utilisateur d'entrer son nom dans une TextBox, on utilise un 'Label'. Ils renseignent donc sur l'utilisation du programme. Un label ne peut pas être modifié par l'utilisateur.
Tableau des propriétés d'un Label :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| Image | L’image affichée sur le label |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| FlatStyle | Le style du bouton |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| Text | Le texte du bouton |
| TextAlign | L’alignement du texte du bouton |
| AllowDrop | Indique si on autorise le glisser / coller |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Enabled | Indique si le contrôle est activé ou pas |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| AutoSize | Définit si le contrôle est dimensionné automatiquement |
Les TextBox sont des emplacements pour accueillir du texte (d'où le nom de TextBox). Elles sont très utiles pour récupérer du texte. Par exemple dans MSN vous entrez vôtre login et vôtre mot de passe dans des TextBox prévues à cet effet. Une TextBox peut donc être modifiée par l'utilisateur.
Tableau des propriétés d'une TextBox :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| Text | Le texte initial visible dans la TextBox |
| TextAlign | L’alignement du texte |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Enabled | Indique si le contrôle est activé ou pas |
| MaxLength | Indique le nombre maximal de caractères dans la TextBox |
| Multiline | Indique si la TextBox est multi ligne ou pas |
| PasswordChar | Caractère à afficher pour la saisie du mot de passe |
| ReadOnly | Indique si la TextBox est en lecture seule |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| AllowDrop | Indique si on autorise le glisser / coller |
Les CheckBox sont des cases à cocher. Elles permettent de savoir si l'utilisateur veut ou pas activer la fonction. Il est possible aussi d'utiliser des CheckBox avec 3 états d'activation. (cf Tableau)
Tableau des propriétés d'une CheckBox :
| Propriété | Description |
|---|---|
| Appearance | Indique l’apparence du contrôle |
| BackColor | Définit l’arrière plan du contrôle |
| BackGroundImage | L’image en arrière plan du contrôle |
| CheckAlign | Emplacement de la case à cocher |
| Checked | Indique si la case est cochée |
| CheckState | Indique l’état de la case à cocher |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| FlatStyle | Le style du bouton |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| Text | Le texte de la CheckBox |
| TextAlign | L’alignement du texte |
| AllowDrop | Indique si on autorise le glisser / coller |
| AutoCheck | Indique si la case se coche automatiquement |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Enabled | Indique si le contrôle est activé ou pas |
| ThreeState | Indique si la case à 3 états d’activation |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
Les RadioButton sont identiques aux CheckBox. Cependant il ne peut y avoir qu'un seul RadioButton activé contrairement aux CheckBox où il peut y avoir autant de cases cochées que de CheckBox. Les propriétés sont identiques aux CheckBox. La seule différence est que les propriétés 'CheckState' et 'ThreeState' n'existent pas.
Les ComboBox sont des menus déroulants. Elles permettent de choisir une option parmi plusieurs. Exemple : Quelle est ta couleur préférée ? On utilisera une ComboBox pour afficher les réponses possibles (Rouge, Bleu, Vert, Noir.)
Tableau des propriétés d'une ComboBox :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| DropDownStyle | Apparence de la zone du menu déroulant |
| FlatStyle | Le style de la ComboBox |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| Text | Le texte de la ComboBox |
| AllowDrop | Indique si on autorise le glisser / coller |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| DrawMode | Indique si le code gère le dessin des éléments de la liste |
| Enabled | Indique si le contrôle est activé ou pas |
| Sorted | Indique comment sont triés les éléments de la liste |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| Items | Permet d’ajouter les éléments dans la liste déroulante |
| Tag | Données définies par l’utilisateur associées à l’objet |
Il existe trois types de liste : les ListBox, les ListView et les TreeView.



Tableau des propriétés d'une ListBox :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| AllowDrop | Indique si on autorise le glisser / coller |
| DrawMode | Indique si le code gère le dessin des éléments de la liste |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| MultiColumn | Indique comment doivent être affichées les données |
| Sorted | Indique comment sont triés les éléments de la liste |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| Items | Permet d’ajouter les éléments dans la ListBox |
| Tag | Données définies par l’utilisateur associées à l’objet |
| Enabled | Indique si le contrôle est activé ou pas |
Tableau des propriétés d'une ListView :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| BackGroundImage | L’image en arrière plan du contrôle |
| BorderStyle | Indique le style de la bordure de la ListView |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| CheckBoxes | Indique si des CheckBox sont visibles à coté des éléments |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| FullRowSelect | Indique si toute la ligne est sélectionnée |
| GridLines | Affiche un quadrillage autour des éléments en mode détails |
| View | Définit la vue dans laquelle les éléments seront affichés |
| AllowDrop | Indique si on autorise le glisser / coller |
| Columns | Gère les colonnes de la ListView |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Items | Gère les éléments de la ListView |
| Sorting | Indique comment sont triés les éléments de la liste |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| Tag | Données définies par l’utilisateur associées à l’objet |
| Enabled | Indique si le contrôle est activé ou pas |
Tableau des propriétés d'une TreeView :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| BorderStyle | Indique le style de la bordure de la TreeView |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| CheckBoxes | Indique si des CheckBox sont visibles à coté des éléments |
| Font | La font (police) utilisée dans le contrôle |
| ForeColor | La couleur du premier plan pour le texte |
| AllowDrop | Indique si on autorise le glisser / coller |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| DrawMode | Indique si le code gère le dessin des éléments de la liste |
| FullRowSelect | Indique si la surbrillance s’étend sur la largeur du TreeView |
| Nodes | Gère l’ensemble des nœuds du contrôle TreeView |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| Tag | Données définies par l’utilisateur associées à l’objet |
| Enabled | Indique si le contrôle est activé ou pas |
Les PictureBox permettent d'afficher des images et de les redimensionner.
Tableau des propriétés d'une PictureBox :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| BackGroundImage | L’image en arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| Image | L’image a affichée dans la PictureBox |
| ErrorImage | Icone à afficher lorsque le chargement d’une image échoue |
| InitialImage | Image à afficher pendant le chargement d’une autre image |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Enabled | Indique si le contrôle est activé ou pas |
| SizeMode | Manière dont l’image va être redimensionnée |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
Les ProgressBar permettent de suivre l'évolution d'une application. Windows utilise de nombreuses ProgressBar (lors de la recherche d'un fichier par exemple). Pour faire marcher une ProgressBar, il faut spécifier une valeur pour la propriété Minimal et une autre valeur pour la propriété Maximal. Si vous souhaitez représenter un pourcentage d'avancement d'une opération, mettez 0 pour Minimum et 100 pour Maximum.
Tableau des propriétés d'une ProgressBar :
| Propriété | Description |
|---|---|
| BackColor | Définit l’arrière plan du contrôle |
| Cursor | Permet de changer le curseur lors du passage de la souris |
| ForeColor | La couleur du premier plan pour le texte |
| Maximum | Limite supérieure de la plage que la ProgressBar utilise |
| Minimum | Limite inférieure de la plage que la ProgressBar utilise |
| Style | Définit le style de la ProgressBar |
| Value | Valeur actuelle pour la ProgressBar |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| Tag | Données définies par l’utilisateur associées à l’objet |
| Enabled | Indique si le contrôle est activé ou pas |
Le TabControl est un outil très important et surtout bien pratique. En effet, il permet de mettre beaucoup de choses dans peu d'espace puisqu'il gère cela en onglets. Dans un TabControl, il y a des TabPages. Vous pouvez définir autant de TabPages que vous le souhaitez.
Tableau des propriétés d'un TabControl :
| Propriété | Description |
|---|---|
| Cursor | Permet de changer le curseur lors du passage de la souris |
| Font | La font (police) utilisée dans le contrôle |
| ImageList | Objet qui permet de contenir des images pour les onglets |
| AllowDrop | Indique si on autorise le glisser / coller |
| DrawMode | Indique si l’utilisateur ou le système peint les légendes |
| HotTrack | Indique si l’aspect des onglets change lors du survol de la souris |
| ContextMenuStrip | Associe un menu contextuel au contrôle |
| MultiLine | Indique si plusieurs lignes d’onglets sont autorisées |
| SizeMode | Indique la façon dont les onglets sont redimentionnés |
| TabPages | La liste des TabPages contenus dans le TabControl |
| Visible | Indique si le contrôle est visible ou pas |
| Name | Le nom du contrôle utilisé dans le codage |
| Size | La taille du contrôle en pixels |
| Tag | Données définies par l’utilisateur associées à l’objet |
| Enabled | Indique si le contrôle est activé ou pas |
Les boîtes de dialogue sont des fenêtres utilisées par Windows pour exécuter une fonction précise. Il existe en gros cinq boîtes de dialogue avec chacune un rôle spécifique :
Le plus intéressant bien sûr est de récupérer dans le code la sélection de l'utilisateur. Cela est très simple :
'Exemples avec les boîtes de dialogues Dim Selection As String Dim Couleur As Color Dim MonFont As Font FolderBrowserDialog.ShowDialog() Selection = FolderBrowserDialog.SelectedPath 'récupère le chemin du dossier OpenFileDialog.ShowDialog() Selection = OpenFileDialog.FileName 'récupère le nom et le chemin du fichier ColorDialog.ShowDialog() Couleur = ColorDialog.Color 'récupère la couleur sélectionnée FontDialog.ShowDialog() MonFont = FontDialog.Font 'récupère le font (police, taille et style)
Fin de la leçon... Ouf ! Désormais les contrôles n'ont plus aucun secret pout vous ^^ Bref, après avoir créer son programme, il faut penser à le déboguer puis ensuite créer un logiciel d'installation (setup).