Windows Ribbon Framework. Работа с галереями

Перевод. Оригинал Working with Galleries

В "лентах", использующихся в большинстве современных версий Microsoft Office, галереи применяют для реализации более понятного пользователю выбора элемента из списка. Приложение WordPad (и наше тестовое приложение TextPad) содержит галерею стилей списка:

TUICommandCollection

Галереи представлены объектом TUICommandCollection (также как поля со списком и панель быстрого доступа). Ниже приведены свойства этого класса:

• Categories: элементы галереи могут быть организованы по категориям. Если вы хотите использовать категории, заполните эту коллекцию элементами типа TUIGalleryCollectionItem (или его наследника). Для каждой категории необходимо указать значения свойств:
  
  
  • LabelText: заголовок категории.
  • CategoryId: числовой идентификатор категории. Все элементы галереи с аналогичным  значением CategoryId попадут в категорию.
  
  
• Items: коллекция элементов галереи. Еще раз, элементы галереи должны быть объектами типа TUIGalleryCollectionItem (или его наследника) и обладать следующими свойствами:
  
  
  • LabelText: заголовок элемента (если заголовки отображаются) или всплывающая подсказка, если пользователь удерживает указатель "мыши" над элементом.
  • CategoryId: идентификатор категории, в которую должен быть помещен элемент. Значение -1 свойства указывает, что категории не используются, или элемент не привязан к какой-либо категории.
  • Image: изображение элемента (или nil, если изображение не используется).
  • Command: если галерея должна содержать команды, вам необходимо создать объект TUICommand и присвоить его этому свойству.
  
  
• SelectedItem: индекс выбранного элемента галереи. Для галерей со split-кнопкой значение -1 этого свойства указывает на то, что была нажата верхняя часть кнопки. В случае поля со списком значение -1 означает, что не был выбран ни один элемент из списка или что в поле пользователем был введен текст.
• Text (только для полей со списком): текст в поле.
• RepresentativeString (только для полей со списком): эта строка используется фреймворком для получения ширины поля. Строка нигде не отображается и может содержать любые символы. Используется только для расчета ширины элемента управления: чем длиннее строка, тем он шире.
• Checked (только для галерей со split-кнопкой): состояние кнопки.

Кроме того, класс содержит свойство-событие OnSelect, возникающее при выборе пользователем элемента галереи.

Ресурсы галереи

Шаблон WordPad (и пример приложения TextPad) содержит изображения для элементов галереи. Вы можете найти их в подкаталоге "Ribbon\Res\Galleries". В шаблоне представлены несколько версий изображений для нескольких разрешений экрана:

ListNumbered_096.bmp	ListNumbered_120.bmp	ListNumbered_144.bmp

Версия "_096" будет использоваться для стандартного разрешения (96 dpi). Версия "_120" будет применяться для разрешений 97 - 120 dpi. И версия "_144" предназначена для использования при разрешениях, больших 120 dpi.

Необходимо создать файл ресурсов, в который добавить эти изображения. В примере TextPad имеется такой файл (Galleries.rc):

LIST_NONE_096 BITMAP "Ribbon\\Res\\Galleries\\ListNone_096.bmp"
LIST_NONE_120 BITMAP "Ribbon\\Res\\Galleries\\ListNone_120.bmp"
LIST_NONE_144 BITMAP "Ribbon\\Res\\Galleries\\ListNone_144.bmp"
LIST_BULLETS_096 BITMAP "Ribbon\\Res\\Galleries\\ListBullets_096.bmp"
LIST_BULLETS_120 BITMAP "Ribbon\\Res\\Galleries\\ListBullets_120.bmp"
LIST_BULLETS_144 BITMAP "Ribbon\\Res\\Galleries\\ListBullets_144.bmp"
LIST_NUMBERED_096 BITMAP "Ribbon\\Res\\Galleries\\ListNumbered_096.bmp"
LIST_NUMBERED_120 BITMAP "Ribbon\\Res\\Galleries\\ListNumbered_120.bmp"
LIST_NUMBERED_144 BITMAP "Ribbon\\Res\\Galleries\\ListNumbered_144.bmp"
LIST_ROMANLOWER_096 BITMAP "Ribbon\\Res\\Galleries\\ListRomanLower_096.bmp"
LIST_ROMANLOWER_120 BITMAP "Ribbon\\Res\\Galleries\\ListRomanLower_120.bmp"
LIST_ROMANLOWER_144 BITMAP "Ribbon\\Res\\Galleries\\ListRomanLower_144.bmp"
LIST_ROMANUPPER_096 BITMAP "Ribbon\\Res\\Galleries\\ListRomanUpper_096.bmp"
LIST_ROMANUPPER_120 BITMAP "Ribbon\\Res\\Galleries\\ListRomanUpper_120.bmp"
LIST_ROMANUPPER_144 BITMAP "Ribbon\\Res\\Galleries\\ListRomanUpper_144.bmp"
LIST_LOWERCASE_096 BITMAP "Ribbon\\Res\\Galleries\\ListLowerCase_096.bmp"
LIST_LOWERCASE_120 BITMAP "Ribbon\\Res\\Galleries\\ListLowerCase_120.bmp"
LIST_LOWERCASE_144 BITMAP "Ribbon\\Res\\Galleries\\ListLowerCase_144.bmp"
LIST_UPPERCASE_096 BITMAP "Ribbon\\Res\\Galleries\\ListUpperCase_096.bmp"
LIST_UPPERCASE_120 BITMAP "Ribbon\\Res\\Galleries\\ListUpperCase_120.bmp"
LIST_UPPERCASE_144 BITMAP "Ribbon\\Res\\Galleries\\ListUpperCase_144.bmp"

