Leçon 36 : Formulaires : Utilisation d'onglets

Temps nécessaire pour suivre cette leçon : Entre trois quarts d'heure et une petite heure

Pour suivre cette leçon, vous devez avoir suivi les leçons précédentes. Ou plus précisément, vous devez être en possession de la base de données ProFormation.mdb telle qu'elle était à la fin de la leçon précédente. Si vous n'êtes pas certain de l'avoir, vous pouvez la télécharger ici

Aperçu de cette leçon

Dans cette leçon, nous allons voir comment utiliser le contrôle "Onglets", et nous allons constater comment faire pour scinder les informations (les champs) en petits groupes isolés, afin de ne pas avoir d'écrans surchargés. C'est une méthode particulièrement sympathique !

Sommaire

  1. Onglets : Quelle est leur utilité ?
  2. Onglets : Création d'un groupe d'onglets : Cas pratique
  3. Onglets : Renommer un onglet
  4. Onglets : ajout d'un onglet
  5. Onglets : Installation de champs dans les différents onglets
  6. Onglets : Comparaison avec les cadres
  7. Onglets : Inconvénients des informations masquées, déplacement du groupe d'onglets
  8. Onglets : Injection d'une image à côté du nom des onglets
  9. Onglets : aspect esthétique général
  10. Onglets : Redimensionnement du groupe d'onglets et gestion des multi-lignes d'onglets

Avant de commencer cette leçon, créez un nouveau formulaire basé sur T_Celebrite, comme d'habitude.

Les onglets permettent de gérer un grand nombre d'informations sur une seule page. Par exemple, dans Access, si vous allez dans le menu Outils/Options, vous voyez ces onglets :

Alors, à quoi servent-ils, ces onglets ?


Onglets : Quelle est leur utilité ?

A segmenter les options, parce qu'il y en a tellement que s'ils avaient mis tout ça sur un seul écran, ce serait illisible !

