Как поместить картинки в ComboBox

Delphi , Компоненты и Классы , Списки

Делается это при помощи стиля ownerdraw, который присутствует в TComboBox. Нас интересуют два свойства этого стиля:

• csOwnerDrawFixed - используется, если все битмапы имеют одинаковую высоту
• csOwnerDrawVariable - используется для битмапов с разной высотой

После того как стиль будет установлен на один из вышеперечисленных, то можно воспользоваться событием onDrawItem. Это событие возникает каждый раз, когда приложению необходимо нарисовать пункт в выпадающем списке (combo box). Событие определяется следующим образом:

procedure TForm1.ComboBox1DrawItem(Control: TWinControl; index: Integer;
Rect: TRect; State: TOwnerDrawState)

Control

Элемент управления, содержащий пункт списка

Index

Номер элемента списка

Rect

прямоугольник, в котором будет отображён элемент списка

State

Состояние элемента: выбран, заблокирован или имеет фокус (odSelected, OdDisabled или OdFocused)

Если выпадающему списку был присвоен стиль csOwnerDrawFixed, то всё, что надо сделать, это написать процедуру, которая будет рисовать битмап и текст в событии onDrawItem.

Для выпадающего списка со стилем csOwnerDrawVariable необходимо пройти ещё одну дополнительную стадию. Заключается эта стадия в создании обработчика для события onMeasureItem. Это событие вызывается перед DrawItem, для того, чтобы Вы могли установить фактическую высоту для каждого элемента списка. Вот его определение:

procedure TForm1.ComboBox1MeasureItem(Control: TWinControl; index: Integer; 
var Height: Integer);

Control

Элемент управления, содержащий пункт списка

Index

Номер элемента списка

Height

Собственно высота элемента списка с номером Index

От теории к практике

Создайте новое приложение. Разместите на форме combobox и imagelist (если Вы используете delphi 1, то Вам прийдётся хранить битмапы каким-то другим способом). В Object Inspector установите следующие свойства:

ComboBox1 -> Style -> csOwnerDrawFixed -> Чтобы мы могли контролировать рисованием элементов.

ComboBox1 -> Items -> Здесь можно добавить любые строки, которые будут отображаться рядом с битмапами. Чтобы каждый элемент имел описание к картинке.

ImageList1 -> Используйте редактор списка картинок (ImageList Editor) Добавьте битмапы в том порядке, в котором они будут отображаться в combobox, а так же проверьте, чтобы они были одного размера. Прозрачный цвет можно установить здесь же. Это картинки, которые появятся в выпадающем списке

В заключение необходимо добавить следующий код для события onDrawItem:

procedure TForm1.ComboBox1DrawItem(Control: TWinControl; index:Integer;
Rect: TRect; State: TOwnerDrawState);
begin
  (* Заполняем прямоугольник *)
  combobox1.canvas.fillrect(rect);
  (* Рисуем сам битмап *)
  imagelist1.Draw(comboBox1.Canvas,rect.left,rect.top,index);
  (* Пишем текст после картинки *)
  combobox1.canvas.textout(rect.left+imagelist1.width+2,rect.top,
  combobox1.items[index]);
end;

Поместить картинки в ComboBox можно при помощи стиля ownerdraw, установленного на TComboBox, с помощью которого можно рисовать каждый пункт списка самостоятельно.

Комментарии и вопросы

Получайте свежие новости и обновления по Object Pascal, Delphi и Lazarus прямо в свой смартфон. Подпишитесь на наш Telegram-канал delphi_kansoftware и будьте в курсе последних тенденций в разработке под Linux, Windows, Android и iOS

:: Главная :: Списки ::