Skip to content

Элементы ленты

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

ribbon-items

В дополнение к этим классическим элементам, контрол ленты поддерживает галереи. Они предназначены для отображения графически насыщенных элементов, размещенных в виде строк и столбцов. Смотрите Галереи для получения дополнительной информации.

Все элементы, включая галереи, могут быть добавлены в традиционные панели инструментов и контекстные меню .

Добавление элементов ленты

Вы можете отображать различные элементы в разных элементах ленты: Группы страниц ленты , Панель быстрого доступа , Область заголовка страницы , Главное меню (приложения) и подменю.

Чтобы добавить элементы в группу страниц ленты в XAML, определите эти элементы между начальным и конечным тегами <RibbonPageGroup>. В коде вы можете добавлять элементы, получать к ним доступ и изменять их, используя коллекцию RibbonPageGroup.Items. Другие элементы ленты заполняются элементами таким же образом.

Следующий пример добавляет три кнопки (объекты ToolbarButtonItem) к объекту RibbonPageGroup. 

<mxb:ToolbarManager IsWindowManager="True">
    <mxr:RibbonControl ApplicationButtonContent="File" ApplicationButtonKeyTip="F">
        <mxr:RibbonPage Header="Home" KeyTip="H">
            <mxr:RibbonPageGroup Header="Editing" IsHeaderButtonVisible="False">
                <mxb:ToolbarButtonItem Header="Find" KeyTip="FN" 
                  Glyph="{x:Static icons:Basic.Search}" 
                  Command="FindButtonClick" />
                <mxb:ToolbarButtonItem Header="Replace" KeyTip="RP" 
                  Glyph="{x:Static icons:Basic.Update}" 
                  Command="ReplaceButtonClick"/>
                <mxb:ToolbarButtonItem Header="Clear" KeyTip="CL" 
                  Glyph="{x:Static icons:Basic.Table_Clear}" 
                  Command="ClearButtonClick"/>
            </mxr:RibbonPageGroup>
        </mxr:RibbonPage>
    </mxr:RibbonControl>
</mxb:ToolbarManager>

Типы элементов ленты

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

Обычные кнопки (ToolbarButtonItem)

Объекты ToolbarButtonItem позволяют реализовать обычные кнопки и кнопки с функциональностью всплывающего окна .

Обычная кнопка вызывает действие при нажатии.

ribbon-items-button

Нажмите на кнопку

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

  • ToolbarItem.Command — Команда, выполняемая при нажатии на кнопку.

    <mxb:ToolbarButtonItem Header="Open" KeyTip="O" 
Command="{Binding OpenFileCommand}" 
Glyph="{x:Static icons:Basic.Folder_Open}" />

    [RelayCommand]
public void OpenFile()
{
    //...
}

  • CommandParameter — Командный параметр, передаваемый указанной команде.

  • ToolbarItem.Click — срабатывает при щелчке левой кнопкой мыши по элементу (после нажатия левой кнопки мыши и последующего отпускания).

  • ToolbarItem.Press — срабатывает при нажатии любой кнопки мыши на элементе.

Подпись к кнопке и картинка-глиф

  • Header — Текст для отображения элемента.
  • Glyph — Картинка элемента. Смотрите также: Размер картинки .
  • GlyphTemplate — Пользовательский шаблон данных для рендеринга картинки элемента.

Размер картинки

Размер картинок команд в Группах страниц ленты отличается в упрощенном и классическом размещении команд . Более подробная информация приведена в следующих разделах:

Совет

To customize the size of item glyphs in popup and context menus, use the item's GlyphSize property.

<mxb:PopupMenu MinWidth="250" ContentRightIndent="30">
    <mxb:ToolbarButtonItem Header="New" Glyph="{x:Static icons:Basic.Doc}" GlyphSize="32,32" HotKey="Ctrl+N"/>
</mxb:PopupMenu>

Размер картинки в упрощенном размещении команд

Все команды в группах страниц используют один размер значка в Упрощенном размещении команд .

ribbon-glyphsize-simplified-command-layout

Размер значка по умолчанию - 22x22. Вы можете использовать свойство RibbonControl.GlyphSizeInSimplifiedLayout для указания пользовательского размера значка.

