Populate ImageList at runtime

For some weird and wonderful reason, populating an image-list at runtime is not as straight-forward as I first imagined. If you want to create applications that loads resources on demand from disk (giving the user an option to change your graphics as well) then you really need to push stuff like images out of the main executable.

In my case I’m writing an IDE which is intended to compile with freepascal and Lazarus later on, so I try my best to avoid “Delphi centric” elements (read: components that only exist under Delphi), resource files and hard-coded data. Of which images are the number one enemy.

The problem

You would imagine that just loading a piece of graphics using TPicture, and then drawing it to the canvas of a bitmap – before inserting it into the imagelist, should be enough right? Well almost. The problem with good old TCanvas.draw() is that it could not care less about transparency information. Which is completely lost whenever you turn a TPicture.Graphic into a bitmap.

The solution, having messed around with this for at least 30 minutes, was simple: Use assign when moving the image from TPicture to TBitmap. That preserves the transparency information. Especially for PNG images which can also have an alpha map chunk.

And here is the result after having wasted 30 minutes trying different variations. The AddFromFile() function really should be included in TImageList. I cant imagine why this has not been included by Embarcadero. Either way, I have a clean and solid solution below:

No more “white block background”

 The code

Here is the snippet source-code. Simply add it to your toolbox of snippets, or convert to a normal function if you like the old syntax style better.

Note: Remember to set your imagelist to

• ColorDepth: cd32Bit
• DrawingStyle: dsTransparent
• Masked: False

class function TQTXIDETools.LoadImageIntoList(aFileName:String;
          aList:TImageList;
          out aImageIndex:Integer):Boolean;
var
  mImage:   TPicture;
  mBitmap:  TBitmap;
Begin
  result:=False;
  aImageIndex:=-1;
  if aList<>NIl then
  begin
    if FileExists(aFilename,true) then
    begin
      mImage:=TPicture.Create;
      try

        (* Attempt to load image file *)
        try
          mImage.LoadFromFile(aFilename);
        except
          on exception do;
        end;

        (* image successfully loaded? *)
        if (mImage.Width>0)
        and (mImage.Height>0) then
        begin
          (* Draw image to a bitmap *)
          mBitmap:=TBitmap.Create;
          try
            (* copy pixels + transparency info to bitmap *)
            mBitmap.Assign(mImage.Graphic);

            (* Add bitmap to image-list, return index *)
            aImageIndex:=aList.add(mBitmap,NIL);
            result:=true;
          finally
            mBitmap.Free;
          end;
        end;
      finally
        mImage.Free;
      end;
    end;
  end;
end;

Using the code

Using it is simplicity itself. Simply enter the form where you need images loaded, double-click on the “onCreate” event and call this procedure. You will ofcourse need to adapt the code to your own toolkit. I tend to isolate everything in classes, including paths, to make applications as modular and extendable as possible:

Procedure TfrmPreferences.setupImageList;
var
  mAccess:  TIDEAccessManager;
  mIndex: Integer;
Begin
  if ideAccess.getIDEAccess(mAccess) then
  Begin

    (* Load "add" glyph *)
    with mAccess.PathManager do
    if TQTXIDETools.LoadImageIntoList
    (getImagePath('add.png'),imageList1, mIndex) then
    self.acAddPath.ImageIndex:=mIndex;

    (* Load "delete" glyph *)
    with mAccess.PathManager do
    if TQTXIDETools.LoadImageIntoList
    (getImagePath('delete.png'),imageList1, mIndex) then
    self.acDelPath.ImageIndex:=mIndex;
  end;
end;