ListBox (1/2)

Jean-Yves FOCK-HOON

L’objectif de cette note technique en deux parties est d’introduire les ListBox et leur utilisation en Mode Structure et par programmation. La première partie de la note met l’accent sur les propriétés des ListBox. ♪

- Titre : ListBox (1/2)

- Auteur : Jean-Yves FOCK-HOON

- Parution : 1 mai 2006

- Licence : Ce document est issu de https://www.developpez.com et reste la propriété exclusive de son auteur. La copie, modification et/ou distribution par quelque moyen que ce soit est soumise à l'obtention préalable de l'autorisation de l'auteur.

Sommaire

- Un nouvel objet

- Création d’une ListBox dans l’éditeur de formulaires

- Liste des Propriétés de l’objet ListBox

- Thème « Objet »

- Thème « ListBox »

- Thème « Quadrillage »

- Thème « Coordonnées et dimensions »

- Thème « Redimensionnement »

- Thème « Affichage »

- Thème « Apparence »

- Thème « Fond et Bordure »

- Thème « Texte »

- Thème « Action »

- Liste des propriétés de l’en-tête

- Thème « Objet »

- Thème « Images »

- Thème « Coordonnées et Dimensions »

- Thème « Texte »

- Thème « Aide »

- Liste des propriétés pour la colonne

- Thème « Objet »

- Thème « Source de données »

- Thème « Coordonnées et Dimensions »

- Thème « Redimensionnement »

- Thème « Saisie »

- Thème « Plage de valeurs »

- Thème « Affichage »

- Thème « Fonds et Bordures »

- Thème « Texte »

- Thème « Action »

- Thème « Événements »

- Conclusion

- Télécharger l’exemple

Un nouvel objet

Dans les anciennes versions, le développeur devait créer plusieurs zones de défilement et les grouper pour pouvoir afficher des données sur plusieurs colonnes et pouvoir sélectionner une ligne complète. Les zones de défilement groupées étaient très basiques et possédaient de fortes limitations. En 4D 2004, un nouvel objet a été introduit, la ListBox. C’est un objet qui vous permet d’afficher des tableaux et vous donne plus de contrôles dans l’affichage des objets et leur saisie.

Création d’une ListBox dans l’éditeur de formulaires

Comme tout objet de formulaire, une listbox est créée dans un formulaire, en Mode Structure. À partir de la palette d’outils, vous pouvez sélectionner un objet ListBox et tracer l’objet sur le formulaire. Cet objet, sans paramétrages supplémentaires, aura les paramètres par défaut et une seule colonne.

La sélection d’une ListBox dans l’éditeur de formule peut prêter à confusion ; vous pouvez cliquer une fois sur une ListBox et elle sera sélectionnée. Si vous cliquez à nouveau dans la listbox, vous pouvez sélectionner une colonne ou un en-tête de la listbox. C’est pourquoi il est conseillé de bien vérifié l’objet sélectionné lorsque l’on met en place les propriétés. Par exemple, vous pouvez ouvrir le formulaire [Contacts]Demo, de la base de démonstration, en Mode Structure. Ce formulaire est un dialogue qui contient une ListBox avec plusieurs colonnes. Ces colonnes et tous leurs attributs ont été définis dans un objet ListBox.

Sélectionnez l’objet ListBox et regardons la liste des propriétés.

Liste des Propriétés de l’objet ListBox

Thème « Objet »

Nom et Nom de l’objet

Vous pouvez voir que notre ListBox a un nom. Notre ListBox est en fait un tableau de booléen.

Thème « ListBox »

Nombre de colonnes

Nous pouvons voir le nombre de colonnes : 8. C’est le nombre de colonnes que 4D affichera dans l’objet lorsqu’on l’utilise pour la première fois. Lorsque l’on augmente ce nombre, 4D insérera de nouvelles colonnes avec des noms par défaut pour ces objets. Les tableaux définis dans cette ListBox doivent avoir été définis au préalable. Tous les tableaux doivent avoir le même nombre d’éléments. Sinon, la ListBox utilisera la taille du tableau le plus petit. Si la ListBox affichée vide, c’est tout simplement qu’un des tableaux est vide. Vous pouvez utiliser les commandes de 4D pour insérer ou supprimer des colonnes dans la ListBox.