Размер картинки в классическом размещении команд

Команды в группах страниц могут отображать большие и маленькие картинки в Классическом размещении команд .

ribbon-glyphsize-classic-command-layout

Размер маленьких значков по умолчанию равен 16x16. Вы можете использовать свойство RibbonControl.SmallGlyphSize для изменения размера маленьких значков. Большие значки в два раза больше маленьких.

Attached-свойство RibbonControl.DisplayMode можно использовать для указания размера отображения (большой, маленький и с текстом) для команд в группах страниц ленты. Смотрите Адаптивный размер картинки в классическом размещении команд для получения дополнительной информации.

Адаптивный размер картинки в классическом размещении команд

Функция адаптивного размещения контрола ленты регулирует размещение элементов в группах страниц ленты при изменении размера контрола ленты. Эта функция также регулирует размер отображаемых элементов при изменении размера ленты, когда используется классическая команда Размещения.

ribbon-adaptivelayout

Attached-свойство RibbonControl.DisplayMode позволяет указать поддерживаемые режимы отображения для элементов ленты в группах страниц ленты в Классическом командном размещении . Вы можете заставить элемент использовать только большие картинки, маленькие картинки, маленькие картинки с текстом или комбинацию этих режимов отображения.

Предопределенные режимы отображения картинок определяются перечислением RibbonItemDisplayMode:

  • Large — элемент отображает крупную картинку и текст.

    ribboncontrol-displaymode-large

  • Small — элемент отображает небольшую картинку и текст.

    ribboncontrol-displaymode-small

  • SmallGlyph — На элементе отображается небольшая картинка-глиф.

    ribboncontrol-displaymode-smallglyph

  • Auto — элемент поддерживает режимы отображения Large, Small и SmallGlyph. В зависимости от места, доступного в родительской "группе" элемента , контрол ленты автоматически выбирает один из этих режимов отображения для элемента.

Следующий фрагмент кода устанавливает для attached-свойства RibbonControl.DisplayMode для элемента ленты значение Large. Это вынуждает элемент использовать только большие картинки.

<mxr:RibbonPage Header="Home" KeyTip="H">
    <mxr:RibbonPageGroup Header="File" IsHeaderButtonVisible="True">
        <mxb:ToolbarButtonItem Header="Open" KeyTip="O" mxr:RibbonControl.DisplayMode="Large"
                            Glyph="{x:Static icons:Basic.Folder_Open}" />
    </mxr:RibbonPageGroup>
</mxr:RibbonPage>

Перечисление RibbonItemDisplayMode помечено атрибутом [Flags]. Таким образом, вы можете использовать любую комбинацию флагов Large, Small и SmallGlyph при установке свойства RibbonControl.DisplayMode attached-свойство.

Следующий код позволяет элементу ленты использовать только режимы отображения Small и SmallGlyph:

<mxb:ToolbarButtonItem Header="Help" KeyTip="LP" Glyph="{x:Static icons:Basic.Info}"
                       mxr:RibbonControl.DisplayMode="Small, SmallGlyph" />

Общие свойства отображения элемента

  • ShowSeparator — Получает или устанавливает, следует ли отображать разделитель перед элементом. Вы также можете использовать элемент панели ToolbarSeparatorItem для вставки разделителя.

Кнопки с функциональностью всплывающего окна (ToolbarButtonItem)

Элемент ToolbarButtonItem позволяет вам создать кнопку с связанным с ней контролом всплывающего окна или меню.

ribbon-items-dropdownbutton

Используйте свойство ToolbarButtonItem.DropDownControl, чтобы указать контрол/меню всплывающего окна. Этот контрол всплывающего окна вызывается, когда пользователь нажимает кнопку или встроенную кнопку со стрелкой вниз (в зависимости от свойств DropDownArrowVisibility; смотрите ниже).

