logo Pierre AULAS
Visual Basic 6 - Groupe de contrôles
 Parcours  |   Réalisations  |   Cours  |   Chroniques  |   Divers
Création de l'interface graphique
Définition des propriétés
Ecrire le code du programme

Groupe de contrôles

Cet exercice n'a pas d'application concrète immédiate mais doit vous permettre de maîtriser la notion de groupe de contrôles et d'apprendre à créer des contrôles via Visual Basic.

Cette image vous montre l'aspect de votre application une fois terminée. Vous pouvez également tester son fonctionnement ici.
Trois boutons de commandes sont situés à droite de l'écran (ils forment un groupe de contrôle mais cela l'utilisateur ne le sait pas). Une zone de texte vide est située en haut à gauche du formulaire.
Le bouton + permet à l'utilisateur de créer dynamiquement une nouvelle zone de texte située en dessous de la précédente. Si il appuie de manière répétée sur cette touche, il peut créer au total 8 zones de texte comme le montre la capture ci-dessous:

Le bouton - permet à l'utilisateur de supprimer dynamiquement ces zones de texte.
Le bouton Quitter permet à l'utilisateur de quitter l'application.
Notez que dans la première image le bouton " - " n'est pas disponible (puisqu'il n'y a qu'une zone de texte) et que dans la seconde image c'est le bouton " + " qui n'est pas disponible (puisque le formulaire est rempli de zone de texte, inutile de laisser à l'utilisateur la possibilité d'en ajouter encore).

Les étapes de programmation

Comme toujours, vous essayerez de travailler en trois temps  :

1. Création de l'interface graphique

Cet exercice comprend 3 contrôles boutons de commande.
Exceptionnellement vous allez placer un premier bouton de commande sur le formulaire et définir immédiatement sa propriété Name à cmdBouton, puis le dupliquer en le séléctionnant et en faisant un copier/coller à l'aide des touches ctrl+C, ctrl+V.
Si vous avez correctement effectué cette étape, vous devriez avoir une fenêtre qui s'ouvre et vous annonce:

Il y a déjà un contrôle nommé 'cmdBouton'. Voulez-vous créer un groupe de contrôles?

Vous répondez Oui et vous recommencez afin de disposer de trois contrôles bouton de commande.
En procédant de cette manière, vous venez de créer trois bouton de commande ayant la même propriété Name mais ayant une propriété Index différente.
C'est ce que VB appelle un groupe de contrôles. Pour appeler ces contrôles dans Visual Basic, il faut utiliser la syntaxe destinée aux tableaux:

cmdBouton(0) 'pour le premier bouton de commande du groupe partageant la même propriété Name cmdBouton
cmdBouton(1) 'pour le second bouton
cmdBouton(2) 'pour le troisième bouton, etc.