Nombre de colonnes fixes

C’est le nombre de colonnes statiques (c’est-à-dire qui ne peuvent pas être bougées). Ceci s’applique aux premières colonnes de la ListBox. Dans cet exemple, nous pouvons voir 1. Cela signifie que la première colonne, aNum, ne peut pas être déplacée. Si la valeur avait été 2, les deux premières colonnes, aNum et aString, n’auraient pas pu être déplacées. Elles gardent leur position courante. Si vous ne voulez autoriser aucun déplacement de colonne, entrez le nombre total de colonnes. Cette propriété ne peut pas être manipulée par programmation.

Afficher les en-têtes

Cette case à cocher vous permet de cacher ou de montrer les titres des colonnes. Cela ne signifie pas que ces variables ne peuvent pas être utilisées. Elles sont juste cachées. Vous pouvez utiliser la commande CHOIX VISIBLE sur une variable de l’en-tête pour cacher ou montrer toute la ligne. Dans notre exemple, le bouton « Cacher les en-têtes » cachera ou montrera tous les en-têtes.

Sélection multiple

En sélectionnant cette case à cocher, on permet aux utilisateurs de sélectionner plusieurs lignes. Vous ne pouvez pas définir cette propriété avec le langage. Dans notre exemple, nous pouvons sélectionner plusieurs lignes.

Tableau de styles, Tableau couleurs de police, Tableau couleurs de fond

Entrez dans cette zone les noms des tableaux qui contiendront les styles et couleurs pour chaque ligne. En Mode Structure, deux tons de gris ont été définis comme couleur de fond et couleur de fond alternée et le style pour chaque colonne est blanc et normal, excepté pour la colonne Ville, qui est en gras et italique.

En environnement Menus Créés, nous pouvons voir que les tableaux sont affichés avec des fonds différents ainsi que des couleurs d’avant-plan, et des styles spécifiques. C’est parce que trois tableaux ont été définis pour chaque propriété, avec une valeur pour chaque ligne. La taille des tableaux ne peut pas être supérieure au nombre de lignes. Si la taille de ces tableaux est plus petite que le nombre de lignes, les lignes restantes utiliseront les paramètres définis au niveau de la ListBox. Dans notre exemple, nous pouvons voir que seulement les 6 premières lignes ont leur style et leur couleur modifiés. C’est parce que les tableaux ont une taille de 6 seulement, nombre inférieur au nombre de lignes. Si nous cliquons sur une colonne pour la trier, nos lignes avec fond gris sont maintenant en position différente.

À partir de la liste des propriétés, nous pouvons voir que les 6 premières lignes changent de couleurs tandis les dernières lignes restent en jaune. Si vous utilisez ces tableaux, vérifiez que vous ne changez pas leurs valeurs, car cela peut aussi affecter la ListBox (sauf si c’est ce que vous souhaitez). Vous ne pouvez pas assigner ces tableaux par programmation. Mais vous pouvez utiliser des commandes 4D telles que CHOIX COULEUR, CHANGER JEU DE CARACTERES et CHANGER TAILLE pour définir les couleurs d’arrière-plan et d’avant-plan pour chaque ligne plutôt que pour chaque colonne. Si vous utilisez ces tableaux, sachez qu’ils prennent toujours le pas sur les paramétrages que vous avez pu définir au niveau de la ListBox ou sur chaque colonne. Si vous voulez rendre accessibles temporairement ces couleurs, redimensionnez les tableaux à 0 élément. Dans notre exemple, nous utilisons 3 tableaux. Cliquez sur les boutons « Arrière-plan 1 », « Arrière-plan2 » ou « Arrière-plan 3 » pour changer le contenu de ces tableaux ou sur « Aucun » pour re-initialiser le tableau à 0 élément, et vous verrez les effets sur la ListBox.

Thème « Quadrillage »

Dans cette zone, vous pouvez définir le quadrillage. Vous pouvez cacher ou montrer le quadrillage vertical ou horizontal. Vous pouvez aussi changer ces propriétés avec les commandes MONTRER GRILLE LISTBOX et FIXER COULEUR GRILLE LISTBOX.