<mxb:ToolbarButtonItem Name="btnNew" Header="New" KeyTip="N" 
    Glyph="{x:Static icons:Basic.Docs_Add}"
    mxr:RibbonControl.DisplayMode="Large"
    DropDownArrowVisibility="ShowSplitArrow">
    <mxb:ToolbarButtonItem.DropDownControl>
        <mxb:PopupMenu>
            <mxb:ToolbarButtonItem Header="New Document" KeyTip="ND" 
                Glyph="{x:Static icons:Basic.Doc_Add}" />
            <mxb:ToolbarButtonItem Header="New Excel Document" KeyTip="NX"
                                    Glyph="{x:Static icons:Basic.Doc_Excel}" />
        </mxb:PopupMenu>
    </mxb:ToolbarButtonItem.DropDownControl>
</mxb:ToolbarButtonItem>

Контрол всплывающего окна и кнопка со стрелкой вниз

  • DropDownControl — Получает или устанавливает контрол всплывающего окна (объект Eremex.AvaloniaUI.Controls.Bars.IPopup), связанный с элементом. Контрол появляется, когда пользователь нажимает на элемент или встроенную кнопку со стрелкой вниз (см. DropDownArrowVisibility). Следующие объекты реализуют интерфейс Eremex.AvaloniaUI.Controls.Bars.IPopup, и поэтому они могут отображаться в виде контролов всплывающего окна:

    • Eremex.AvaloniaUI.Controls.Bars.PopupMenu — Всплывающее меню . Вы можете добавить в меню все типы элементов панели инструментов, чтобы заполнить его содержимым.
    • Eremex.AvaloniaUI.Controls.Bars.PopupContainer — Контейнер с контролами. Используйте PopupContainer для отображения пользовательских контролов в всплывающем окне.

  • DropDownArrowVisibility — Получает или устанавливает, отображает ли элемент стрелку всплывающего окна, используемую для вызова связанного контрола всплывающего окна.

    ribbon-items-button-dropdownarrowvisibility

    • ShowSplitArrow или Default — Видна стрелка всплывающего окна. Она действует как отдельная кнопка, встроенная в элемент. Щелчок по стрелке всплывающего окна вызывает связанный контрол всплывающего окна и вызывает событие DropDownPress. Щелчок по элементу вызывает его команду (Command) и события (Click и Press).

    • ShowArrow — Видна стрелка всплывающего окна. Элемент и стрелка действуют как единая кнопка. Щелчок по ним отображает связанный контрол всплывающего окна.

    • Hide — Стрелка всплывающего окна скрыта. Щелчок по элементу вызывает контрол всплывающего окна.

Вызов контрола всплывающего окна

  • DropDownOpenMode — Получает или устанавливает, вызывается ли контрол всплывающего окна и когда, когда пользователь касается стрелки элемента/всплывающего окна. Поддерживаемые опции включают:
    • Press или Default — Всплывающее окно отображается при нажатии кнопки мыши.
    • Click — После нажатия и последующего отпускания курсора мыши над элементом отображается всплывающее окно.
    • Never — Всплывающее окно не отображается.
  • DropDownPress — Событие, которое срабатывает при нажатии стрелки на всплывающее окно.

"Переключать кнопки" (ToolbarCheckItem)

Элемент ToolbarCheckItem позволяет вам создать переключающую кнопку. Переключающие кнопки поддерживают два состояния — нормальное и нажатое.

toolbarcheckitem

xmlns:mxb="https://schemas.eremexcontrols.net/avalonia/bars"

<mxb:ToolbarCheckItem Header="Bold" 
 IsChecked="{Binding #textBox.FontWeight, 
  Converter={helpers:BoolToFontWeightConverter}, Mode=TwoWay}" 
 Glyph="{SvgImage 'avares://DemoCenter/Images/FontBold.svg'}" />

Проверьте кнопку

  • IsChecked — Возвращает или устанавливает состояние нажатия кнопки.
  • CheckedChanged — Событие, которое срабатывает при изменении состояния нажатия кнопки "Проверить".

