Поделиться через

Указание ресурсов изображения ленты

В качестве полнофункциональной системы представления команд фреймворк Windows Ribbon разработан для обширной поддержки ресурсов изображений в интерфейсе пользователя ленты. Все графические ресурсы объявляются в разметке Ribbon или запрашиваются из хост-приложения Ribbon.

Для Windows 8 и более поздних версий framework Ribbon поддерживает следующие графические форматы: 32-разрядные файлы растрового изображения ARGB (BMP) и файлы сети PNG с прозрачностью.

Для Windows 7 и более ранних версий ресурсы изображений должны соответствовать стандартному формату графики BMP, используемому в Windows.

Заметка

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

 

Размеры изображений

Чтобы обеспечить большую гибкость макетов элементов управления ленты при изменении размера окна приложения, платформа ленты принимает и отрисовывает изображения в одном из двух размеров: больших или маленьких.

На следующих изображениях показано приложение ленты, которое поддерживает несколько размеров ленты с помощью гибких макетов элементов управления и замену больших изображений небольшими изображениями, где они доступны.

На следующем снимке экрана показана лента с большими изображениями для элементов управления "Масштаб".

снимок экрана с лентой, в которой используются большие изображения для элементов управления масштабированием.

На следующем снимке экрана показана та же лента, уменьшенная с использованием небольших изображений для элементов управления "Масштаб"

снимок экрана с лентой, в которой используются небольшие изображения для элементов управления масштабированием.

На следующем снимке экрана показана лента в скрытом состоянии. Лента скрыта, когда исчерпаны все потенциальные макеты элементов управления и её невозможно отобразить в рабочей области приложения.

снимок экрана со свернутой лентой.

Для любого изображения точный размер пикселя зависит от разрешения дисплея или точек на дюйм (dpi) используемого монитора. При разрешении 96 dpi большие изображения имеют размер 32x32 пикселей, а маленькие изображения — размер 16x16 пикселей. Размеры изображений увеличиваются линейно относительно dpi, как показано в следующей таблице.

DPI Небольшое изображение Большое изображение
96 dpi 16x16 пикселей 32x32 пикселей
120 dpi 20x20 пикселей 40x40 пикселей
144 dpi 24x24 пикселей 48x48 пикселей
192 dpi 32x32 пикселей 64x64 пикселей

 

Фреймворк Ribbon масштабирует ресурсы изображений в соответствии с потребностями. Однако, поскольку изменение размера может привести к нежелательным артефактам и ухудшению изображения, настоятельно рекомендуется предоставить приложению небольшой набор ресурсов изображений, охватывающих различные часто используемые параметры dpi. Если точное совпадение не найдено, ближайшее изображение будет масштабировано вверх или вниз.

Чтобы упростить эту задачу, ресурсы изображений можно объявить в разметке ленты с помощью набора элементов Image для каждого элемента Command. Во время выполнения фреймворк выбирает изображение для отображения на основе атрибута MinDPI каждого элемента Image.

Важный

Если коллекция ресурсов изображений, предназначенных для поддержки определенных параметров d pi экрана, предоставляется платформе ленты с помощью набора элементовизображения, платформа использует image со значением атрибута minDPI MinDPI, соответствующего текущему параметру dpi экрана.

Если элемент Image не объявлен с значением MinDPI, соответствующим текущему параметру dpi экрана, платформа выбирает изображение с ближайшим значением MinDPI меньше текущего параметра dpi экрана и масштабирует ресурс изображения вверх. В противном случае, если элемент изображения не объявлен с атрибутом MinDPI, значение которого меньше текущего параметра dpi экрана, платформа выбирает ближайшее значение MinDPI, которое больше текущего параметра dpi экрана, и уменьшает ресурс изображения.

 

В следующем примере показано, как объявить набор изображений для размещения различных размеров ленты и системных параметров.

<Command.LargeImages>
  <Image Source="res/CutLargeImage32.bmp" Id="116" Symbol="ID_CUT_LARGEIMAGE1" MinDPI="96" />
  <Image Source="res/CutLargeImage40.bmp" Id="117" Symbol="ID_CUT_LARGEIMAGE2" MinDPI="120" />
  <Image Source="res/CutLargeImage48.bmp" Id="118" Symbol="ID_CUT_LARGEIMAGE3" MinDPI="144" />
  <Image Source="res/CutLargeImage64.bmp" Id="119" Symbol="ID_CUT_LARGEIMAGE4" MinDPI="192" />
</Command.LargeImages>
<Command.SmallImages>
  <Image Source="res/CutSmallImage16.bmp" Id="122" Symbol="ID_CUT_SMALLIMAGE1" MinDPI="96" />
  <Image Source="res/CutSmallImage20.bmp" Id="123" Symbol="ID_CUT_SMALLIMAGE2" MinDPI="120" />
  <Image Source="res/CutSmallImage24.bmp" Id="124" Symbol="ID_CUT_SMALLIMAGE3" MinDPI="144" />
  <Image Source="res/CutSmallImage32.bmp" Id="125" Symbol="ID_CUT_SMALLIMAGE4" MinDPI="192" />
</Command.SmallImages>
<Command.LargeHighContrastImages>
  <Image Source="res/CutLargeImage32HC.bmp" Id="130" Symbol="ID_CUT_LARGEIMAGE1HC" MinDPI="96" />
  <Image Source="res/CutLargeImage40HC.bmp" Id="131" Symbol="ID_CUT_LARGEIMAGE2HC" MinDPI="120" />
  <Image Source="res/CutLargeImage48HC.bmp" Id="132" Symbol="ID_CUT_LARGEIMAGE3HC" MinDPI="144" />
  <Image Source="res/CutLargeImage64HC.bmp" Id="133" Symbol="ID_CUT_LARGEIMAGE4HC" MinDPI="192" />
