• Aucun résultat trouvé

L’ancrage, le docking et le regroupement

Jusqu’à maintenant, tous les formulaires que vous avez dessinés posent un problème de redimensionnement. Lorsque vous lancez le programme,

Figure 6.24: Modification dynamique de l’opacité

Créer un lien homme-machine Chapitre 6

111 LE GUIDE COMPLET

la fenêtre principale s’affiche à la taille que vous lui avez donnée dans le designer. Mais que se passe-t-il si vous la redimensionnez pour qu’elle occupe tout l’écran ? Faites le test. Dans le designer de formulaire de Visual Studio, ajoutez plusieurs contrôles de type bouton, une PictureBox, et lancez-le. Cliquez sur le bouton d’agrandissement de la fenêtre. Que se passe-t-il ? Les contrôles ne se repositionnent pas directement sur le formulaire et l’application paraît "désordonnée". Pour remédier à cela, il faut avoir recours à l’ancrage des contrôles.

L’ancrage revient à préciser de manière relative à quels endroits doivent s’accrocher les contrôles dans le dessin. Pour ce faire, il faut découper le formulaire en zones. Il existe un moyen simple de procéder. Vous allez utiliser le contrôle TableLayout. Faites glisser un TableLayout sur une forme dans un nouveau projet. LeTableLayoutest en fait une grille dans laquelle vous allez pouvoir placer les différents contrôles. Quand la fenêtre est redimensionnée, la grille l’est aussi et les contrôles gardent leur place. Par défaut, la grille est divisée en quatre, deux lignes et deux colonnes. Vous pouvez éditer le nombre de lignes et de colonnes en cliquant sur le contrôle puis sur la petite flèche blanche en haut à droite.

S’affichent alors des options d’édition de lignes et de colonnes.

Il reste maintenant à travailler sur le positionnement des contrôles dans les différentes parties de la grille. Ajoutez un bouton dans l’une des parties. Le bouton va par défaut se caler en haut à gauche de la grille.

Figure 6.25: L’éditeur de grille

Penser à l’utilisateur Chapitre 6

Cela est directement lié à la propriétéAnchor du bouton. Cliquez sur la case à droite de la propriétéAnchor.

Vous pouvez indiquer par rapport à quelle partie du contrôle parent doit être placé un contrôle. Si vous grisez la case haute, le contrôle sera placé au milieu et en haut. Si vous grisez le bas, le contrôle sera placé en bas.

Si le haut et le bas sont grisés, le contrôle sera centré. Testez sur le bouton. Modifiez la propriété Anchor et lancez le programme pour observer les changements.

Anchor

La propriétéAnchorpermet de définir les bords du formulaire par rapport auxquels le contrôle doit être centré.

Ajoutez unePictureBoxdans l’une des cases de la grille. Dans la fenêtre des propriétés, cherchez la propriété Dock et cliquez sur la case de droite.

Les différents choix possibles permettent pour le haut, le bas, la droite et la gauche de bloquer l’alignement du contrôle. Si vous choisissez de le centrer, le contrôle va prendre toute la place disponible du contrôle parent. Dans le cas de laPictureBox, il s’agit de la case duTableLayout dans lequel vous l’avez placée. Si vous ne mettez pas deTableLayout, le contrôle parent se trouve être le formulaire lui-même. Donc si vous choisissez de le centrer, le contrôle va remplir tout le formulaire.

Figure 6.26: Propriété Anchor

Figure 6.27: Le choix du Dock

Créer un lien homme-machine Chapitre 6

113 LE GUIDE COMPLET

Docking

Le docking permet de garder la relativité de la position, par exemple le fait d’être collé au bord droit même si le formulaire est

redimensionné.

Les derniers éléments qui peuvent servir pour redimensionner, garder les proportions, grouper les contrôles sont les contrôlesGroupBoxet Panel.

GroupBox

Le contrôleGroupBoxpermet de regrouper des contrôles, tout comme le contrôlePanel, à la différence que, pour laGroupBox, les contrôles sont entourés d’un liseré fin et d’une légende. En outre, lorsque vous regroupez des choix à l’aide de contrôle de type RadioButton, ils peuvent être sélectionnés de manière exclusive.

Dans cet exemple, il suffit d’ajouter à un formulaire un Panel et une GroupBox. Pour le Panel, il faut modifier la propriété Anchor à haut et droite, et pour laGroupBoxà bas et gauche. Pour lePanel, les propriétés

Figure 6.28: Une GroupBox et un Panel Penser à l’utilisateur Chapitre 6

Dockdes boutons ont été modifiées pour droite sur le bouton 2, gauche pour le bouton 1 et bas pour le bouton 3. Remarquez comment ils se placent dans le Panel.

Reproduisez le même exemple dans un nouveau projet. En lançant le programme, remarquez que lesRadioButtonsont indépendants les un des autres. Si vous ajoutez une deuxièmeGroupBox, vous pouvez réaliser un deuxième groupe de RadioButton indépendants, ce qui est impossible s’ils ne sont pas regroupés.

6.3. Attention aux pirates !

Lors de l’utilisation du programme, l’utilisateur aura probablement à entrer des valeurs, par exemple ses informations personnelles. Il est important de faire attention à la façon de stocker ces informations, car les rendre facilement accessibles à n’importe qui peut entraîner un lot de complications vraiment fâcheuses. Imaginez par exemple que lors de l’utilisation d’un logiciel permettant le paiement en ligne de la licence, le numéro de carte bleue de l’utilisateur puisse être vu par tous ceux qui utilisent le programme après lui. Ce programme ne risque pas de rester longtemps installer sur la machine de l’utilisateur. Évitez de stocker des informations relatives à l’utilisateur de manière claire.

Vous apprendrez au chapitre Enregistrer des données à stocker les informations fournies par les utilisateurs.

Pour le moment, voici quelques recommandations à propose des manipulations d’informations saisies par les utilisateurs. On distingue les utilisateurs normaux, qui essayent simplement d’exploiter le programme mis à leur disposition, et les utilisateurs malveillants, qui veulent tirer profit du programme.