Подпись, Картинка-глиф и свойства отображения

  • Header — Текст для отображения элемента.

  • Glyph — Картинка элемента. Кнопка-переключатель поддерживает как большие, так и маленькие картинки. Смотрите следующие разделы, чтобы узнать больше:

  • Размер картинки

  • Адаптивный размер картинки в классическом размещении команд

  • GlyphTemplate — Пользовательский шаблон данных для рендеринга картинки элемента.

  • CheckBoxStyle — Получает или устанавливает режим отображения для объекта ToolbarCheckItem. Доступные опции включают:

  • CheckBoxStyle.CheckButton — элемент отображается в виде переключающей кнопки. Когда IsChecked равен true, кнопка отображается в нажатом состоянии.

    bars-checkboxstyle-checkbutton

  • CheckBoxStyle.CheckBox — Перед текстом и картинкой элемента отображается флажок переключения. Когда IsChecked равен true, в поле переключения установлен флажок.

    bars-checkboxstyle-checkbox

  • CheckBoxStyle.RadioButton — Перед текстом и картинкой элемента отображается переключатель-кнопка. Когда IsChecked равен true, переключатель-кнопка отображается в виде заполненного круга.

    Вы можете применить стиль RadioButton к объектам ToolbarCheckItem, объединенным в контрольную группу (ToolbarCheckItemGroup ). В этом случае группа выглядит как типичная радиогруппа.

    <mxb:ToolbarCheckItemGroup CheckType="Radio">
    <mxb:ToolbarCheckItem Header="E-mail" CheckBoxStyle="RadioButton" />
    <mxb:ToolbarCheckItem Header="Phone" CheckBoxStyle="RadioButton" />
</mxb:ToolbarCheckItemGroup>

    bars-checkboxstyle-radiobutton

  • CheckBoxAlignment — Возвращает или устанавливает, будет ли флажок (или переключающая кнопка) отображаться до или после картинки и текста элемента. Эта опция действует, когда свойству CheckBoxStyle присвоено значение CheckBoxStyle.CheckBox или CheckBoxStyle.RadioButton.

    <mxb:ToolbarCheckItem Header="Status bar" CheckBoxAlignment="After"
                    CheckBoxStyle="CheckBox"
                    Hint="Show and hide the status bar"/>
<mxb:ToolbarSeparatorItem/>

    bars-checkboxalignment-after

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

Подменю (ToolbarMenuItem)

Используйте ToolbarMenuItem, чтобы создать элемент, который отображает подменю по щелчку мыши.

ribbon-toolbarMenuItem

Содержание подменю

Чтобы указать содержимое подменю, определите элементы между начальным и конечным тегами <ToolbarMenuItem> в XAML или добавьте элементы в коллекцию ToolbarMenuItem.Items в коде.

xmlns:mxb="https://schemas.eremexcontrols.net/avalonia/bars"

<mxb:ToolbarMenuItem Header="File" Category="File">
    <mxb:ToolbarButtonItem Header="New" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Context Menu, Icon=NewDraftAction.svg'}" 
     Category="File" Command="{Binding NewFileCommand}"/>
    <mxb:ToolbarButtonItem Header="Open" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Basic, Icon=Folder Open.svg'}" 
     Category="File" Command="{Binding OpenFileCommand}"/>
    <mxb:ToolbarButtonItem Header="Save" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Basic, Icon=Save.svg'}" 
     Category="File" Command="{Binding SaveFileCommand}"/>
    <mxb:ToolbarButtonItem Header="Print" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Basic, Icon=Print.svg'}" 
     ShowSeparator="True"  Category="File" Command="{Binding PrintFileCommand}"/>
</mxb:ToolbarMenuItem>

Вы также можете использовать свойство ToolbarMenuItem.ItemsSource для заполнения подменю элементами из коллекции бизнес-объектов в модели представления. Соответствующие шаблоны данных должны определять элементы ленты и инициализировать их свойства из нижележащих бизнес-объектов.

Вызов подменю

При вызове подменю возникают следующие события:

  • Opening — Срабатывает, когда меню готово к отображению. Это событие позволяет отменить отображение меню.
  • Opened — Срабатывает после отображения меню.
  • Closing — Срабатывает, когда меню вот-вот будет закрыто. Это событие позволяет отменить закрытие меню.
  • Closed — запускается после закрытия меню.

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

  • DropDownOpenMode — Получает или устанавливает, вызывается ли подменю и каким образом, когда пользователь касается элемента. Поддерживаемые опции включают:
    • Press или Default — Меню отображается при нажатии кнопки мыши.
    • Click — Меню отображается после нажатия и последующего отпускания курсора мыши над элементом.
    • Never — Меню не отображается.

