How to custom draw a ListView using the OnDrawItem event when the ViewStyle is vsIcon

Question

How can I custom draw a ListView to make it look like this?

Welcome to SO! Check this out [ask]. After you have carefully read it, check [Embarcadero's help resource](http://docs.embarcadero.com/products/rad_studio/delphiAndcpp2009/HelpUpdate2/EN/html/delphivclwin32/ComCtrls_TCustomListView_OnDrawItem.html). As a practice example I can offer you both [this](https://stackoverflow.com/questions/5519742/drawing-a-checkbox-in-a-tlistview) and [this](https://stackoverflow.com/questions/52116742/center-subitem-images-in-a-tlistview/52119415) answers. These examples will give you a way how to do it. — Josef Švejk, Sep 16 '18 at 11:03
in google or embarcadero forum this dont code works when the property is ViewStyle := vsicon ....... All Topics in Google or Embarcadero ViewStyle: = vsreport or others ........ I want to do it with ViewStyle: = vsicon so I created this help topic. — Matrix, Sep 17 '18 at 07:05

score 1 · Accepted Answer · answered Sep 17 '18 at 15:40

You can draw content of TListView in custom way very eae only if you will read help resources carefully.
Image below is a result of code running. The code attached after this picture.

Component ImageList1 that is attached to TListView has both width and height set to 24 pixels

This one picture is the same TListView but without attached ImageList.

Orange rectangle is a selected item

Now go to the code.

procedure TForm1.ListView1AdvancedCustomDrawItem(Sender: TCustomListView; Item: TListItem; State: TCustomDrawState; Stage: TCustomDrawStage; var DefaultDraw: Boolean);
var
  Bmp: TBitmap;
  Image: TBitmap;
  R: TRect;
  CenterH: Integer;
  CenterV: Integer;
  ImageIndex: Integer;
begin
  R := Item.DisplayRect(drBounds);
  Bmp := TBitmap.Create;
  try
    Image := TBitmap.Create;
    try
      Bmp.SetSize(R.Width, R.Height);

      // Make fill for item
      if Item.Selected then
        Bmp.Canvas.Brush.Color := clWebOrange
      else
        Bmp.Canvas.Brush.Color := clMoneyGreen;
      Bmp.Canvas.FillRect(Bmp.Canvas.ClipRect);

      // Output image associated with current item
      if Assigned(TListView(Sender).LargeImages) then
        begin
          TListView(Sender).LargeImages.GetBitmap(Item.ImageIndex, Image);
          CenterH := (R.Width - Image.Width) div 2;
          CenterV := (R.Height - Image.Height) div 2;
          Bmp.Canvas.Draw(CenterH, CenterV, Image);
        end;

      // Draw ready item's image onto sender's canvas
      Sender.Canvas.Draw(R.Left, R.Top, Bmp);
    finally
      Image.Free;
    end;
  finally
    Bmp.Free;
  end;
end;

You must be informed that size of each item of TListView in vsIcon ViewMode depend on the size of TImageList attached to control via LargeImages property. Than large image - than large item in TListView.

How to custom draw a ListView using the OnDrawItem event when the ViewStyle is vsIcon

1 Answers1

Linked