25 июл. 2013 г.

Windows Ribbon Framework. Команды

Перевод. Оригинал Specifying Ribbon Commands

В Windows Ribbon Framework представление и логика строго разделены подобно тому, как в Delphi разделены элементы управления (представление) и действия (классы TActionList и TAction). Более того, фреймворк требует, чтобы каждому действию, доступному пользователю, соответствовала команда.


Как и TAction в Delphi, команды могут быть сопоставлены нескольким элементам управления "ленты". Например, в WordPad команда "Вставить" (Paste) используется в нескольких местах:



  • в "ленте", при нажатии верхней части кнопки Вставить (Paste);
  • в "ленте", в всплывающем меню при нажатии нижней части кнопки Вставить (Paste);
  • в всплывающем меню при нажатии правой клавиши "мыши" на документе.

Это позволяет использовать единожды объявленную команду в нескольких местах. Однако в отличие от TAction в Delphi, вы не можете напрямую указать заголовок или изображение для элемента управления "ленты". Все заголовки, изображения, всплывающие подсказки указываются на уровне команд. Только после связывания команды с тем или иным элементом управления заголовки и изображения выводятся на "ленту".

Добавление и удаление команд


Используя панель инструментов Commands (Команды) в Ribbon Designer, вы можете добавлять и удалять команды, а также менять их порядок следования в списке:


Также вы можете использовать соответствующие команды меню при  нажатии правой клавиши "мыши" по списку команд или "горячие" клавиши (Shift+Ctrl+Ins, Ctrl+Del, Ctrl+Up и Ctrl+Down). Если вы удаляете команду, которая связана с одним или несколькими элементами управления "ленты", Ribbon Designer предупредит вас об этом. Удаление такой команды сделает использование связанных с ней элементов управления невозможным.

Свойства команд


Каждая команда обладает следующими свойствами:


  • Name (имя): каждая команда должна иметь уникальное имя-идентификатор. Имя впоследствии используется при связывании команды с элементами управления. Если не указано свойство Symbol, имя будет использовано в качестве имени константы, соответствующей команде, в вашем Delphi-приложении.
  • Caption (заголовок): заголовок команды, который будет использован в качестве заголовка связанного с командой элемента управления. Для заголовка вы можете указать дополнительные свойства ID и Symbol, где ID - числовой идентификатор строки заголовка в файле ресурсов, а Symbol - имя константы, хранящей значения этого идентификатора. В Delphi-приложении эти свойства используются редко, поэтому вы можете оставить их пустыми.
  • Description (описание): описание команды. Свойство используется только в том случае, если команда используется в правой части меню приложения (на рисунке, приведенном ниже, выделенная команда справа имеет заголовок "Rich Text Document" и описание "Save the document in the Rich Text Format."):

  • Tooltip Title (заголовок подсказки): заголовок всплывающей подсказки, которая выводится при удержании пользователем указателя "мыши" над командой. Заголовок отрисовывается жирным шрифтом в верхней части всплывающей подсказки:
  • Tooltip Description (подсказка): текст подсказки, который вводится под ее заголовком.
  • Keytip: клавиша или сочетание клавиш, используемые для обращения к команде при нажатой клавише Alt. Фреймворк автоматически назначает значения этого свойства, однако если вы хотите получить больший контроль над использованием "горячих" клавиш, то вы должны указать свое значение. Значение не ограничивается одной клавишей и может содержать комбинацию клавиш.


  • Symbol: имя константы, соответствующей команде, в Delphi-приложении. Если значение свойство не определено, используется значение свойства Name.
  • Comment (комментарий): комментарий, который будет добавлен перед описанием константы, соответствующей команде, в код Delphi-приложения. Более ни для каких целей это свойство не используется.

Изображения


Для каждой команды вы должны указать четыре набора изображений: иконки для больших и малых кнопок в обычном режиме и иконки для больших же и малых кнопок в высоко-контрастном  режиме.

Каждое изображение должно быть 32-битным BMP с альфа-каналом. Альфа-канал применяется в случаях, когда необходимо изображение сделать частично прозрачным, например, обвести края изображения или добавить тень.  К сожалению, некоторые графические редакторы не умеют сохранять изображения в указанный формат, но, к счастью, Ribbon Designer позволяет использовать изображения в формате PNG с альфа-каналом. Большинство графических редакторов поддерживают этот формат. Ribbon Designer самостоятельно конвертирует файлы PNG  в 32-битные BMP-файлы.

