Windows Ribbon в .NET-приложениях (ч.7)

25.01.2011 11:16 | deeper2k

12015

- T

Предыдущая статья стала вынужденным "техническим перерывом" в цикле, она была целиком и полностью посвящена довольно серьёзным нововведениям в версии 2.6 библиотеки Windows Ribbon for WinForms.

В сегодняшней статье мы вернёмся к знакомству с возможностями ленты Windows и рассмотрим ещё четыре элемента управления: флажок (CheckBox), выключатель (ToggleButton), а также специфические контролы ленты DropDownColorPicker и FontControl.

Брифинг окончен, приступим.

CheckBox и ToggleButton
Если вкратце, то я добавил поддержку элементов управления ленты CheckBox и ToggleButton. В пакете поставки библиотеки это пример "10-CheckBox". Результат выглядит как-то так:

Использование CheckBox и ToggleButton — разметка ленты
Секции команд и представлений:

<?xml version='1.0' encoding='utf-8'?>

<Application xmlns='http://schemas.microsoft.com/windows/2009/Ribbon'>

  <Application.Commands>



    <Command Name="cmdToggleButton"

             Id="1002"

             LabelTitle="Выключатель">

      <Command.LargeImages>

        <Image>Res/Open32.bmp</Image>

      </Command.LargeImages>

      <Command.SmallImages>

        <Image>Res/Open16.bmp</Image>

      </Command.SmallImages>

    </Command>



    <Command Name="cmdCheckBox"

             Id="1003"

             LabelTitle="Флажок">

      <Command.LargeImages>

        <Image>Res/Save32.bmp</Image>

      </Command.LargeImages>

      <Command.SmallImages>

        <Image>Res/Save16.bmp</Image>

      </Command.SmallImages>

    </Command>



  </Application.Commands>



  <Application.Views>

    <Ribbon>

      <Ribbon.Tabs>

        <Tab>

          <Group>

            <ToggleButton CommandName="cmdToggleButton" />

          </Group>

          <Group CommandName="cmdGroupCheckBox">

            <CheckBox CommandName="cmdCheckBox" />

          </Group>

        </Tab>

      </Ribbon.Tabs>

    </Ribbon>

  </Application.Views>

</Application>

n>[/code]

Использование CheckBox и ToggleButton — код
Инициализация:

[code]private RibbonToggleButton _toggleButton;
private RibbonCheckBox _checkBox;

public Form1()
{
InitializeComponent();

_toggleButton = new RibbonToggleButton(_ribbon, (uint)RibbonMarkupCommands.cmdToggleButton);
_checkBox = new RibbonLib.Controls.RibbonCheckBox(_ribbon, (uint)RibbonMarkupCommands.cmdCheckBox);

_button.ExecuteEvent += new EventHandler<ExecuteEventArgs>(_button_ExecuteEvent);
}[/code]
Получить / назначить состояние флажка:

[code]void _button_ExecuteEvent(object sender, ExecuteEventArgs e)
{
MessageBox.Show("поставлен ли флажок: " + _checkBox.BooleanValue.ToString());
}[/code]

DropDownColorPicker
Библиотека Windows Ribbon for WinForms поддерживает элемент управления DropDownColorPicker. Результатом этой части статьи является очередной пример, "11-DropDownColorPicker".

Элемент управления DropDownColorPicker
Раскрывающаяся палитра (DropDownColorPicker) выглядит примерно так:

Свойства DropDownColorPicker
Ниже приведён список свойств, уникальных для контрола DropDownColorPicker. Другие свойства были рассмотрены в предыдущих статьях.

