C++ Builder 製作自繪圖示列表框 (OwnerDraw ListBox 元件封裝)

原理

TListBox 的 Style 屬性提供三種風格：

• lbStandard：純文字。
• lbOwnerDrawFixed：固定項目高度自繪。
• lbOwnerDrawVariable：可變項目高度自繪。

自繪風格觸發兩個事件：

• OnMeasureItem：決定項目高度 (int &Height)。
• OnDrawItem：在 TRect &Rect 區域繪製，可用 Canvas 畫圖、寫字。

封裝為元件步驟

1. IDE 選 File → New → Component，祖先類別選 TCustomListBox，類別名 TImageListBox，生成單元骨架。
2. 在 .h 中新增屬性/欄位 (如 TImageList* Images、bool ShowImages 等)。
3. 重寫 CreateWnd 設定 Style = lbOwnerDrawFixed。
4. 實作 OnMeasureItem 回傳固定高度 (如 ImageHeight + 4)。
5. 實作 OnDrawItem：繪製背景、若 ShowImages 從 Images 取圖示繪製、繪製文字、處理選中/焦點狀態。
6. 安裝元件至元件庫，即可在設計時像用 TListBox 一樣拖放、設定 Images 屬性。

核心 DrawItem 邏輯示意

void __fastcall TImageListBox::DrawItem(..., int Index, TRect &Rect, TOwnerDrawState State)
{
    Canvas->FillRect(Rect); // 背景
    if (ShowImages && Images && Index < Images->Count) {
        int x = Rect.Left + 2;
        int y = Rect.Top + (Rect.Height() - Images->Height) / 2;
        Images->Draw(Canvas, x, y, Index);
    }
    // 文字區起始 X
    int txtX = ShowImages ? Rect.Left + Images->Width + 4 : Rect.Left + 2;
    Canvas->TextOut(txtX, Rect.Top + 2, Items->Strings[Index]);
    // 焦點框
    if (State.Contains(odFocused)) Canvas->DrawFocusRect(Rect);
}

封裝後可重複使用、設計時預覽、屬性編輯器支援，是元件開發的經典入門範例。