Thème « Coordonnées et dimensions »

Ce sont les coordonnées et les dimensions de l’objet ListBox sur votre formulaire. Vous pouvez utiliser la commande DEPLACER OBJET pour déplacer la ListBox sur votre formulaire si nécessaire. Vous pouvez aussi définir la hauteur des lignes dans la liste des Propriétés. Ceci peut aussi être défini avec le langage. En utilisant la commande Lire hauteur lignes listbox pour retrouver la hauteur courante et FIXER HAUTEUR LIGNES LISTBOX pour obtenir la hauteur désirée. Cliquez sur le bouton « Changer » pour voir la hauteur doublée. La ListBox ne peut pas afficher du texte sur plusieurs lignes. Changer la hauteur ne signifie pas que le texte de plus de deux lignes sera visible. Vous pouvez doubler la hauteur et utiliser des tableaux texte, vous n’afficherez toujours qu’une ligne.

Thème « Redimensionnement »

Ces options permettent de définir le comportement de la ListBox lors du redimensionnement de la fenêtre. Comme les autres objets, elle peut avoir une taille fixe, se déplacer ou s’agrandir horizontalement et verticalement. Ces options ne peuvent pas être définies par programmation.

Thème « Affichage »

Invisible par défaut

Cette option vous permet de rendre la ListBox invisible lorsque vous affichez le formulaire dans votre fenêtre. Vous pouvez rendre la ListBox visible ou invisible par programmation avec la commande CHOIX VISIBLE. Dans notre exemple, vous pouvez cliquer sur le bouton « Cacher les colonnes » pour cacher ou montrer les colonnes.

Thème « Apparence »

Plateforme

Le choix de la plateforme est disponible seulement si la base a été créée en 4D 2004. Vous pouvez choisir entre « Système » et « Impression ». Cela ne fera pas de différence, car vous ne pouvez pas imprimer une ListBox. Pour les bases converties, la plateforme ne sera pas disponible ; la ListBox utilisera une interface « hard-codée » : « automatique ». Comme pour les autres objets, vous ne pouvez pas définir ces propriétés par programmation.

Barre de défilement horizontale/verticale

Lorsque vous affichez une ListBox, vous pouvez décider d’afficher ou de cacher les barres de défilement horizontale et/ou verticale. Cochez ou décochez la case à cocher appropriée pour montrer ou cacher les barres de défilement horizontalement et verticale. Vous pouvez utiliser la commande CHOIX VISIBLE BARRES DEFILEMENT pour les montrer ou les cacher. Dans notre base exemple, vous pouvez cliquez sur le bouton « Monter les ascenseurs » ou « Cacher les ascenseurs ».

Thème « Fond et Bordure »

Couleur de fond/Couleur de fond alternée

Vous pouvez définir une couleur de fond et une couleur alternée pour chaque ligne. Les couleurs peuvent être calculées à partir des formules définies par CHOIX COULEUR ou FIXER COULEURS RVB.

Style de la bordure

Vous pouvez définir une bordure, système, double, relief inversé, relief, trait pointillé, normal ou transparent. Cette fonctionnalité est la même pour tous les autres objets 4D. Vous ne pouvez pas définir la bordure par programmation.

Thème « Texte »

Ces attributs sont les mêmes que ceux utilisés pour les autres objets comme les champs ou les variables. Vous pouvez définir la taille de la police, son nom ou sa couleur par exemple. Vous pouvez spécifier l’utilisation d’une feuille de style ou tout simplement préciser directement les propriétés au niveau de l’objet ListBox.

Tous les attributs choisis seront appliqués à tous les objets dans la ListBox, colonnes et en-têtes. Tous les attributs des textes peuvent être appliqués par programmation avec les commandes CHANGER JEU DE CARACTERES, CHANGER TAILLE, CHANGER STYLE, CHOIX COULEUR et FIXER ALIGNEMENT. Dans notre exemple, Vous pouvez cliquer sur les boutons « Format 1 » et « Format 2 » pour voir les changements sur ces polices.

Thème « Action »

Méthode

Il s’agit de la méthode-objet de la ListBox.

Glissable