Подпись, Картинка-глиф и свойства отображения

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

Встроенные редакторы (ToolbarEditorItem)

Используйте объект ToolbarEditorItem для встраивания встроенного редактора в ленточный контрол.

ribbon-toolbarEditorItem

Объект ToolbarEditorItem поддерживает следующие подходы для указания встроенного редактора:

Укажите тип редактора

Такой подход позволяет вам встроить редактор Eremex.

Чтобы указать тип редактора, присвойте свойству ToolbarEditorItem.EditorProperties значение одного из следующих объектов:

  • ButtonEditorProperties — соответствует встроенному редактору ButtonEditor.
  • CheckEditorProperties — соответствует встроенному редактору CheckEditor.
  • ColorEditorProperties — соответствует встроенному редактору ColorEditor.
  • ComboBoxEditorProperties — соответствует встроенному редактору ComboBoxEditor.
  • HyperlinkEditorProperties — соответствует встроенному редактору HyperlinkEditor.
  • PopupColorEditorProperties — соответствует встроенному редактору PopupColorEditor.
  • PopupEditorProperties — соответствует встроенному редактору PopupEditor.
  • SegmentedEditorProperties — соответствует встроенному редактору SegmentedEditor.
  • SpinEditorProperties — соответствует встроенному редактору SpinEditor.
  • TextEditorProperties — соответствует встроенному редактору TextEditor.
  • MemoEditorProperties — соответствует встроенному редактору MemoEditor.

Эти объекты являются потомками BaseEditorProperties. Они содержат свойства для настройки соответствующих встроенных редакторов.

В следующем примере определяется элемент Font (объект ToolbarEditorItem), который отображает список шрифтов с помощью встроенного редактора combobox. Свойству ToolbarEditorItem.EditorProperties присвоено значение объекта ComboBoxEditorProperties, который соответствует редактору ComboBoxEditor. Смотрите демонстрацию WordPad Example для получения полного кода.

<mxb:ToolbarEditorItem Header="Font" EditorWidth="150" 
 EditorValue="{Binding #textBox.FontFamily, Converter={helpers:FontNameToFontFamilyConverter}}">
    <mxb:ToolbarEditorItem.EditorProperties>
        <mxe:ComboBoxEditorProperties 
         ItemsSource="{Binding $parent[view:ToolbarAndMenuPageView].Fonts}"
         IsTextEditable="False" PopupMaxHeight="300"/>
    </mxb:ToolbarEditorItem.EditorProperties>
</mxb:ToolbarEditorItem>

Укажите редактор в шаблоне данных

Используйте свойство ToolbarEditorItem.EditorTemplate, чтобы указать редактор в шаблоне данных. В этом случае вам необходимо вручную задать значение для редактора (например, с помощью привязки данных).

<mxb:ToolbarEditorItem Width="150">
    <mxb:ToolbarEditorItem.EditorTemplate>
        <DataTemplate>
            <mxe:TextEditor EditorValue="{Binding Count}" Width="80"/>
        </DataTemplate>
    </mxb:ToolbarEditorItem.EditorTemplate>
</mxb:ToolbarEditorItem>

Измените и верните значение редактора

  • ToolbarEditorItem.EditorValue — Получает или устанавливает значение встроенного редактора. Используйте это свойство для привязки данных.

  • ToolbarEditorItem.EditorValueChanged — Событие, которое срабатывает после изменения значения редактора.

Эти элементы вступают в силу, когда вы используете свойство ToolbarEditorItem.EditorProperties для указания редактора.

Ширина страницы редактора

  • ToolbarEditorItem.EditorWidth — Возвращает или устанавливает ширину встроенного редактора. Это свойство вступает в силу, когда вы используете свойство ToolbarEditorItem.EditorProperties для указания редактора. Если вы указываете редактор в шаблоне данных, вы можете задать ширину редактора с помощью свойства ToolbarEditorItem.Width или задать ширину для самого редактора.

