Usage (VCL)

Usage of the VCL component

Define component at design-time

The IconFontsImageList component is very easy to use.

Before using it, remember to install the WebFont that contains the icons to use. Look at those ones for example:

material-design-icons

segoe-ui-symbol-font

Drop the component into your Form or Datamodule, and define the size of the Icons in pixel, the FontName, the FontColor and the MaskColor.

Then fill the IconFontsItems collection with the characters used to build the Icons into the ImageList. If you don't specify FontName, FontColor, MaskColor the Icons will be generated using the default values of the IconFontsImageList. The IconName is optional but can help you reading the dfm, in version control operation or to obtain ImageIndex of the Icon by name.

You can do that also with * The Advanced Component Editor.

Notice that if you set True to StoreBitmap, then the Icons are stored directly into dfm so the component don't need to rebuild Icons from Collection definitions.

If you leave StoreBitmap* false, the dfm contains only Collection definitions.

  object IconFontsImageList: TIconFontsImageList
    IconFontItems = <
      item
        FontIconDec = 61445
        IconName = 'Account'
      end
      item
        FontIconDec = 61888
        FontColor = clMaroon
        IconName = 'Delete'
      end
      item
        FontIconDec = 61485
        IconName = 'Amazon'
      end
      item
        FontIconDec = 62127
        IconName = 'Google chrome'
      end
      item
        FontIconDec = 63375
        FontColor = clTeal
        IconName = 'Android head'
      end
      item
        FontIconDec = 64279
        IconName = 'File-replace'
      end
      item
        FontIconDec = 61462
        IconName = 'Account-search'
      end>
    FontName = 'Material Design Icons'
    FontColor = clBlack
    MaskColor = clBtnFace
    Size = 32
    OnFontMissing = IconFontsImageListFontMissing
    Left = 368
    Top = 304
  end

Notice than the "Delete" and the "Android Head" Icons uses a specific color.

In the Demo supplied you can see the features in action...

Discover the component properties and methods here

*StoreBitmap is available only from Delphi 10.3 version: in previous versions the component always stores the Bitmap into dfm.