How to create images for WPImageList

Top  Previous  Next

To create bitmaps to be used with the TWPOImageList we recommend to use Affinity Designer (“Serif” and “Affinity” are both registered trademarks of Serif Europe Ltd)


We included a sample project to create contains 8*3 Icons (see folder IconProject)


In Affinity Designer  it is possible to create "symbols" which can be reused in the design. A change of the symbol will change all copies.




In the export personality we only export the "Icon" part- note that only that "slice" got a check.


Here we can specify multiple sizes to be exported at once.

Specify the width "w" of the required width of all icons in a row, i.e. for 32*32 pixel icons specify 8*32=256w

The name template should contain n the iconwidth, i.e. 32, at the end. This tells the WPImageList how to handle the bitmap.





Once you click on Export, multiple PNG files with correct names will be created. Since the file names include the size of the images, WPImageList is able to set the width and height property automatically when you load the file(s).


The PNG files can be loaded in one step after a double click on the WPImageList.


I hope this shows, how easy it is to use the WPImageList.


In contrast to regular ImageLists you do not have to worry about the order of the icons on each update or for each resolution. It will never change whenever you update the images and is the same for all resolutions.



Hint: You can use the create PNG files also with the TImageList of newer Delphi versions. Here you need to set the property ColorDepth to ccd32bit.



Create icons for a dark theme




Add an adjustment "curve" layer to the project. Create an inversion curve which converts black to white. Click on the option for the curve (lower right corner) and choose only black as source layer range.




To create normal icons disable this adjustment, for icons on black background activate it.