L'intérêt d'un groupe de contrôle est de pouvoir exécuter une même procédure événementielle pour tous les contrôles du groupe (ce qui par ailleurs permet d'économiser de la ressource) et de faciliter les traitements en boucle.

Dans le cas de vos trois boutons de commande, l'événement Click sera géré par une unique procédure événementielle retournant une valeur Index correspondant au numéro d'index du bouton cliqué:

Private Sub cmdBouton_Click(Index As Integer)
  Select Case Index
  Case 0:
  Case 1:
  Case 2:
    End
  End Select
End Sub

N'oubliez pas à cette étape d'égaliser l'espacement entre les boutons de commande et de les centrer verticalement sur le formulaire.

Il ne vous reste plus qu'à créer une zone de texte (txtBox) en haut à gauche de la fenêtre et vous pourrez passer à l'étape de définition des propriétés.
C'est le moment, si vous le souhaitez, d'aller dans le menu Format > Verrouiller les contrôles.

Haut de page

2. Définition des propriétés

Définissez maintenant les propriétés des 4 contrôles présents sur votre formulaire:

Objet  Propriété  Valeur
Form1  Name  frm01
 Caption  Exercice - Groupe de contrôles
Command1  Name  cmdBouton
 Caption  (vide)
 Index  0
 Enabled  True
 Style  1 - Graphical
 Picture  imgPlus.ico
 ToolTipText Ajouter
Command1  Name  cmdBouton
 Caption  (vide)
 Index  1
 Enabled  False
 Style  1 - Graphical
 Picture  imgMoins.ico
 ToolTipText Retirer
Command1  Name  cmdBouton
 Caption  &Quitter
 Index  2
 Cancel  True
Text1  Name  txtAffichage
 Index  0
 Text  (vide)
 Locked  True

Les boutons de commande plus et moins utilisent les images suivantes (faites un clic droit Enregistrer l'image sous pour les récupérer):

La propriété Enabled permet de rendre ou non un bouton de commande disponible pour l'utilisateur. Dans le cas de notre application, il est inutile de permettre à l'utilisateur de cliquer sur le bouton " - " tant qu'il n'y a qu'une seule zone de texte. C'est pourquoi cette propriété est définie à False au démarrage de l'application.
Nous verrons dans la partie programmation comment manipuler cette propriété via le code.

La propriété Locked de texte est définie à True afin d'interdire à l'utilisateur d'entrer du texte.

Si vous lancez l'exécution de votre projet (touche F5 ou menu Exécution > Exécuter) maintenant, votre formulaire, devrait ressembler à cela  :

Pour l'instant il ne réagit pas aux sollications de l'utilisateur. Passons maintenant à la partie programmation.

Haut de page

3. Ecrire le code du programme

Pour ouvrir la fenêtre de code VB, double-cliquez sur un des trois boutons de commande situés à droite. VB écrit automatiquement pour vous la procédure événementielle suivante  :

Private Sub cmdBouton_Click (Index As Integer)

End Sub

Vous remarquez que VB fournit automatiquement à votre procédure un argument Index. Celui-ci retourne le numéro d'index du contrôle qui a été cliqué.
Ainsi Index vaut 0 si l'utilisateur a cliqué sur le bouton " + ", 1 si il a cliqué sur le bouton " - " et 2 si il a cliqué sur Quitter.

Il ne vous reste plus qu'à faire un If ... then ... Elseif ... then ... End If pour tester les différents cas de figure.

Selon les cas il va vous falloir rajouter une zone de texte ou en supprimer une. Tout ce dont vous avez besoin est indiqué ci-dessous.

Des contrôles peuvent être ajoutés à un groupe de contrôles lors de l'exécution par la syntaxe suivante  :

Load Objet(Index)

Objet désigne le nom de l'objet à ajouter au groupe de contrôles. L'argument Index contient son numéro d'index.
Pour éliminer un élément d'un groupe de contrôles, vous utilisez l'instruction suivante  :

Unload Objet(Index)

Cette instruction ne permet de supprimer que les contrôles ajoutés à l'aide de l'instruction Load.

Essayez de trouver par vous même l'algorithme à mettre en oeuvre (commencez par travailler sur une feuille de papier). Si cela vous paraît trop difficile, voici un algorithme possible (ce n'est pas le seul).
Il ne vous reste plus qu'à le traduire en Visual Basic.

Au démarrage de mon application
  je déclare monIndex comme un entier
  monIndex vaut 0

Lorsque je clique sur un bouton des boutons de commande du groupe
Si je clique sur Plus alors
  j'incrémente monIndex de 1
  je créé une zone de texte d'index monIndex
  je place cette zone de texte 500 twips plus bas que la précédente
  je rends visible cette zone de texte
Mais si je clique sur Moins alors
  je supprime la zone de texte d'index monIndex
  je décrémente monIndex de 1
Sinon (c'est que j'ai cliqué sur Quitter)
  Je quitte l'application

En l'état l'algorithme est un peu léger puisqu'il ne limite pas le nombre d'ajouts ou de suppressions. Mais il suffit pour démarrer.

Ne lisez la suite que si vous ne parvenez pas à réaliser vous même l'exercice.

Haut de page

Côté VB cela nous donne quelque chose du genre  :

Option Explicit
Dim mintIndexTexte As Integer

Private Sub Form_Load()
  mintIndexTexte = 0
End Sub

Private Sub cmdBouton_Click(Index As Integer)
If Index = 0 Then
  mintIndexTexte = mintIndexTexte + 1
  Load txtAffichage(mintIndexTexte)
  txtAffichage(mintIndexTexte).Top = txtAffichage(mintIndexTexte - 1).Top + 500
  txtAffichage(mintIndexTexte).Visible = True
ElseIf Index = 1 Then
  Unload txtAffichage(mintIndexTexte)
  mintIndexTexte = mintIndexTexte - 1
Else
  End
End If
End Sub


Pour éviter le dépassement, il convient lorsqu'on ajoute, de vérifier si mintIndexTexte ne dépasse par 7 et, lorsqu'on diminue, de vérifier que mintIndexTexte n'est pas nul (ou strictment inférieur à 1).

Dans la correction ci-dessous on joue avec la propriété Enabled des boutons " + " et " - ".

Au départ " - " n'est pas disponible. Mais dès qu'il y a un ajout il le devient (soit cmdBouton(1).Enabled = True).
Si mintIndexTexte dépasse 7, je rends le bouton " + " indisponible (soit cmdBouton(0).Enabled = False).
Au contraire, dès que je supprime une zone de texte, je rends le bouton " + " disponible.
Et si mintIndexTexte est inférieur à 1, je rends le bouton " - " indisponible.

Au total vous obtenez le code suivant  :

Option Explicit
Dim mintIndexTexte As Integer 'Déclarée ici, ma variable a une portée module

Private Sub Form_Load()
'Au démarrage de l'application, la variable qui va servir à définir l'index _
de la dernière zone de texte ouverte est initialisé à 0

  mintIndexTexte = 0
End Sub

Private Sub cmdBouton_Click(Index As Integer)
'Si l'utilisateur a appuyé sur le bouton " + " alors
If Index = 0 Then
  'J'incrémente ma variable de 1
  mintIndexTexte = mintIndexTexte + 1
  'Je créé une nouvelle zone de texte groupée à txtAffichage
  Load txtAffichage(mintIndexTexte)
  cmdBouton(1).Enabled = True 'Le bouton " - " est maintenant disponible _
  puisque qu'il y a désormais au moins deux zones de texte
  'Si il y a 8 zones de texte (l'index va de 0 à 7)

  If mintIndexTexte >= 7 Then
    cmdBouton(0).Enabled = False 'Je désactive le bouton " + "
  End If
  'Je place la nouvelle zone de texte 500 twips plus bas que la précédente ...
  txtAffichage(mintIndexTexte).Top = txtAffichage(mintIndexTexte - 1).Top + 500
  '... et je la rends visible
  txtAffichage(mintIndexTexte).Visible = True