La ListBox, ou plus précisément la ligne courante est glissable, c’est-à-dire peut être glissé vers un autre objet qui accepte l’événement Sur déposer. Vous ne pouvez pas mettre en place ou enlever cette fonctionnalité par programmation.

Déposable

La ListBox peut être définie comme déposable, c’est-à-dire qu’elle peut recevoir les objets déposés. Vous pouvez glisser une valeur de 4D et la déposer sur l’objet courant. Vous pouvez tester les événements formulaire Sur glisser et Sur déposer. Vous ne pouvez pas mettre en place et enlever cette fonctionnalité par programmation.

Lignes déplaçables

Les lignes de votre ListBox peuvent être déplacées. Vous pouvez changer la disposition de vos lignes en glissant et déposant les lignes entre elles. Il peut sembler difficile de déplacer une ligne qui deviendra la dernière ligne de la ListBox. Vous pouvez déplacer cette ligne en avant-dernier, puis prendre la dernière ligne et la remonter d’une ligne.

Triable

En cliquant sur l’en-tête, vous pouvez trier les colonnes. Une fois qu’une colonne a été triée, une petite icône apparaît. Cliquez à nouveau sur l’en-tête de colonne pour changer le sens du tri.

Événements

Vous trouverez dans cette partie la liste des événements que la ListBox peut gérer et exécuter dans sa méthode-objet.

Si vous cliquez à nouveau à l’intérieur de la ListBox, vous sélectionnez soit une colonne, soit un en-tête.

Liste des propriétés de l’en-tête

Si vous sélectionnez un en-tête de colonne, vous pouvez voir la liste des propriétés suivante :

Thème « Objet »

Nom de l’objet
Nom de variable

Ce seront le nom de l’objet et le nom de la variable de l’en-tête. Les noms des objets doivent être uniques sur un même formulaire, parmi tous les objets du formulaire. Les noms des variables doivent aussi être uniques. Vous ne pouvez pas utiliser des noms de variables déjà utilisés sur le formulaire. Par exemple, vous ne pouvez pas avoir deux colonnes où les noms des variables sont identiques, de même que vous ne pouvez pas avoir deux ListBox utilisant les mêmes variables d’en-têtes.

Titre

Il s’agit du titre de la colonne. Vous pouvez saisir un mot jusqu’à 63 caractères. Vous pouvez utiliser un texte statique ou une chaine STR# (:15000,1 par exemple). Vous pouvez changer le titre avec la commande TITRE BOUTON.

Thème « Images »

Icône
Nom/n°
Vous pouvez définir une très petite image, une icône, à côté du titre de la colonne. Vous devez définir son origine. Ce peut être une icône à partir d’une variable et vous avez juste à donner le nom de cette variable. Vous pouvez aussi choisir une image de la bibliothèque d’images et saisir son identifiant, ou vous pouvez sélectionner une ressource et indiquer l’identifiant de la ressource PICT. La hauteur de l’image doit être de 14 pixels. Vous ne pouvez pas affecter une image par programmation. Mais vous pouvez définir une variable image vide et changer le contenu de l’image plus tard. Vous devrez alors recharger la ListBox pour voir le changement de l’image (c’est-à-dire fermer et recharger le formulaire).

Effet miroir (Windows)
Cette fonctionnalité, disponible sur Windows seulement, permet d’afficher une image inversée. Ceci n’est donc disponible que sous Windows et quand le système d’écriture est de droite à gauche (Langue arabe, etc.).

Thème « Coordonnées et Dimensions »

Largeur

Ceci vous permet de définir la largeur par défaut d’une colonne lorsque la ListBox est affichée pour la première fois. Vous pouvez aussi changer cette largeur par programmation avec la commande FIXER LARGEUR COLONNE LISTBOX. Vous ne pouvez pas changer ni définir la largeur de la dernière colonne. Cette largeur est calculée par 4D en fonction de la largeur courante cumulée de toutes les autres colonnes et de la largeur de l’objet ListBox lui-même.

Thème « Texte »

Ceci permet de définir les attributs de texte pour chaque en-tête de colonne. Vous pouvez définir des paramètres désirés comme ceux sélectionnés pour la ListBox. Mais aucun de ces paramètres ne changera la hauteur de l’en-tête de la colonne, actuellement « hard-codé » dans 4D. Vous pouvez définir la couleur du texte, mais vous ne pouvez pas définir une couleur d’arrière-plan (ni par la Liste des Propriétés ni par le langage).

