Editeur de liste d'images (FireMonkey)
Sommaire
Remonter à Editeurs de propriétés - Index
Utilisez l'éditeur de liste d'images à la conception pour ajouter des bitmaps et des icônes à une liste d'images.
Vous pouvez regarder la vidéo expliquant comment utiliser l'éditeur de liste d'images pour créer et modifier des listes d'images (EN).
Ouverture de l'éditeur de liste d'images
- Cherchez un objet TImageList dans le Concepteur de fiches ou la vue Structure.
- Effectuez l'une des actions suivantes :
- Double-cliquez sur l'objet TImageList.
- Cliquez avec le bouton droit sur l'objet TImageList et sélectionnez Editeur de liste d'images dans le menu contextuel.
-
- L'éditeur de liste d'images s'ouvre pour modifier l'objet TImageList sélectionné.
Vous pouvez utiliser l'exemple ImageList pour tester toutes les fonctions et fonctionnalités présentées dans cette rubrique.
Volet Liste d'images
Le volet Liste d'images présente un aperçu de toutes les images de la collection Destination de la liste d'images en cours. Les numéros situés au-dessus des aperçus d'images indiquent les index (les positions), en partant de zéro, des images au sein de la liste d'images. Vous pouvez déplacer un aperçu d'image à une nouvelle position pour changer la position de l'image dans la collection Destination de la liste d'images.
Sélectionnez un aperçu d'image pour afficher l'image dans le volet Image sélectionnée.
Le volet Liste d'images fournit les commandes suivantes qui peuvent être activées en utilisant des boutons, icônes d'outils et commandes du menu contextuel.
Commande | Conseil | Description |
---|---|---|
Ajouter | Ajouter des images du fichier dans la liste d'images (Ctrl+O )
|
Ouvre la boîte de dialogue Ajouter des images qui vous permet de sélectionner une image à ajouter dans la liste d'images. Vous pouvez effectuer une sélection parmi des formats de fichier graphique tels que La boîte de dialogue invitant à taper le nom du nouvel élément source s'ouvre ; par défaut, elle affiche le nom du fichier sélectionné. Si la taille d'une image à ajouter est un multiple de la largeur et de la hauteur spécifiées, un message vous demande si l'éditeur de liste d'images doit diviser l'image en plusieurs images. Cela est particulièrement utile pour les bitmaps de la barre d'outils qui sont généralement composés de plusieurs petites images affichées dans un ordre précis et stockées sous la forme d'un bitmap plus grand. L'image ajoutée apparaît en surbrillance dans la liste d'aperçus d'images du volet Liste d'images et s'affiche dans le volet Image sélectionnée. Notez que l'image est ajoutée dans la collection Source et s'affiche dans le volet Sources des images. La boîte de dialogue Ajouter des images vous permet de sélectionner et d'ajouter plusieurs images à la fois. Vous pouvez ajouter plusieurs fichiers ayant des noms correspondant au masque suivant :
|
Supprimer | Supprimer l'élément sélectionné de la liste d'images |
Retire l'image sélectionnée du volet Liste d'images (à partir des images dans la collection Destination). |
Exporter | Exporte la liste d'images dans un fichier |
Ouvre la boîte de dialogue Exporter des images qui vous permet d'enregistrer la liste d'images en cours dans un fichier. Vous pouvez effectuer une sélection parmi des formats de fichier graphique tels que |
Largeur Hauteur |
Les valeurs des champs Largeur et Hauteur sont utilisées lors les commandes Ajouter et Exporter (voir la description de ces commandes). | |
![]() Nouvelle image |
Ajouter une nouvelle image à la liste d'images |
Ajoute une image sélectionnée dans les sources des images ou dans une couche sélectionnée dans l'image sélectionnée. |
Volet Image sélectionnée
Le volet Image sélectionnée présente des informations détaillées sur l'image de destination sélectionnée dans le volet Liste d'images. (Voir TCustomDestinationItem.Layers.)
Pour afficher une autre image, cliquez sur un autre aperçu d'image dans le volet Liste d'images.
Le volet Image sélectionnée fournit les commandes suivantes qui peuvent être activées en utilisant des boutons, icônes d'outils et commandes du menu contextuel.
Commande | Conseil | Description |
---|---|---|
![]() Nouvelle couche |
Ajouter une nouvelle couche dans l'image sélectionnée |
Ajoute une nouvelle couche dans le volet Image sélectionnée. (Voir TLayer.) |
![]() Supprimer la couche |
Supprimer la couche sélectionnée de l'image sélectionnée |
Supprime la couche sélectionnée du volet Image sélectionnée. |
![]() ![]() |
Déplacer vers le haut la couche sélectionnée dans l'image sélectionnée Déplacer vers le bas la couche sélectionnée dans l'image sélectionnée |
Avec ces flèches, vous pouvez changer l'ordre des couches. |
Afficher l'éditeur |
La sélection de la commande Afficher l'éditeur (à partir du menu contextuel) ou un double-clic sur une image a pour effet d'activer l'éditeur MultiResBitmap, dans lequel vous pouvez modifier le bitmap multi-résolution dans la couche sélectionnée. |
Le volet Image sélectionnée est utilisé pour former des images utilisées dans la liste d'images. Chaque image est une somme de sous-images placées dans les couches, une sous-image dans chaque couche. Chaque sous-image est un bitmap multi-résolution. Vous pouvez manipuler les couches d'images. Le volet Image sélectionnée présente les différentes couches. Chaque couche affiche un bitmap multi-résolution. Double-cliquer sur un bitmap multi-résolution active l'éditeur MultiResBitmap, dans lequel vous pouvez modifier le bitmap multi-résolution.
Chaque couche est affichée dans un volet qui présente la sous-image et les propriétés suivantes :
- Le bouton de liste Nom d'image où vous pouvez sélectionner le nom du bitmap multi-résolution à utiliser dans cette couche.
- Les paramètres Gauche, Haut, Largeur et Hauteur du rectangle (pour l'échelle 1) utilisés pour dessiner le bitmap multi-résolution de cette couche. Tous ces rectangles s'intersectent avec le rectangle d'image résultant. Les bitmaps multi-résolution de toutes les couches sont dessinés dans les rectangles correspondants en écrasant les parties de recouvrement des bitmaps multi-résolution des couches inférieures.
Si un nom spécifié n'existe pas ou si le rectangle spécifié ne s'intersecte pas avec le rectangle de l'image, rien n'est alors dessiné et aucune exception n'est déclenchée. Vous pouvez lors de l'exécution définir l'image appropriée, et les images de tous les contrôles seront automatiquement mises à jour en utilisant cette image.
Typiquement, chaque image contient une seule couche. Toutefois, vous souhaiterez dans certains cas utiliser plusieurs couches pour former une image. Par exemple, il peut être pratique d'utiliser une couche distincte contenant une image représentant 'un texte barré' ou une 'loupe'. Cette couche peut alors être placée sur des couches contenant d'autres images ; par exemple, sur une couche contenant une 'liste d'images' ou une 'enveloppe'. Les deux couches peuvent alors former une image combinée, telle qu'une image 'liste d'images barrée' ou 'loupe sur enveloppe'.
La figure suivante illustre l'utilisation de deux couches pour former une image Liste d'images barrée :
L'utilisation de produit l'image
Comparez l'image Liste d'images barrée à l'image obtenue par dislocation du rectangle de la couche supérieure, contenant l'image 'Texte barré', avec Gauche = 5
et Haut = 6
.
Cette dislocation est présentée dans la figure suivante :
Si le rectangle affiché dans le volet Couche couvre (montre) uniquement la partie du bitmap multi-résolution entier utilisée par la couche, ce rectangle peut alors être déplacé sur l'image entière. Pour illustrer cette fonctionnalité, chargez une grande image dans une couche.
Par exemple, chargez la grande image My 1 avec Largeur = 80
et Hauteur = 32
:
Si vous définissez Largeur = 16
et Hauteur = 16
pour réduire la taille du rectangle affiché dans le volet Couche, ce dernier ressemble à ceci :
Pour illustrer ce qui se produit, double-cliquez sur un bitmap multi-résolution dans un volet Couche pour activer l'éditeur MultiResBitmap. L'éditeur MultiResBitmap présente le bitmap multi-résolution entier. Dans ce bitmap, vous apercevez le rectangle sélectionné qui correspond au rectangle affiché dans la couche, et voyez que ce rectangle montre la même image que dans la couche :
A l'aide de la souris, vous pouvez déplacer et redimensionner le rectangle sélectionné comme une fenêtre d'affichage sur le bitmap entier. Voyez quelle partie du bitmap apparaît dans le volet Couche. Si vous placez le pointeur de la souris dans le volet Couche, vous pouvez alors déplacer le rectangle affiché en utilisant 'CTRL + molette de la souris' ou en cliquant sur les flèches gauche et droite dans la partie supérieure du volet Couche.
Volet Sources des images
Le volet Sources des images affiche toutes les images dans la collection Source de la liste d'images en cours. Ces images sont utilisées pour construire des images dans la collection Destination (affichées dans le volet Liste d'images).
Notez que lorsque vous supprimez un aperçu d'image de la collection Liste d'images, l'image source n'est pas supprimée dans la collection Sources des images. Utilisez le bouton d'outil Supprimer la source pour supprimer un élément de la collection Sources des images.
Icône | Conseil | Description |
---|---|---|
![]() Nouvelle source |
Ajouter un nouvel élément dans Sources des images |
Ce bouton montre le message demandant le nom du nouvel élément source puis active l'éditeur MultiResBitmap. A l'aide de l'éditeur MultiResBitmap, vous pouvez ajouter plusieurs images optimisées pour différentes échelles. Lors de l'exécution, une application sélectionne l'image ayant l'échelle la plus appropriée. |
![]() Supprimer la source |
Supprimer l'élément sélectionné de Sources des images |
Supprime l'élément sélectionné de la collection Sources. |
![]() ![]() |
Déplacer vers le haut l'élément sélectionné dans Sources des images Déplacer vers le bas l'élément sélectionné dans Sources des images |
A l'aide de ces flèches, vous pouvez déplacer vers le haut et vers le bas les images source, en changeant leur ordre. Vous pouvez utiliser ces flèches à votre convenance. |
![]() Effacer |
Effacer les informations de conception |
Les noms des fichiers à partir desquels les images source ont été chargées, les tailles utilisateur des images et les couleurs transparentes sont uniquement utilisés à la conception. Toutefois, ces paramètres sont stockés par défaut dans le fichier fmx. L'icône |
Afficher l'éditeur |
La sélection de la commande Afficher l'éditeur (à partir du menu contextuel) ou un double-clic sur une image a pour effet d'activer l'éditeur MultiResBitmap, dans lequel vous pouvez modifier le bitmap multi-résolution sélectionné. (Voir TLayer.MultiResBitmap.) |
Boutons
L'éditeur de liste d'images contient les boutons suivants.
Bouton | Description |
---|---|
OK |
Applique vos modifications et ferme l'éditeur. ( |
Appliquer |
Applique vos modifications sans fermer l'éditeur. |
Aide |
Affiche cette page. |
Annuler |
Ferme l'éditeur sans appliquer les modifications. |
Voir aussi
- Vidéo expliquant comment utiliser l'éditeur de liste d'images pour créer et modifier des listes d'images (EN) Présentation des fonctionnalités avancées et non triviales de l'éditeur de listes d'images.
- Utilisation des listes d'images de TImageList en tant que collections centralisées d'images
- Vidéo présentant les étapes typiques nécessaires à la création d'une nouvelle liste d'images dans votre projet FireMonkey (EN)