Color — Выбранный цвет.
Идентификатор свойства: UI_PKEY_Color
ColorType — Тип выбранного цвета. Может быть: NoColor, Automatic или RGB (то есть какой-то определённый цвет).
Идентификатор свойства: UI_PKEY_ColorType
AutomaticColorLabel — Назначает метку для кнопки цвета "Авто".
Идентификатор свойства: UI_PKEY_AutomaticColorLabel
MoreColorsLabel — Назначает метку для кнопки "Другие цвета...".
Идентификатор свойства: UI_PKEY_MoreColorsLabel
NoColorLabel — Назначает метку для кнопки "Нет цвета".
Идентификатор свойства: UI_PKEY_NoColorLabel
RecentColorsCategoryLabel — Назначает метку для категории "Последние цвета".
Идентификатор свойства: UI_PKEY_RecentColorsCategoryLabel
StandardColorsCategoryLabel — Назначает метку для категории "Стандартные цвета".
Идентификатор свойства: UI_PKEY_StandardColorsCategoryLabel
ThemeColorsCategoryLabel — Назначает метку для категории "Цвета темы".
Идентификатор свойства: UI_PKEY_ThemeColorsCategoryLabel

Обратите внимание, что различные метки на раскрывающейся палитре позволяют локализовать контрол.

Подробнее про элемент управления DropDownColorPicker рассказано в статье Drop-Down Color Picker на MSDN.

Использование DropDownColorPicker — разметка ленты
Секции команд и представлений:

[code]<?xml version='1.0' encoding='utf-8'?>
<Application xmlns='http://schemas.microsoft.com/windows/2009/Ribbon'>
<Application.Commands>
<Command Name="cmdDropDownColorPickerThemeColors"
Id="1002"
LabelTitle="Theme Colors">
<Command.LargeImages>
<Image>Res/Colors32.bmp</Image>
</Command.LargeImages>
</Command>
</Application.Commands>

<Application.Views>
<Ribbon>
<Ribbon.Tabs>
<Tab>
<Group>
<DropDownColorPicker CommandName="cmdDropDownColorPickerThemeColors"
ColorTemplate="ThemeColors"/>
</Group>
</Tab>
</Ribbon.Tabs>
</Ribbon>
</Application.Views>
</Application>[/code]

Использование DropDownColorPicker — код
Инициализация:

[code]private RibbonDropDownColorPicker _themeColors;

public Form1()
{
InitializeComponent();

_themeColors = new RibbonDropDownColorPicker(_ribbon, (uint)RibbonMarkupCommands.cmdDropDownColorPickerThemeColors);
}

private void Form1_Load(object sender, EventArgs e)
{
_ribbon.InitFramework(this);
InitDropDownColorPickers();
}

private void InitDropDownColorPickers()
{
// общие свойства
_themeColors.Label = "Цвета темы";
_themeColors.ExecuteEvent += new EventHandler<ExecuteEventArgs>(_themeColors_ExecuteEvent);

// задаём метки
_themeColors.AutomaticColorLabel = "Мой 'автоматически'";
_themeColors.MoreColorsLabel = "Мои 'другие цвета'";
_themeColors.NoColorLabel = "Моя 'нет цвета'";
_themeColors.RecentColorsCategoryLabel = "Мои последние цвета";
_themeColors.StandardColorsCategoryLabel = "Мои стандартные цвета";
_themeColors.ThemeColorsCategoryLabel = "Мои цвета темы";

// задаём цвета
_themeColors.ThemeColorsTooltips = new string[] { "жёлтый", "зелёный", "красный", "синий" };
_themeColors.ThemeColors = new Color[] { Color.Yellow, Color.Green, Color.Red, Color.Blue };
}[/code]
Ответ на событие выбора цвета:

[code]void _themeColors_ExecuteEvent(object sender, ExecuteEventArgs e)
{
MessageBox.Show("Выбранный цвет: " + _themeColors.Color.ToString());
}[/code]

FontControl
Библиотека Windows Ribbon for WinForms также поддерживает элемент управления FontControl. Результатом этой части статьи является следующий пример, "12-FontControl".

Элемент управления FontControl
FontControl — ещё один специфический контрол в Windows Ribbon Framework. Он позволяет выбирать семейства шрифтов, размеры, цвета и связанные эффекты.

Существует три типа контрола, каждый обладает чуть большим набором функций, чем предыдущий:

Только шрифт (Font Only)
Шрифт и цвет (Font With Color)
Форматированный шрифт (Rich Font)

См. статью Font Control на MSDN для подробностей о различиях между типами.

Свойства FontControl
Ниже приведён список свойств, уникальных для контрола FontControl. Другие свойства были рассмотрены в предыдущих статьях.