Thème « Aide »

Message d’aide

Ceci vous permet de définir un message d’aide pour l’en-tête de colonne. Si votre titre n’est pas suffisamment explicite, ce sera un bon moyen pour ajouter une explication. Vous ne pouvez pas changer le message d’aide par programmation. Mais vous pouvez changer le contenu d’un message d’aide en utilisant des ressources STR# à l’intérieur du message et en définissant cette ressource chaine dans votre fichier de structure.

Liste des propriétés pour la colonne

D’un autre côté, si vous choisissez une colonne, vous pouvez voir les propriétés suivantes :

Thème « Objet »

Nom de l’objet
Nom de la variable

C’est le nom de l’objet et le nom de la variable de la colonne. Ceci suit les mêmes limitations comme défini précédemment. Le nom de la variable sera le nom du tableau à afficher.

Type de variable
Il s’agit du type de la colonne. Le type du tableau peut être Alpha, Texte, Numérique, Date, Heure, Image et booléen. En fonction de ce type, vous pourrez choisir le format d’affichage. Cette option ne changera pas le type choisi pour le tableau.

Thème « Source de données »

Énumération
Vous pouvez choisir une énumération comme source de données. La liste de données sera chargée dans la ListBox une seule fois. Une petite icône affichée à la droite du bouton de la cellule vous permettra de savoir que cette énumération est disponible. Vous pouvez cliquer sur cette icône pour afficher un pop-up menu et choisir une valeur disponible. Vous pouvez utiliser la commande CHOIX ENUMERATION pour définir une énumération pour chaque objet. Passez une chaine vide comme nom si vous souhaitez supprimer une affectation d’énumération. Vous ne pouvez pas changer le contenu de ce pop-up menu simplement en changeant de liste ; vous devrez recharger la liste. Ceci peut être fait en fermant le dialogue et en réaffichant la ListBox, ou juste en exécutant CHOIX ENUMERATION avec la liste courante en paramètre.

Lorsque vous définissez une énumération, l’utilisateur peut entrer une valeur ou peut choisir une valeur dans le pop-up menu. Vérifiez que la largeur de la colonne est suffisante pour afficher la valeur la plus longue de votre liste. La largeur du pop-up est fonction de la largeur de la colonne. Si la colonne est trop étroite, le pop-up menu sera lui aussi trop étroit.

Thème « Coordonnées et Dimensions »

Largeur
Ceci permet de définir la largeur par défaut de la colonne lorsque la ListBox est affichée pour la première fois. C’est la même largeur que celle définie pour l’en-tête de la colonne.

Largeur mini
C’est la largeur minimum que la colonne acceptera si elle est retaillée. La valeur par défaut est de 10 pixels. Vérifiez que la largeur minimum est inférieure ou égale à la largeur maximum. Cette propriété ne peut pas être changée par programmation.

Largeur maximum
C’est la largeur maximum qu’une colonne peut avoir. La valeur par défaut est de 32 000 pixels. N’oubliez pas de changer cette valeur pour une plus réaliste. Vérifiez que la valeur maximum est plus grande ou égale à la largeur minimum. Cette propriété ne peut pas être changée par programmation.

Thème « Redimensionnement »

Redimensionnable

Cette option vous permet de définir si la colonne peut être redimensionnée ou non. Si cette option est choisie, les largeurs maximum et minimum vont être utilisées. Cette propriété ne peut pas être changée par programmation.

Thème « Saisie »

Saisissable

Cette option vous permet de rendre la colonne saisissable ou non. Vous devez rendre la colonne saisissable si vous voulez utiliser une énumération sur cette colonne. Vous pouvez utiliser la commande CHOIX SAISISSABLE pour changer ce paramétrage.

Filtre de saisie

Cette option vous permet de définir un filtre de saisie ; cette option est identique à celle utilisée pour les autres objets saisissables de 4D. Vous pouvez utiliser la commande CHOIX FILTRE SAISIE pour installer un filtre par programmation.

Thème « Plage de valeurs »

Obligation

