Image List Editor
Contents
Go Up to Property Editors Index
Use the ImageList Editor at design time to add bitmaps and icons to a TImageList component.
While working in the image list editor, you can click Apply to save your current work without exiting the editor, or click OK to save your changes and exit the dialog. Using the Apply button is especially useful because once you exit the dialog, you cannot make any more changes to the existing images.
To Display the ImageList Editor
- Select the TImageList object in either the Form Designer or the Structure View.
- Do either of the following:
- Double-click the TImageList object.
- Right-click the TImageList object and select ImageList Editor from the context menu.
Images
The Images pane shows preview images of all images in the current TImageList image list. Each image preview is displayed within a 24x24 area for easier viewing of multiple images. Numbers beneath image previews indicate zero-based positions of images within the image list. You can drag an image preview to its new position to change an image position in the image list.
Select an image preview to show the image in the Selected Image pane.
If you add an image (using the Add button) to the image list, you can - during the current invocation of the ImageList editor - alter properties of the selected image using the Transparent Color, Fill Color, and Options controls. However, once the ImageList editor is closed, these properties are fixed. If you select this image during new invocations of the ImageList editor, the Transparent Color, Fill Color, and Options controls are grayed and you cannot change any properties of the image.
Add
Opens the Add Images dialog box, that lets you select one or more images to add to the image list. The added image appears highlighted in the preview list. If you have added several images, their numbers obtain sequential values in the image list.
If a bitmap is larger than the image list width or height by even increments, a prompt appears asking whether the ImageList editor should divide the image into several images. This is useful for toolbar bitmaps, which are usually composed of several small images in a sequence and stored as one larger bitmap.
Replace
Opens the Add Images dialog box, that lets you select an image to replace the selected image.
Delete
Removes the selected images from the image list.
Clear
Removes all images from the image list.
Export
Opens the Export Images dialog box, which lets you to save the selected image to a .BMP file. This file contains the bitmap in its currently altered state, including any cropping or stretching.
Selected Image
The Selected Image pane displays the image currently selected in the Images pane. Click another image in the Images pane to display the other image.
Transparent Color
Use the Transparent Color drop-down to specify which color is used to create a mask for drawing the image transparently. The default transparent color is the color of the left-most pixel of the bitmap in the bottom line. You can also change the transparent color by clicking directly on a pixel in the selected image.
When an image has a transparent color, any pixels in the image of that color are not rendered in that color, but instead appear transparent, allowing whatever is behind the image to show through.
If the image is an icon, Transparent Color appears grayed and the transparent color is set to clNone. This is because icons are already masked.
Fill Color
Use the Fill Color drop-down to specify a color that is added around the edges of the selected image when it is smaller than the dimensions indicated by the Height and Width properties of the image list control.
This control is grayed if the selected image completely fills the dimensions specified by the image list (that is, if it is at least as big as the Height and Width properties). This control is also grayed for icon images, because icons act like masks with any outer boundaries transparent.
Options
Use the Options radio buttons to indicate how the image list should render the selected image if it does not fit exactly in the dimensions specified by the Height and Width properties of the image list. (These buttons are disabled for icons.)
| Option | Description |
|---|---|
| Crop | Displays the section of the image beginning at the top-left, extending the image list width and height towards the bottom-right. |
| Stretch | Causes the entire image to stretch so that it fits the image list width and height. |
| Center | Centers the image within the image list width and height. If the image width or height is larger than the image list width or height, the image may be clipped. |