Вы должны добавить файл ресурсов в ваш Delphi-проект (используя "Project | Add To Project..."). Однако, когда вы попробуете собрать проект, вы получите сообщение об ошибке:

[BRCC32 Error] Galleries.rc(1): Invalid bitmap format

Это связано с тем, что компилятор ресурсов, используемый по умолчанию в среде разработки, не поддерживает 32-битные файлы BMP. К счастью, если вы укажете среде разработки использовать компилятор ресурсов от Microsoft, проблема исчезнет:

• Выберите "Project | Options...".
• Выберите узел "Resource Compiler".
• Для "Resource compiler to use" установите значение "Windows SDK Resource Compiler".

Сборка проекта пройдет без проблем.

Заполнение галереи

Теперь, когда у нас имеются ресурсы изображений, заполним галерею стилей списков:

procedure TFormMain.PopulateListGallery;
const
  RESOURCE_NAMES: array [0..6] of String = ('NONE', 'BULLETS', 'NUMBERED',
    'LOWERCASE', 'UPPERCASE', 'ROMANLOWER', 'ROMANUPPER');
  LABELS: array [0..6] of String = ('None', 'Bullet', 'Numbering',
    'Alphabet - Lower case', 'Alphabet - Upper case',
    'Roman Numeral - Lower case', 'Roman Numeral - Upper case');
var
  I, Dpi: Integer;
  ResourceName: String;
  Item: TUIGalleryCollectionItem;
begin
  Dpi := Screen.PixelsPerInch;
  if (Dpi> 120) then
    Dpi := 144
  else if (Dpi > 96) then
    Dpi := 120
  else
    Dpi := 96;

  for I := 0 to 6 do
  begin
    ResourceName := Format('LIST_%s_%.3d', [RESOURCE_NAMES[I], Dpi]);
    Item := TUIGalleryCollectionItem.Create;
    Item.LabelText := LABELS[I];
    Item.Image := TUIImage.Create(HInstance, ResourceName);
    FCmdList.Items.Add(Item);
  end;
end;

Мы используем Screen.PixelsPerInch для получения разрешения экрана, чтобы, в свою очередь, определить имя соответствующего разрешению ресурса изображения (например, изображение "LIST_BULLETS_120" будет загружено, если разрешение экрана будет от 96 до 120 dpi).

Как вы видите, мы для каждого элемента галереи создаем объект TUIGalleryCollectionItem. Чтобы назначить значение свойства Image элемента, мы создаем объект TUIImage, передавая в его конструктор дескриптор исполняемого файла и имя ресурса. Обращаем ваше внимание, что свойство Image имеет тип IUIImage (который реализован в TUIImage). Как результат, не нужно заботиться об освобождении памяти, занятой изображением.

Коллекция, к тому же, является владельцем добавленных в нее элементов, поэтому не нужно заботиться об освобождении памяти, занятой этими элементами. 

Удачи!

Этот раздел завершает руководство по Windows Ribbon Framework for Delphi. Изучите пример TextPad, чтобы разобраться в деталях реализации. Конечно этот пример не является полным клоном WordPad, но зато он дает представление о том, как используется "лента".

Начинайте разрабатывать собственные приложения. Удачи!

---

Примечание переводчика. В дополнение к этому руководству можно посоветовать статью Владислава Баженова "Ribbon UI как он есть. Работа с Windows Ribbon Framework в Delphi 2010 — XE2".