FontProperties — Это свойство имеет тип IPropertyStore и содержит все свойства конкретного шрифта, как-то: размер, полужирный, подчёркнутый и т.д.
Я использую это свойство внутри вспомогательного класса FontControl для доступа к другим свойствам, но не предоставляю его пользователю, поскольку ни для чего другого оно не нужно.
Идентификатор свойства: UI_PKEY_FontProperties
ChangedProperties — Это свойство содержит все недавно изменённые свойства.
FontControl его не раскрывает, но предоставляет его как один из параметров событий Execute / Preview / CancelPreview. Например, если вы нажмёте кнопку "Полужирный", будет вызвано событие Execute и это свойство будет содержать только свойство Bold.
Идентификатор свойства: UI_PKEY_FontProperties_ChangedProperties
Family — Название семейства выбранного шрифта.
Идентификатор свойства: UI_PKEY_FontProperties_Family
Size — Размер шрифта.
Идентификатор свойства: UI_PKEY_FontProperties_Size
Bold — Флаг, показывающий, выбрана ли "полужирность".
Идентификатор свойства: UI_PKEY_FontProperties_Bold
Italic — Флаг, показывающий, выбран ли "курсив".
Идентификатор свойства: UI_PKEY_FontProperties_Italic
Underline — Флаг, показывающий, выбрано ли "подчёркивание".
Идентификатор свойства: UI_PKEY_FontProperties_Underline
Strikethrough — Флаг, показывающий, выбрано ли "зачёркивание".
Идентификатор свойства: UI_PKEY_FontProperties_Strikethrough
VerticalPositioning — Флаг, показывающий, какая из кнопок "надстрочный" или "подстрочный" нажата (если вообще нажата).
Идентификатор свойства: UI_PKEY_FontProperties_VerticalPositioning
ForegroundColor — Содержит цвет текста, если ForegroundColorType имеет значение RGB.
Вспомогательный класс FontControl предоставляет это свойство как цвет .NET и внутренне выполняет преобразование в структуру и из структуры COLORREF.
Идентификатор свойства: UI_PKEY_FontProperties_ForegroundColor
ForegroundColorType — Тип цвета текста. Принимает значения RGB и Automatic.
Если выбрано RGB, пользователь должен получить цвет из свойства ForegroundColor.
Если выбрано Automatic, пользователь должен использовать SystemColors.WindowText.
Вспомогательный класс FontControl не предоставляет свойство ForegroundColorType. Вместо этого он реализует внутренний алгоритм выбора цвета (т.е. возвращает правильный цвет согласно свойству типа).
Идентификатор свойства: UI_PKEY_FontProperties_ForegroundColorType
BackgroundColor — Содержит цвет фона, если BackgroundColorType имеет значение RGB.
Вспомогательный класс FontControl предоставляет это свойство как цвет .NET и внутренне выполняет преобразование в структуру и из структуры COLORREF.
Идентификатор свойства: UI_PKEY_FontProperties_BackgroundColor
BackgroundColorType — Тип цвета фона. Принимает значения RGB и NoColor.
Если выбрано RGB, пользователь должен получить цвет из свойства BackgroundColor.
Если выбрано NoColor, пользователь должен использовать SystemColors.Window.
Вспомогательный класс FontControl не предоставляет свойство BackgroundColorType. Вместо этого он реализует внутренний алгоритм выбора цвета (т.е. возвращает правильный цвет согласно свойству типа).
Идентификатор свойства: UI_PKEY_FontProperties_BackgroundColorType
DeltaSize — Показывает, какая из кнопок "Увеличить размер" или "Уменьшить размер" нажата.
Это свойство доступно только как часть свойства ChangedProperties и не предоставляется вспомогательным классом FontControl.
Идентификатор свойства: UI_PKEY_FontProperties_DeltaSize

Использование FontControl — разметка ленты
Секции команд и представлений:

[code]<?xml version='1.0' encoding='utf-8'?>
<Application xmlns='http://schemas.microsoft.com/windows/2009/Ribbon'>
<Application.Commands>
<Command Name="cmdTabMain" Id="1001" LabelTitle="Главная" />
<Command Name="cmdGroupRichFont" Id="1002" LabelTitle="Форматированный шрифт" />
<Command Name="cmdRichFont" Id="1003" Keytip="Ш" />
</Application.Commands>