'mais si l'utilisateur a appuyé sur le bouton " - " alors
ElseIf Index = 1 Then
  'Je supprime la dernière zone de texte groupée
  Unload txtAffichage(mintIndexTexte)
  'Je décrémente ma variable de 1
  mintIndexTexte = mintIndexTexte - 1
  'Le bouton " + " est maintenant disponible puisqu'il est désormais possible _
  de créer au moins une nouvelle zone de texte

  cmdBouton(0).Enabled = True
  'Si il n'y a plus qu'une zone de texte
  If mintIndexTexte < 1 Then
    cmdBouton(1).Enabled = False 'Je désactive le bouton " - "
    cmdBouton(0).SetFocus 'Et je passe le focus au bouton +
  End If
'Sinon c'est qu'il a appuyé sur le bouton "Quitter"
Else
  End 'Fermer l'application
End If
End Sub

Pour finir, nous allons créer deux procédures événementielles liées aux zones de texte.
Lorsque l'utilisateur cliquera sur une zone de texte, celle-ci se remplira automatiquement d'une chaîne du type  :

Zone de texte 1'où 1 correspond à l'index de la zone de texte

En revanche, lorsque l'utilisateur double-cliquera sur une zone de texte, celle-ci sera vidée de son contenu.

Concrétement cela vous donnera une application dans ce genre  :

Le code est le suivant. Vous remarquez qu'il est basé sur l'index fourni en argument aux procédures événementielles du groupe de contrôles zone de texte.

Private Sub txtAffichage_Click(Index As Integer)
'Si l'utilisateur fait un simple clic sur une zone de texte, _
celle-ci recoit un texte du type: "Zone de texte 1"

  txtAffichage(Index) = "Zone de texte " & Index
End Sub

Private Sub
txtAffichage_DblClick(Index As Integer)
'Si l'utilisateur fait un double clic sur une zone de texte, _
celle-ci est vidée

  txtAffichage(Index) = ""
End Sub

Si vous testez votre application avec patience, vous devriez constater que le phénomène suivant est possible  :

À vous de trouver le petit bout de code à rajouter.

Les sources de cet exercice sont disponibles ici en faisant un clic droit "Enregistrer la cible de ce lien".

Haut de page
Plan du site  |  Mentions légales  |  Crédits  |  Aide