Extrait de la session de live coding sur Twitch du 27 février 2023 où vous pouvez me voir coder 2 projets d'exemples dans lesquels on affiche une liste de dossiers et de fichiers afin de se déplacer dans l'arborescence puis sélectionner un fichier en utilisant un TListView de FireMonkey avec un peu de code.
Le premier projet sert de base de travail et de tests.
Le second projet part du premier pour créer un cadre FMX réutilisable afin de sélectionner un fichier et le récupérer par code quand l'utilisateur le sélectionne par un double click.
Les deux sont disponibles dans ce dossier du dépôt GitHub de mes nombreux exemples de programmes en Delphi.
Dans cette vidéo vous verrez quelques astuces de codage pour transformer un ou plusieurs éléments d'interface en TFrame et pouvoir ensuite réellement s'en resservir de façon à peu près indépendante. Le sujet avait déjà été abordé lors de la présentation en ligne du 22 février 2019 où je montrais comment utiliser un TFrame pour l'utiliser comme composant visuel.
Nous avons aussi fait un tour dans Adobe Illustrator pour générer des icônes à associer à nos fichiers et dossier dans la liste puis les transformer en composant Delphi à l'aide du programme Folder2FMXImageList.
Contrairement à la VCL, FireMonkey ne propose pas de composants historiques pour Windows 3.1 ou en Win32 qui permettent le choix d'un lecteur (TDriveComboBox) ou affichent une arborescence (TDirectoryListBox ou TDirectoryOutline). Même s'il sont obsolètes et ne respectent plus les normes actuelles pour l'affichage de la liste d'une arborescence (sans les fioritures et périphériques référencés comme dossier ou lecteurs mais n'en étant pas), ils restaient pratiques pour choisir un dossier de travail et enregistrer ou sauver des fichiers dedans plutôt que simuler le choix d'un fichier et n'en conserver que le dossier.
Pour compenser il faut donc développer ce dont on a besoin. L'unité System.IOUtils nous fournit quasiment toutes les informations utiles (lecteurs, dossiers, fichiers) et ça fonctionne sur tous les systèmes d'exploitation mais à nous de le mettre en forme.
C'était l'objet de ce petit exercice de codage suite à une discussion récente sur le forum Developpez.com et une question dans le tchat de Twitch.
Deux projets ont été créés. Le premier pour concevoir ce dont on avait besoin sur une fiche classique et le tester, le second pour rentre le résultat exploitable en import sous forme de TFrame sur n'import quel projet.
L'unité udmAdobeStock_13945297.pas a été générée avec Folder2FMXImageList à partir de ce fichier sous licence d'Abobe Stock. Vous ne devez donc pas le prendre pour vos projets sauf à avoir acquis une licence d'utilisation sur cette image. Sont utilisées une image pour les dossiers, une image pour les fichiers et une image pour les fichiers censés contenir des images (*.PNG ou *.JPG).
La TListView utilisée contient une liste d'éléments créés en fonction du contenu d'un dossier de l'arborescence. C'est une combinaison de TDirectory.GetDirectories et TDirectory.GetFiles. Il suffit d'appliquer un filtre dessus pour ne lister que ce qui nous intéresse.
Quand on clique sur le premier élément on recharge la liste en remontant d'un dossier.
Quand on clique sur un élément associé à un dossier on entre dedans.
Quand on clique sur un élément associé à un fichier on le sélectionne.
On utilise la propriété Tag des TListViewItem pour stocker un entier permettant de savoir s'il s'agit d'un fichier ou d'un dossier.
La propriété TagString est utilisée pour stocker le chemin complet vers le dossier ou fichier représenté par cet élément.
C'est globalement assez simple à faire quand on a une vision de l'enchainement possible des écrans et du découpage à appliquer pour que la liste s'autogénère. Avoir des notions de récursivité, même si ce n'est pas codé tel quel ici, est un plus non négligeable pour se lancer.
Le code fournit est pour un projet FireMonkey mais vous pouvez reproduire le même fonctionnement sur une TListView (ou autre composant) VCL.
Pour créer la version avec le cadre FireMonkey il a suffit de copier/coller les éléments nécessaires du premier projet et déclarer quelques méhodes utiles à l'alimentation de la zone concernée. Une fois fait on utilise le TFrame personnalisé en le posant sur une fiche pour obtenir un sélecteur "maison" de dossiers et fichiers.
L'avantage de cette façon de faire est qu'on peut facilement déboguer un projet "de base" sans avoir à passer par un référencement du cadre dans l'IDE. Une fois la version d'origine terminée, le passage au cadre par copier/coller est facile.
On peut même aller jusqu'à un composant visuel en suivant ces recommandations.
Je vous suggère de consulter le projet de boite de dialogue "à propos" pour voir les différences entre les composants (non visuels) VCL et FMX au niveau du référencement et du fonctionnement avant de vous lancer dans un composant visuel qui aura un état "dans le concepteur de fiches" et un état "dans un vrai projet".
Au passage, si vous tentez le coup, externalisez les images et paramétrez votre composant pour ne pas y mettre les visuels en dur ou passer proposez un style FireMonkey dans lequel vous mettriez des types d'élément de liste dont le StyleLookup serait modifié plutôt que d'en changer juste l'image associée.