<Application.Views>
<Ribbon>
<Ribbon.Tabs>
<Tab CommandName="cmdTabMain">
<Group CommandName="cmdGroupRichFont" SizeDefinition="OneFontControl">
<FontControl CommandName="cmdRichFont" FontType="RichFont" />
</Group>
</Tab>
</Ribbon.Tabs>
</Ribbon>
</Application.Views>
</Application>[/code]
Более подробно про атрибуты FontControl можно прочитать на MSDN.

Использование FontControl — код
Следующий код показывает простейший способ использования FontControl ленты, который синхронизируется с выбранным текстом в стандартном контроле .NET RichTextBox.

1) Инициализация:

[code]private RibbonFontControl _richFont;

public Form1()
{
InitializeComponent();

_richFont = new RibbonFontControl(_ribbon, (uint)RibbonMarkupCommands.cmdRichFont);

_richFont.ExecuteEvent += new EventHandler<ExecuteEventArgs>(_richFont_ExecuteEvent);
_richFont.PreviewEvent += new EventHandler<ExecuteEventArgs>(_richFont_OnPreview);
_richFont.CancelPreviewEvent += new EventHandler<ExecuteEventArgs>(_richFont_OnCancelPreview);
}[/code]

2) Задаём свойства RichTextBox, когда изменяется FontControl:

[code]void _richFont_ExecuteEvent(object sender, ExecuteEventArgs e)
{
// пропуск, если выбранный шрифт не является правильным
if ((_richFont.Family == null) ||
(_richFont.Family.Trim() == string.Empty) ||
(_richFont.Size == 0))
{
return;
}

// подготовка стиля шрифта
FontStyle fontStyle = FontStyle.Regular;
if (_richFont.Bold == FontProperties.Set)
{
fontStyle |= FontStyle.Bold;
}
if (_richFont.Italic == FontProperties.Set)
{
fontStyle |= FontStyle.Italic;
}
if (_richFont.Underline == FontUnderline.Set)
{
fontStyle |= FontStyle.Underline;
}
if (_richFont.Strikethrough == FontProperties.Set)
{
fontStyle |= FontStyle.Strikeout;
}

// задаём выбранный шрифт
richTextBox1.SelectionFont =
new Font(_richFont.Family, (float)_richFont.Size, fontStyle);

// задаём выбранные цвета
richTextBox1.SelectionColor = _richFont.ForegroundColor;
richTextBox1.SelectionBackColor = _richFont.BackgroundColor;

// задаём "подстрочность" / "надстрочность"
switch (_richFont.VerticalPositioning)
{
case FontVerticalPosition.NotSet:
richTextBox1.SelectionCharOffset = 0;
break;

case FontVerticalPosition.SuperScript:
richTextBox1.SelectionCharOffset = 10;
break;

case FontVerticalPosition.SubScript:
richTextBox1.SelectionCharOffset = -10;
break;
}
}[/code]
Обратите внимание, что RichTextBox не поддерживает "подстрочность" и "надстрочность" нативно. Зато он поддерживает задание смещения (offset) символов, поэтому я использую эту возможность для симуляции нужного поведения.

3) Добавляем поддержку предпросмотра при смене семейства и размера шрифта:

[code]void _richFont_OnPreview(object sender, ExecuteEventArgs e)
{
PropVariant propChangesProperties;
e.commandExecutionProperties.GetValue(ref RibbonProperties.FontProperties_ChangedProperties, out propChangesProperties);
IPropertyStore changedProperties = (IPropertyStore)propChangesProperties.Value;

UpdateRichTextBox(changedProperties);
}

void _richFont_OnCancelPreview(object sender, ExecuteEventArgs e)
{
IPropertyStore fontProperties = (IPropertyStore)e.currentValue.PropVariant.Value;

UpdateRichTextBox(fontProperties);
}