</Command.LargeHighContrastImages>
<Command.SmallHighContrastImages>
  <Image Source="res/CutSmallImage16HC.bmp" Id="135" Symbol="ID_CUT_SMALLIMAGE1HC" MinDPI="96" />
  <Image Source="res/CutSmallImage20HC.bmp" Id="136" Symbol="ID_CUT_SMALLIMAGE2HC" MinDPI="120" />
  <Image Source="res/CutSmallImage24HC.bmp" Id="137" Symbol="ID_CUT_SMALLIMAGE3HC" MinDPI="144" />
  <Image Source="res/CutSmallImage32HC.bmp" Id="138" Symbol="ID_CUT_SMALLIMAGE4HC" MinDPI="192" />
</Command.SmallHighContrastImages>

Если изображения, объявленные в разметке, становятся недопустимыми во время выполнения по какой-либо причине, основное приложение запрашивается для новых изображений. При создании и загрузке этих образов программным способом приложение должно попытаться вернуть изображения, размер которых соответствует размерам системных значков по умолчанию, определенным SM_CXICON системной метрикой.

Заметка

Большие изображения имеют размер SM_CXICON × SM_CXICON, а небольшие изображения имеют размер SM_CXICON/2 × SM_CXICON/2.

 

Глубина цвета, прозрачность и контрастность

Ожидается, что обычные изображения будут в формате 32-битный на пиксель (BPP) ARGB и масштабированы до размера системного значка по умолчанию. Этот формат поддерживает как прозрачность, так и антикалиасность (с использованием 8 бит на канал).

Предупреждение

Многие инструменты для редактирования изображений не сохраняют 8-разрядный альфа-канал старшего разряда при загрузке или сохранении изображений с разрешением 32 BPP.

 

Чтобы изображение правильно отображалось в режиме высокой контрастности, оно должно быть в палеттизированном формате пикселей 4 BPP. Когда изображение отрисовывается, лента переназначает определенные цвета в условиях высокой контрастности изображения.

В следующей таблице перечислено поведение рендеринга цвета высокой контрастности фреймворка.

Цвет пикселей

Значение RGB

Поведение

Белый фон

Темный фон

МАДЖЕНТА

800080

Прозрачный

Прозрачный

ЧЁРНЫЙ

000000

Цвет_Текста_Окна

БЕЛЫЙ

БЕЛЫЙ

FFFFFF

ЦВЕТ_ОКНА

ЧЁРНЫЙ

ТЕМНО-СЕРЫЙ

808080

COLOR_3DSHADOW

COLOR_3DSHADOW

СЕРЫЙ

C0C0C0

COLOR_3DFACE

COLOR_3DFACE

СВЕТЛО-СЕРЫЙ

DFDFDF

ЦВЕТ_ЗАСВЕЩЕНИЕ_3D

ЦВЕТ_3D_СВЕТ

ТЁМНО-СИНИЙ

000080

n/a

БЕЛЫЙ

 

Дополнительные сведения о форматах изображений, поддерживаемых платформой ленты, см. в следующих статьях:

Доступность

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

Для базовой поддержки высокой контрастности лента позволяет отображать отдельный набор файлов изображений при активной теме высокой контрастности. Эти изображения могут быть 32 BPP или 4 BPP, с цветами, сопоставленными с специальной палитрой, где тёмные и светлые цвета инвертируются в зависимости от цветов переднего плана и фона активной темы с высокой контрастностью.

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

<Command Name="cmdNew" Id="0xE100" Symbol="ID_CMD_NEW" LabelTitle="New document" Keytip="N" >
      <Command.TooltipTitle>New (Ctrl+N)</Command.TooltipTitle>
      <Command.TooltipDescription>Create a new document.</Command.TooltipDescription>
      <Command.LargeImages>
        <Image Source="cmdNew-32px.bmp" MinDPI="96" />
        <Image Source="cmdNew-40px.bmp" MinDPI="120" />
        <Image Source="cmdNew-48px.bmp" MinDPI="144" />
        <Image Source="cmdNew-64px.bmp" MinDPI="192" />
      </Command.LargeImages>
      <Command.LargeHighContrastImages>
        <Image Source="cmdNew-32px-HC.bmp" MinDPI="96" />
        <Image Source="cmdNew-40px-HC.bmp" MinDPI="120" />
        <Image Source="cmdNew-48px-HC.bmp" MinDPI="144" />
        <Image Source="cmdNew-64px-HC.bmp" MinDPI="192" />
      </Command.LargeHighContrastImages>
      <Command.SmallImages>
        <Image Source="cmdNew-16px.bmp" MinDPI="96" />
        <Image Source="cmdNew-20px.bmp" MinDPI="120" />
        <Image Source="cmdNew-24px.bmp" MinDPI="144" />
        <Image Source="cmdNew-32px.bmp" MinDPI="192" />
      </Command.SmallImages>
      <Command.SmallHighContrastImages>
        <Image Source="cmdNew-16px-HC.bmp" MinDPI="96" />
        <Image Source="cmdNew-20px-HC.bmp" MinDPI="120" />
        <Image Source="cmdNew-24px-HC.bmp" MinDPI="144" />
        <Image Source="cmdNew-32px-HC.bmp" MinDPI="192" />
      </Command.SmallHighContrastImages>
    </Command>

Command.SmallImages

UI_PKEY_SmallImage

Command.LargeImages

UI_PKEY_LargeImage

Команда.МаленькиеВысококонтрастныеИзображения

UI_PKEY_SmallHighContrastImage

Команда.ИзображенияСВисокимКонтрастом

UI_PKEY_LargeHighContrastImage