Bonjour,
dans cette vidéo nous allons réaliser le maquettage de la navigation.
Nous devons donc disposer :
- d’un formulaire d’accueil avec des objets fonctionnels et "décoratifs"
- de quelques lignes de code pour afficher le formulaire à l’écran
- et d’écrans de saisie/modification pour chacun des fichiers à traiter
Commençons cette découverte par la réalisation de l’écran principal de navigation.
Comme vous l’avez vu dans la vidéo de présentation de l'application finale, nous devons intégrer dans notre logiciel la gestion des demandes d’intervention, des lieux d'intervention et des techniciens, le tout à partir d'un écran principal.
Nous allons donc créer cet écran principal.
Dans la barre d’outils :
- Cliquez sur le bouton "Explorateur" .
- Cliquez sur le bouton "formulaires"
- Choisissez "Formulaires projet" puis cliquez sur le bouton + en bas de l’explorateur.
- Nommons ce formulaire "Navigation".
- puis OK.
Un formulaire vide apparait ainsi que la liste des propriétés.
Les outils à gauche permettent d'ajouter des objets dans le formulaire :
- textes
- variables et champs
- listes
- popup menus
- boutons
- boutons radio
- thermomètres
- Objets décoratifs
- séparateurs
- plug-ins
- etc ...
Les outils en haut permettent de manipuler les objets :
- grouper / aligner
- gestion du zoom
- déplacement
- gestion du multi-pages
- et également des vues, des badges et de la bibliothèque d'objets.
Commençons par créer une interface de navigation simple pour en comprendre le fonctionnement:
- un bouton pour afficher la liste des personnels
- un bouton pour afficher la liste des interventions
- un bouton pour fermer le formulaire
- nous y ajouterons un titre en haut de la page
- Sélectionnez l’objet bouton
- Tracez un premier bouton dans le formulaire.
- Renommez le bouton "Terminé"
- en appuyant sur la touche entrée on valide la modification effectuée.
- On peut associer une action standard à chaque bouton
- ici, nous allons lui associer le choix "valider"
La liste des propriétés s'adapte à l'objet sur lequel on a cliqué.
- Renommez le bouton "Terminé"
- en appuyant sur la touche entrée on valide la modification effectuée.
- On peut associer une action standard à chaque bouton
- ici, nous allons lui associer le choix "valider"
Ce choix permettra de refermer la fenêtre.
- Créez un 2e bouton que nous allons nommer "Interventions".
Nous verrons bientôt comment programmer ce bouton afin qu’il affiche la liste des interventions.
Pour tester ce formulaire, cliquez sur le triangle vert en haut à gauche de la fenêtre du formulaire. 4D vous présente le formulaire tel que l'utilisateur le verra.
Vous remarquez que la fenêtre s’est adaptée toute seule à la taille du formulaire. Le redimensionnement sera automatique et vous fera gagner de temps en développement et en maintenance (cet automatisme de redimensionnement est bien évidemment débrayable).
- Cliquez sur le bouton "Terminé" pour refermer la fenêtre et revenir en mode Développement.
Rendons maintenant fonctionnel le 2e bouton :
- Effectuez un clic droit sur le bouton "Interventions".
- puis demandez "Méthode objet" :
- Dans la fenêtre de la méthode objet, saisissez la ligne suivante :
ALERTE("Liste des Interventions bientôt disponible...")
puis validez la ligne, automatiquement la commande ALERTE est reconnu.
Vous remarquez le "badge" qui indique qu’une méthode est associée à l’objet.
- Retestez le formulaire en cliquant sur le triangle vers en haut à gauche,
- puis cliquez sur le bouton "Interventions".
Le message apparaît bien.
Dans une leçon ultérieure, nous transformerons ces boutons en boutons images afin d’améliorer l’ergonomie de notre application.
Pour confirmer cette première approche, nous allons créer un troisième bouton destiné à afficher la liste des "Techniciens".
Il est possible de dupliquer des objets. Dans ce cas on duplique l’ensemble des propriétés del'objet ainsi que sa méthode associée. Seul le nom d’objet est différent puisque chaque objet porte un nom unique au sein d'un formulaire.
Nous pouvons donc ici modifier le titre et la méthode de l'objet accessible aussi par les propriétés.
En testant le formulaire, on dispose bien de 3 boutons actifs.