Подпись и Картинка

  • Header — Текст для отображения элемента.

  • Glyph — Картинка элемента. Объекты ToolbarEditorItem поддерживают только небольшие картинки. Размер небольших картинок определяется свойством RibbonControl.SmallGlyphSize в классическом размещении команд и свойством RibbonControl.GlyphSizeInSimplifiedLayout в упрощенном размещении команд.

  • GlyphTemplate — Пользовательский шаблон данных для рендеринга картинки элемента.

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

Текстовые метки (ToolbarTextItem)

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

ribbon-ToolbarTextItem

<mxb:ToolbarTextItem 
 Header="{Binding #scaleDecorator.Scale, StringFormat={}Zoom: {0:P0}}" 
 ShowBorder="False" 
 />

Подпись и Картинка

Свойства отображения текстовой метки

  • ToolbarTextItem.ShowBorder — Возвращает или устанавливает, видна ли граница элемента.

ribbon-ToolbarTextItem-bordered

Вы можете использовать свойство ToolbarTextItem.BorderTemplate, чтобы указать пользовательский шаблон для отрисовки границы. - ToolbarTextItem.BorderTemplate — Получает или устанавливает пользовательский шаблон для отрисовки границы элемента. Этот шаблон действует, если включена опция ToolbarTextItem.ShowBorder.

Смотрите также:

Неразрывные группы элементов (ToolbarItemGroup)

Используйте ToolbarItemGroup для создания неразрывного контейнера (группы) элементов панели инструментов. Элементы в этом контейнере всегда отображаются вместе в линию, и при изменении размера ленты они действуют как единое целое.

ribbon-ToolbarItemGroup

В Классическом размещении команд элементы ToolbarItemGroup поддерживают только небольшие картинки.

Содержание группы

Чтобы указать содержимое контейнера, определите элементы между начальным и конечным тегами <ToolbarItemGroup> в XAML или добавьте элементы в коллекцию ToolbarItemGroup.Items в коде.

<mxb:ToolbarItemGroup>
    <mxb:ToolbarButtonItem Header="Increase" KeyTip="CR" Glyph="{x:Static icons:Basic.Level_Increase}" />
    <mxb:ToolbarButtonItem Header="Decrease" KeyTip="DC" Glyph="{x:Static icons:Basic.Level_Reduce}" />
    <mxb:ToolbarButtonItem Header="Collapse" KeyTip="CL" Glyph="{x:Static icons:Basic.List_Collapse}" />
    <mxb:ToolbarButtonItem Header="Expand" KeyTip="EX" Glyph="{x:Static icons:Basic.List_Expand}" />
</mxb:ToolbarItemGroup>

Вы также можете использовать свойство ToolbarItemGroup.ItemsSource для заполнения контейнера элементами из коллекции бизнес-объектов, хранящихся в модели представления. Соответствующие шаблоны данных должны определять элементы ленты и инициализировать их свойства из нижележащих бизнес-объектов.

Смотрите также:

Неразрывные группы переключающих элементов (ToolbarCheckItemGroup)

Используйте ToolbarCheckItemGroup для создания неразрывного контейнера (группы) переключающих элементов (Объекты ToolbarCheckItem ). Подобно объекту ToolbarItemGroup, объект ToolbarCheckItemGroup действует как единое целое при изменении размера его родительского элемента (содержимое контейнера не может быть частично скрыто; элементы всегда отображаются в одной линии и не поддерживают перенос).

bars-ToolbarCheckItemGroup

Контейнер ToolbarCheckItemGroup может контролировать состояние нажатия для своих дочерних элементов ToolbarCheckItem. Вы можете использовать контейнер ToolbarCheckItemGroup для создания следующих типов групп:

  • Группа взаимоисключающих элементов (радиогруппа).
  • Группа, которая позволяет нажимать на несколько элементов одновременно.

В Классическом размещении команд элементы ToolbarCheckItemGroup поддерживают только небольшие картинки.

Содержание группы

Чтобы указать содержимое контейнера, определите элементы ToolbarCheckItem между начальным и конечным тегами <ToolbarCheckItemGroup> в XAML или добавьте элементы в коллекцию ToolbarCheckItemGroup.Items в коде.