Exactement. Les onglets servent simplement à diviser un grand nombre d'informations d'une même nature (les options d'Access) en plusieurs pages (onglets), afin de garder toute la lisibilité requise.

Donc pour illustrer ces onglets, nous allons en créer nous-même pour diviser les champs de notre table T_Celebrite en différents groupes de champs, par exemple comme ceci :

. Chaque onglet abrite un certain nombre de champs qui se "ressemblent" plus ou moins : Par exemple, dans l'onglet Infos Générales, nous allons pouvoir y mettre les champs Titre, NomClient, Prenom et Domaine : . Dans Infos privées, les renseignements plus "privés", tels que le pays, l'état civil, le salaire et la date de naissance y seront accueillis : . Un 3ème onglet pourrait ne contenir que la remarque (J'ai enlevé l'étiquette Remarque qui faisait double emploi avec le titre de l'onglet) : , et le dernier onglet comporte la photo :


Onglets : création d'un groupe d'onglets : cas pratique

Comment commence-t-on ?

Vous allez utiliser le contrôle onglet de le boîte à outils : . Vous allez simplement cliquer dessus, n'essayez pas de le faire glisser dans votre formulaire, cliquez dessus, lâchez la souris, allez ensuite en haut à gauche de votre formulaire, et cliquez simplement : . Vous voici propriétaire d'un contrôle onglet muni de 2 pages (2 onglets):

Pourquoi 2 pages et pas 3 ou 10 ?

Je ne sais pas. Ce n'est pas important, parce qu'on peut en supprimer et en ajouter comme on veut.

Vous pouvez cliquer sur Page1 ou Page2 en mode création, ou en mode saisie de données : le résultat sera que vous passez d'un onglet à l'autre.


Onglets : renommer un onglet

Comment renommer "Page1" en "Infos générales" ?

En mode création, vous cliquez avec le bouton droit de la souris sur Page1, et vous demandez les propriétés. Dans l'onglet (des propriétés) Format, vous précisez que la légende est Infos Générales : . Ce sera le nom de votre premier onglet : . Je pense que vous devriez pouvoir renommer l'onglet Page2 vous-même en Infos privées :


Onglets : ajout d'un onglet

Sans problème ! Et si je voulais rajouter un nouvel onglet ?

Cliquez avec le bouton droit de votre souris sur l'onglet Infos privées, et choisissez "Insérer une page" :. Voici votre nouvelle page : . Renommez vous-même cet onglet en Remarques :

Maintenant, je suppose qu'on va créer un dernier onglet qui s'appellera Photo ?

Exactement. Allez-y :


Onglets : Installation de champs dans les différents onglets

On place les champs correspondants dans leur onglet respectif ?

Oui. Nous allons commencer par mettre les champs généraux dans Infos générales.

Marche à suivre :

  1. Cliquez sur l'onglet "Infos générales"
  2. Sélectionnez les champs Titre jusqu'à Domaine en bleu : (Si vous ne savez plus comment on fait, c'est que vous manquez franchement de pratique, et vous êtes bon pour revoir la leçon 30 !)
  3. Faites glisser ces champs jusque sur l'espace de "Infos générales" :
  4. Voici le résultat :

Vous venez d'installer une série de champs dans le premier onglet Infos générales. Si vous cliquez sur les autres onglets, ils sont toujours vides : . Lancez le formulaire en mode saisie de données, vous constaterez également les champs ne sont visibles QUE sur l'onglet Infos Générales, ce qui est totalement logique.

Pour mettre les champs PaysOrigine jusqu'à DateNaissance, je répète exactement la même chose, mais cette fois en les glissant sur l'onglet "Infos privées" !

Oui. Vous commencez d'abord par cliquer sur "Infos privées", puis vous suivez exactement la même marche à suivre que pour les champs "Infos générales" juste ici au-dessus. Allez-y ! Voici le résultat en mode saisie de données, sur Napoléon :

J'ai compris !

Dans ce cas, placez la remarque dans l'onglet remarque, et la photo dans l'onglet Photo, allez, hop hop hop ! On n'est pas à la plage ici !!!

J'occis* l'étiquette de Remarque et de Photo je suppose ?

* J'en connais des mots compliqués, n'est-ce pas ?

Oui, sinon ça fait double emploi avec le nom de l'onglet : . Pas très joli...


Onglets : Comparaison avec les cadres

Mes 4 onglets sont terminés !

Lancez votre formulaire en mode saisie de données : les données peuvent se saisir de manière plus conviviale. en fait, ça devrait vous rappeler la leçon 33 : les cadres et les titres qui permettent de faire également des groupes de champs. Rappelez-vous l'exercice qui vous était proposé :

Les onglets ont en fin de compte la même fonction, sauf qu'on utilise plutôt les onglets quand on a vraiment beaucoup, beaucoup de champs.

Dans notre cas, à la limite, les onglets sont un peu superflus, mais cette leçon était destinée à vous les montrer.


Onglets : Inconvénients des informations masquées, déplacement du groupe d'onglets

Il y a un inconvénient aux onglets : quand vous êtes dans l'onglet Infos Générales, tout va bien, vous voyez de qui il s'agit puisque cet onglet contient le nom et le prénom...
Par contre, dans les autres onglets, on ne sait plus de qui il s'agit puisqu'on ne voit plus ni le nom ni le prénom...
C'est ennuyeux...

En fait, on n'aurait pas dû y mettre les deux champs principaux Nom et Prénom dans un onglet, mais plutôt au-dessus de tous les onglets, comme ceci :

Allons-y :

  1. Faites un peu de place en haut de la série d'onglets : . Pour ce faire, il s'agit de faire un peu glisser tous les onglets vers le bas. ATTENTION : Il y a un endroit tout a fait particulier ou il faut cliquer pour arriver à descendre le groupe d'onglets : C'est juste ici : . Descendez un peu les onglets en les faisant glisser vers le bas. Vous obtenez maintenant un peu plus d'espace :
  2. Sélectionnez le nom et le prénom :
  3. Allez dans le menu Edition/Couper
    N'essayez pas de faire glisser les deux champs hors de l'onglet, vous n'y arriverez pas : Si vous essayez, tout ce que vous arriverez à faire, c'est agrandir les onglets vers le haut
  4. Cliquez dans la zone "Détail"
  5. Allez dans le menu Edition/Coller :
    J'en profite pour faire la même remarque que celle d'avant : Si vous voulez remettre les 2 champs dans l'onglet Infos générales, n'essayez pas non plus de les glisser avec la souris. Vous devez faire Edition Couper, cliquer ensuite sur l'onglet Infos générales, et faire Edition Coller. Parce que si vous essayez de les faire glisser, vous y arriverez bien... Mais vous constaterez que ces 2 champs ne sont pas sur l'onglet Infos générales, mais DEVANT tous les onglets : En effet, quel que soit l'onglet sur lequel vous cliquerez , vous verrez toujours le nom et le prénom apparents... Bon à savoir !
  6. Mettez les en forme :

Maintenant, quel que soit l'onglet dans lequel vous vous trouvez, le nom et le prénom seront toujours visibles.

Essayez : lancez votre formulaire en mode saisie de données, déplacez vous d'enregistrement en enregistrement, et voyez par vous-même à quel point c'est plus confortable.

C'est largement mieux !


Onglets : injection d'une image à côté du nom des onglets

Il est même possible d'intégrer des petites images associées aux onglets : regardez plutôt , je place une image qui représente une petite bulle verte à l'onglet Infos générales :

Pour que vous puissiez installer des petites bulles sur vos onglets, il faut que je vous les fournisse : Les voici : - - - (Enregistrez ces petites bulles sur votre PC avec Bouton droit de la souris, enregistrer sous, anfin comme d'habitude, quoi...)

C'est marrant... Jusqu'ici, nous avons utilisé des images qui se terminaient par .JPG, et ici ce sont des .BMP...

Bienvenue dans la jungle des formats d'images numériques !

L'explication détaillée des différents formats dépasserait largement le cadre de ce cours : toujours est-il que pour les onglets, le seul format accepté est le BMP, alors que pour les objets OLE et les fonds d'écran, les JPG sont également acceptés... Allez comprendre... ! On vit avec.

Maintenant que vous avez vos 4 fichiers enregistrés sur votre disque dur (bullebleue.bmp, bullerouge.bmp, bullejaune.bmp et bulleverte.bmp), nous allons les intégrer à nos onglets.

  1. Demandez les propriétés de l'onglet Infos générales (Ca, je suppose que vous savez faire...)
  2. Onglet Format, Image : Cliquer sur les 3 petits points à droite... Facile !
  3. Cliquez sur Parcourir
  4. Choisissez votre image bulleverte.bmp là ou vous l'avez posée : , et cliquez sur Ouvrir
  5. Cliquez sur OK :

Et voilà :

Facile !

Alors, mettez les différentes autres bulles aux autres onglets :

(Dans les 4 coins des petites bulles, il y a du blanc : C'est normal, une image est toujours carrée ou rectangulaire : si j'avais coloré ces coins en gris, vous n'auriez pas vu cette particularité, et ç'aurait été plus joli, mais moins compréhensible)

C'est fait !


Onglets : aspect esthétique général

Nous allons encore voir comment changer l'aspect des onglets. On peut par exemple les montrer sous forme de boutons, comme ceci :

Ca change quoi ?

Rien. C'est un gadget. C'est juste une question esthétique. Allez dans les propriétés des onglets , et dans l'onglet Format, demandez dans Style : Boutons.


Onglets : redimensionnement du groupe d'onglets et gestion des multi-lignes d'onglets

C'est aussi avec une de ces propriétés qu'on peut avoir les onglets sur 2 lignes, comme ceci : ?

Oui, c'est juste au dessus : Multi-ligne : . Il faut faire attention, parce qu'on ne s'aperçoit de ce système de multi-lignes que lorsque le contrôle onglets est trop mince pour contenir tous les onglets en largeur : essayez d'amincir vos onglets comme ceci : . Voici le résultat : . On ne voit plus tous les onglets (il manque celui de la photo), mais il y a 2 flèches sur lesquelles on peut cliquer en mode saisie de données pour faire défiler les onglets.

... Mais ce n'est pas pratique, d'ou l'astuce de "Multi-lignes" !

Vous avez tout compris. Si vous mettez à Oui, alors, vous aurez 2 rangées d'onglets, plus sympathiques, comme ceci :

Pourquoi est-ce l'onglet Infos générales qui est en dessous ?

Aucune idée !

Ok. Quand je suis sur 2 lignes , je n'ai plus cette petite zone pour cliquer dessus pour avoir les propriétés de tous les onglets... Comment faire ?

Ca m'a torturé l'esprit pendant un bon moment, mais j'ai trouvé une astuce : cliquez TRES EXACTEMENT sur le bord droit des onglets, comme ceci : . ATTENTION : Ca c'est trop à gauche : (ca ne marche pas), et ça c'est trop à droite, c'est vraiment SUR le bord qu'il faut cliquer, avec le bouton droit, et demandez les propriétés.

Si vous cliquez avec le bouton gauche, ça vous permettra de redimensionner vos onglets : .

Petite remarque importante : faites toujours bien attention au fait que vous avez plusieurs onglets qui sont les uns sur les autres, et que donc, vous ne voyez le contenu que d'un seul à la fois... Si vous réduisez la taille de vos onglets en étant par exemple sur la remarque, vos pouvez vous dire "Comme la zone de la remarque est assez petite, je peux réduire mes onglets d'autant". Pas forcément, puisque sur un autre onglet, par exemple "Infos privées", vous avez peut-être des champs qui s'étirent plus à droite que votre remarque... Le contrôle Onglets va simplement REFUSER de se réduire de trop, afin d'éviter d'"écrabouiller" les champs qui se trouveraient sur un onglet que vous n'avez pas vu... et vous pourriez ainsi facilement vous dire "Mais il m'ennuie ! pourquoi est-ce que je ne peux pas réduire ce satané onglet ! Il est trop large"... Vous saurez que c'est à cause des contenus des AUTRES onglets, derrière !

Maintenant, fermez votre formulaire, et Enregistrez-le sous F_CelebriteOnglet

Bon... Hem... On peut résumer ?

Les onglets sont une manière d'organiser de nombreux champs au sein d'un même écran. Il est en effet souvent plus facile de lire une petite quantité d'informations à chaque fois, et de changer d'onglet lorsque que c'est nécessaire, plutôt qu'un grand nombre de champs sur un même écran donnant par là-même une impression de fouillis. On organise ses onglets par rubrique, mais on n'est pas toutefois pas obligé de placer tous les champs dans les onglets : on peut très bien en installer certains en dehors des onglets pour que ceux-ci soient toujours visibles, quel que soit l'onglet dans lequel on se trouve.

Avez-vous bien compris ?

  1. Les onglets se trouvent :
    a. Dans les tables
    b. Dans les requêtes
    c. Dans les formulaires ***
    d. Dans les tables, les requêtes et les formulaires

  2. Il est possible d'ajouter des images aux différents onglets
    a. Oui ***
    b. Non
    c. Pas encore. Peut-être lors de la prochaine version d'Access

  3. On peut changer la couleur de fond des onglets ?
    a. Oui
    b. Non ***
    c. On peut seulement choisir entre bleu, jaune et rouge

  4. On peut intégrer un contrôle onglets sur un onglet d'un AUTRE contrôle onglet ? (essayez pour connaître la réponse)
    a. Oui
    b. Non
    c. On peut, mais ce nouveau contrôle onglet sera TOUJOURS visible quelque soit l'"onglet-père" dans lequel on se trouve (le nouvel ensemble d'onnglet sera par dessus l'ensemble précédent) ***

  5. J'ai une table avec 5 champs (Nom, prénom, adresse, code postal et ville). Je crée un formulaire basé sur cette table ...
    a. Et je crée 1 onglet pour y mettre tous mes champs
    b. Et je crée 2 onglets
    c. Et je ne crée pas d'onglets parce qu'il y a vraiment trop peu de champs pour ça ***
    d. Et je crée un onglet par champ pour faire plus propre

Pour voir les solutions, il vous suffit de sélectionner le questionnaire ci-dessus : 3 petites étoiles *** apparaîtront en face des bonnes réponses.

Exercice

L'exercice consiste à créer une nouvelle base de données appelée Hôpital.MDB, dans laquelle vous créerez une table T_Patient pourvue des champs suivants :

L'exercice consiste à créer un formulaire F_Patient, pourvu de 4 onglets, séparant les champs comme suit :

1. Infos générales : , 2. Vaccins reçus : , 3. Symptômes : , 4. Opérations subies : , 5. Remarques : Remarque, et 6. Photo : photo (Que j'aurais dû mettre en Objet OLE, mais là n'est plus le sujet)

Voici une image de l'onglet Vaccins reçus pour vous donner une idée (Les cases cochées Grippe et Hépatite A ainsi que Dr Malbourt sont des purs produits de mon imagination):

 

Téléchargez la solution de l'exercice ici

Si vous n'êtes pas tout à fait certain d'avoir suivi correctement toutes les étapes de cette leçon, vous avez la possibilité de télécharger ici la version de ProFormation.mdb exactement dans l'état ou elle devrait être à la fin de cette leçon.

Avez-vous une question technique concernant cette leçon ? Cliquez ici !
Une remarque sur cette leçon ? Un problème ? Une erreur ? une ambiguité ? Soyez gentil de m'en informer