Для каждой команды должны быть указаны, как минимум, одно маленькое (16х16) и одно большое изображение (32х32). Эти изображения используются, когда приложение выполняется при стандартном разрешении экрана 96 dpi. Увеличение разрешения экрана пользователем приводят к размытию и снижению качества изображения:

96 dpi144 dpi (150%)

Чтобы сохранить качество изображений при изменении разрешения экрана, необходимо указать для каждой команды изображения для разрешений 96 dpi (по умолчанию), 120 dpi (125%), 144 dpi (150%) и 192 dpi (200%). Размеры изображений для каждого указанного разрешения должны быть следующими:

DPIМаленькое изображениеБольшое изображение
96 dpi16x1632x32
120 dpi20x2040x40
144 dpi24x2448x48
192 dpi32x3264x64

Шаблон WordPad включает в себя изображения для всех этих разрешений. В результате изображения на "ленте" имеют лучше качество при высоком разрешении:

БылоСтало

Важно: изображения с высоким разрешением отображаются на "ленте" только если ваше приложение подготовлено к работе с таким разрешением (по умолчанию Delphi-приложения не готовы к такой работе). Для этого необходимо внести изменения в манифест приложения. Самый простой способ это сделать:

  1. В среде разработки откройте диалог настроек проекта ("Project | Options").
  2. Выберите раздел Application.
  3. Отключите "флажок" "Enable runtime themes". Не бойтесь, приложение по-прежнему будет использовать темы оформления Windows.
  4. Выберите "Project | Add to project...".
  5. В диалоге открытия файла укажите тип файла "Resource file (*.rc)".
  6. Укажите файл "UIRibbon.rc" из каталога Lib библиотеки.

Теперь мы будем использовать манифест из библиотеки, и все изображения будут отображаться на "ленте" корректно.

Более подробная информация по использованию изображений при работе с фреймворком доступна на MSDN.

Настраиваем изображения


Для настройки каждого набора изображений в Ribbon Designer служит таблица


Здесь вы можете добавлять и удалять изображения, а также изменять их параметры. Чтобы добавить изображение, вы должны указать файл формата 32-бит BMP или PNG с альфа-каналом. Файлы PNG Ribbon Designer автоматически приведет к формату 32-бит BMP. При этом файлы, размещенные вне каталога проекта "ленты", будут скопированы в подкаталог "Res" каталога проекта.

Каждое изображение имеет следующие свойства, которые вы можете изменить, дважды кликнув левой клавишей "мыши" по изображению или нажав на кнопку "Edit" на панели инструментов:


  • Image File: относительный путь к файлу изображения в каталоге проекта "ленты".
  • Minimum target resolution: одно из четырех описанных выше разрешений экрана или "auto" для разрешения по умолчанию.
  • ID: числовой идентификатор изображения в файле ресурсов. Можете оставлять его равным 0.
  • Symbol: имя константы в коде вашего Delphi-приложения, которое будет хранить идентификатор ресурса изображения.
Добавление нескольких изображений для различных разрешений может быть несколько утомительным, поэтому кнопка "Add" (Добавить) имеет всплывающее меню, которое позволяет добавить несколько изображений за один раз:


В этом случае также откроется диалог открытия файлов, но в этот раз вы можете выбрать несколько файлов изображений. Маленькие изображения должны иметь размеры 16х16, 20х20, 24х24 и 32х32, а большие - 32х32, 40х40, 48х48 и 64х64. Ribbon Designer автоматически выставит свойство Minimum target resolution для каждого изображения, основываясь на его размерах.

И напоследок...


Закончить же этот раздел руководства мы хотели бы, дав пару советов:

  • Вы должны создавать команды для всего, что будет размещено на "ленте": для вкладок, групп элементов управления (подобных группе Clipboard (Буфер обмена) на рисунке ниже), элементов управления (кнопок, пунктов меню, списков и т.д.), для меню приложения и его разделов (недавно открытые документы и т.д.), для панели быстрого доступа, для кнопки вызова справки в правом верхнем углу "ленты", для элементов управления в контекстных панелях инструментов и меню и т.д.
  • Также вы должны указать маленькие изображения для групп элементов управления. Эти изображения будут использованы когда пользователь изменит размер "ленты" настолько, что элементы управления в группе будут "свернуты" в всплывающие панели инструментов:

Комментариев нет:

Отправить комментарий

Примечание. Отправлять комментарии могут только участники этого блога.