Ceci vous permet de définir une liste de valeurs obligatoires à choisir. Si vous définissez une énumération en tant que liste obligatoire et une énumération simple, la liste obligatoire sera celle qui apparaîtra. La différence avec une énumération simple est que l’utilisateur ne peut pas saisir n’importe quelle valeur. Il peut seulement sélectionner une valeur du pop-up menu défini en liste obligatoire. Comme précédemment, il faut que la colonne soit saisissable. Vous ne pouvez pas définir une liste obligatoire par programmation et vous ne pouvez pas la changer à la volée. Vous devez refermer et rouvrir le dialogue pour voir les changements.

Exclusion

Ceci vous permet de définir une liste avec les valeurs interdites. Cette liste ne remplace pas les listes définies comme énumération ou liste obligatoire. Le comportement courant est que l’utilisateur choisit une valeur dans une énumération ou une liste obligatoire. Cette valeur est alors vérifiée avec les valeurs de la liste d’exclusion. Si cette valeur est dans la liste, une alerte apparaîtra (« cette valeur n’est pas autorisée ») et la valeur sera refusée. Vous ne pouvez pas définir une liste d’exclusion par programmation ni changer la liste à la volée. Vous devez fermer et rouvrir le dialogue pour voir les changements appliqués à votre liste d’exclusion.

Thème « Affichage »

Format Alpha, format Numérique, format Date, format Heure, format Image : ceci vous permet de définir les formats d’affichage pour vos données, vous pouvez utiliser les paramétrages par défaut ou utiliser vos propres paramétrages. Vous pouvez utiliser la commande CHOIX FORMATAGE pour mettre en place ces formats. Dans notre exemple vous pouvez cliquer sur les deux boutons de la zone « Format » pour visualiser les changements sur les colonnes.

Format Booléen

Le format booléen vous permet de choisir l’affichage d’une valeur booléenne. Vous pouvez choisir une case à cocher avec un titre ou un pop-up menu avec un titre. Vous pouvez utiliser la syntaxe suivante :

code 4D

CHOIX FORMATAGE(ab_Paid;"Payé")

pour afficher une case à cocher par programmation. Si vous souhaitez afficher un pop-up, vous utiliserez le code suivant :

code 4D

CHOIX FORMATAGE(ab_Paid;"Payé;A réglé")

Invisible

La case à cocher « Invisible » vous permet de rendre une colonne invisible lorsque la ListBox est affichée pour la première fois. Vous pouvez la rendre visible ou invisible avec la commande CHOIX VISIBLE.

Thème « Fonds et Bordures »

Couleur de fond/Couleur de fond alterné

Vous pouvez définir une couleur d’arrière-plan et une couleur alternée (pour alternée les couleurs d’arrière-plan ligne par ligne). Les couleurs peuvent être attribuées par programmation avec les commandes CHOIX COULEUR ou FIXER COULEURS RVB appliquées à la colonne.

Thème « Texte »

Ces attributs sont identiques à ceux utilisés pour les autres objets comme les champs et les variables. Vous pouvez définir le corps de la police, son nom et sa colonne pour une colonne précise. Vous pouvez préciser l’utilisation d’une feuille de style ou appliquer les attributs un par un.

Tous les attributs de texte choisis seront appliqués pour la colonne seulement. Tous les attributs de texte peuvent être mis en place par programmation (CHANGER JEU DE CARACTERES, CHANGER TAILLE, CHANGER STYLE, CHOIX COULEUR et FIXER ALIGNEMENT). Les commandes sur les couleurs vous permettent de définir la couleur d’arrière-plan. L’utilisation des constantes couleurs standard du système utilisées par la commande FIXER COULEURS RVB ne fonctionne pas avec les colonnes.

Thème « Action »

Méthode

Méthode-objet de la colonne courante.

Thème « Événements »

Il s’agit de la liste de tous les événements que la colonne peut gérer pour exécuter sa méthode-objet.

Conclusion

Une ListBox est un outil très puissant qui permet d’afficher vos tableaux avec infiniment plus de contrôles qu’avec une zone de défilement. La partie 2 de cette note abordera plus précisément la programmation sur les ListBox.

Télécharger l’exemple

Télécharger la base exemple.