<mxb:ToolbarCheckItemGroup>
    <mxb:ToolbarCheckItem Header="Bold" KeyTip="B" Glyph="{x:Static icons:Basic.Font_Bold}" />
    <mxb:ToolbarCheckItem Header="Italic" KeyTip="I" Glyph="{x:Static icons:Basic.Font_Italic}" />
    <mxb:ToolbarCheckItem Header="Underline" KeyTip="U" Glyph="{x:Static icons:Basic.Font_Underline}" />
</mxb:ToolbarCheckItemGroup>

Вы также можете использовать свойство ToolbarCheckItemGroup.ItemsSource для заполнения контейнера элементами из коллекции бизнес-объектов, хранящихся в модели представления. Соответствующие шаблоны данных должны определять элементы ленты и инициализировать их свойства из нижележащих бизнес-объектов.

Проверьте элементы группы

  • ToolbarCheckItemGroup.CheckType — Получает или устанавливает, может ли один или несколько элементов быть нажаты в группе одновременно. Поддерживаются следующие опции:

    • Default или Multiple — несколько элементов могут быть нажаты одновременно.
    • Radio — Группа взаимоисключающих элементов. Пользователь не может снять флажок с какого-либо элемента иначе, как установив другой.
    • Single — Группа взаимоисключающих элементов. Пользователь может снять флажки со всех элементов внутри группы.

  • ToolbarCheckItem.IsChecked — Возвращает или устанавливает состояние нажатия кнопки.

Смотрите также:

Разделители (ToolbarSeparatorItem)

Объект ToolbarSeparatorItem позволяет вставлять разделитель.

bars-toolbarseparatoritem

<mxb:ToolbarMenuItem Header="File" Category="File">
    <mxb:ToolbarButtonItem Header="New" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Context Menu, Icon=NewDraftAction.svg'}" 
     Category="File"/>
    <mxb:ToolbarButtonItem Header="Open" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Basic, Icon=Folder Open.svg'}" 
     Category="File"/>
    <mxb:ToolbarButtonItem Header="Save" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Basic, Icon=Save.svg'}" 
     Category="File"/>
    <mxb:ToolbarSeparatorItem/>
    <mxb:ToolbarButtonItem Header="Print" 
     Glyph="{SvgImage 'avares://DemoCenter/Images/Group=Basic, Icon=Print.svg'}" 
     Category="File"/>
</mxb:ToolbarMenuItem>

Галереи

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

ribbon-RibbonGalleryItem

Когда вы добавляете объект RibbonGalleryItem на традиционную панель инструментов или всплывающее меню, галерея отображается в виде подменю.

Смотрите следующую тему для получения дополнительной информации: Галереи

Горячие клавиши

Вы можете использовать свойство ToolbarItem.HotKey для назначения горячих клавиш элементам. 

<mxb:ToolbarButtonItem 
    Header="Open" Command="{Binding OpenCommand}" HotKey="Ctrl+O"
    Glyph="{x:Static icons:Basic.Folder_Open}"/>

Нажатие горячей клавиши активирует команду элемента при условии, что фокус находится в пределах области действия горячей клавиши. Дефолтная область действия горячих клавиш - это область пользовательского интерфейса в пределах компонента ToolbarManager. Когда фокус ввода находится за пределами области действия горячих клавиш, ToolbarManager не может перехватывать горячие клавиши.

Свойство ToolbarManager.IsWindowManager позволяет вам расширить область действия горячей клавиши на все окно. Когда вы устанавливаете для этого свойства значение true, компонент ToolbarManager регистрирует горячие клавиши элемента в окне. Он сможет перехватывать и обрабатывать горячие клавиши, даже если фокус находится за пределами его клиентской области.

Всплывающие подсказки

Используйте свойство ToolbarItem.Hint, чтобы указать всплывающие подсказки для элементов ленты:

<mxb:ToolbarButtonItem Header="Increase" HotKey="CTRL+J" 
  Glyph="{x:Static icons:Basic.Level_Increase}" 
  Hint="Increase the indent"/>

ribbon-tooltips

Смотрите также



* Эта страница была создана автоматически с помощью сервиса машинного перевода Яндекс Переводчик.