private void UpdateRichTextBox(IPropertyStore propertyStore)
{
RibbonLib.FontPropertyStore fontPropertyStore = new RibbonLib.FontPropertyStore(propertyStore);
PropVariant propValue;

FontStyle fontStyle = richTextBox1.SelectionFont.Style;
string family = richTextBox1.SelectionFont.FontFamily.Name;
float size = richTextBox1.SelectionFont.Size;

if (propertyStore.GetValue(ref RibbonProperties.FontProperties_Family, out propValue) == HRESULT.S_OK)
{
family = fontPropertyStore.Family;
}
if (propertyStore.GetValue(ref RibbonProperties.FontProperties_Size, out propValue) == HRESULT.S_OK)
{
size = (float)fontPropertyStore.Size;
}

richTextBox1.SelectionFont = new Font(family, size, fontStyle);
}[/code]
Обратите внимание, что только семейство и размер шрифта должны поддерживать предпросмотр, поскольку только у них есть соответствующие раскрывающиеся списки (combo boxes).

4) Обновляем FontControl, когда изменяется выбор текста в RichTextBox:

[code]private void richTextBox1_SelectionChanged(object sender, EventArgs e)
{
// обновляем шрифт в fontcontrol
if (richTextBox1.SelectionFont != null)
{
_richFont.Family = richTextBox1.SelectionFont.FontFamily.Name;
_richFont.Size = (decimal)richTextBox1.SelectionFont.Size;
_richFont.Bold = richTextBox1.SelectionFont.Bold ?
FontProperties.Set : FontProperties.NotSet;
_richFont.Italic = richTextBox1.SelectionFont.Italic ?
FontProperties.Set : FontProperties.NotSet;
_richFont.Underline = richTextBox1.SelectionFont.Underline ?
FontUnderline.Set : FontUnderline.NotSet;
_richFont.Strikethrough = richTextBox1.SelectionFont.Strikeout ?
FontProperties.Set : FontProperties.NotSet;
}
else
{
_richFont.Family = string.Empty;
_richFont.Size = 0;
_richFont.Bold = FontProperties.NotAvailable;
_richFont.Italic = FontProperties.NotAvailable;
_richFont.Underline = FontUnderline.NotAvailable;
_richFont.Strikethrough = FontProperties.NotAvailable;
}

// обновляем цвета в fontcontrol
_richFont.ForegroundColor = richTextBox1.SelectionColor;
_richFont.BackgroundColor = richTextBox1.SelectionBackColor;

// обновляем вертикальное расположение в fontcontrol
switch (richTextBox1.SelectionCharOffset)
{
case 0:
_richFont.VerticalPositioning = FontVerticalPosition.NotSet;
break;

case 10:
_richFont.VerticalPositioning = FontVerticalPosition.SuperScript;
break;

case -10:
_richFont.VerticalPositioning = FontVerticalPosition.SubScript;
break;
}
}[/code]

От переводчика: это ещё не всё
На этом заканчивается часть сообщений Арика, интересная для пользователей его библиотеки. Однако осталось ещё довольно много интересных подробностей внутреннего устройства библиотеки, которые я не буду здесь переводить, поскольку они были актуальны на момент написания Ариком его сообщений. Тем не менее, среди этих подробностей есть ссылки на два интересных проекта, позволяющих визуально спроектировать ленту Windows: PreviewRibbon от Microsoft и RibbonExplorer от Алона Флисса (Alon Fliess).

Несмотря на это, после того, как мы рассмотрим все возможности Windows Ribbon for WinForms, я напишу ещё одну "техническую" статью, в которую войдут те части сообщений Арика, которые "устарели" для текущих версий его библиотеки.

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

Заключение
Теперь на сегодня всё.

Небольшое замечание к материалу: поскольку код в сообщениях Арика содержит старый механизм обработки событий (см. статью 5), я постарался соответствующим образом изменить кодовые вставки в статье. Тем не менее, я мог что-то забыть, поэтому если при компиляции проектов возникают ошибки, в первую очередь проверьте правильность обработки событий.

В следующей статье мы рассмотрим режимы приложения (ApplicationModes), контекстные вкладки (ContextualTabs) и, возможно, ещё и контекстные всплывающие меню (ContextPopup).