RibbonControl Class

The ribbon control.

Namespace: DevExpress.UI.Xaml.Ribbon

Assembly: DevExpress.UI.Xaml.Ribbon.v21.2.dll

NuGet Package: DevExpress.Uwp.Controls

Declaration

C#
VB.NET

[Bindable]
[ContentProperty(Name = "Tabs")]
[TemplatePart(Name = "PART_HeaderControl", Type = typeof(RibbonHeaderControl))]
[TemplatePart(Name = "PART_HelpPane", Type = typeof(HelpPaneViewBase))]
[TemplatePart(Name = "PART_ShowBackstageButton", Type = typeof(UIElement))]
[TemplatePart(Name = "PART_ShowButton", Type = typeof(UIElement))]
[TemplatePart(Name = "PART_TitleBorder", Type = typeof(Border))]
[ToolboxTabName("DX.21.2: Common Controls")]
public class RibbonControl :
    RibbonControlBase,
    IWindowTitleCustomizer

<Bindable>
<ContentProperty(Name:="Tabs")>
<ToolboxTabName("DX.21.2: Common Controls")>
<TemplatePart(Name:="PART_TitleBorder", Type:=GetType(Border))>
<TemplatePart(Name:="PART_ShowButton", Type:=GetType(UIElement))>
<TemplatePart(Name:="PART_ShowBackstageButton", Type:=GetType(UIElement))>
<TemplatePart(Name:="PART_HeaderControl", Type:=GetType(RibbonHeaderControl))>
<TemplatePart(Name:="PART_HelpPane", Type:=GetType(HelpPaneViewBase))>
Public Class RibbonControl
    Inherits RibbonControlBase
    Implements IWindowTitleCustomizer

Remarks

The following code creates a simple Ribbon UI consisting of two tabs.

Ribbon-example

Buttons in the example do not implement any action. Please refer to the Feature Demo shipped with the installation for a thorough example.

XAML

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:RibbonSimpleDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Ribbon="using:DevExpress.UI.Xaml.Ribbon"
    x:Class="RibbonSimpleDemo.MainPage"
    mc:Ignorable="d" >

    <Page.Resources>
        <x:Boolean x:Key="TrueValue">True</x:Boolean>
    </Page.Resources>

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" >
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
        </Grid.RowDefinitions>

        <Ribbon:RibbonControl x:Name="myRibbon" Grid.Row="0" Title="Ribbon Simple Pad">
            <Ribbon:RibbonTab Caption="Home" >
                <Ribbon:RibbonGroup Caption="File">
                    <Ribbon:RibbonButton Content="Open"
                                         IconSource="ms-appx:///Icons/OpenDoc.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="GlyphWithText"
                                         CollapsePriority="Low"
                                         />
                </Ribbon:RibbonGroup>
                <Ribbon:RibbonGroup Caption="Edit">
                    <Ribbon:RibbonButton Content="Cut"
                                         IconSource="ms-appx:///Icons/Cut.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="GlyphWithText"
                                         CollapsePriority="Low"
                                         />
                    <Ribbon:RibbonButton Content="Copy"
                                         IconSource="ms-appx:///Icons/Copy.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="GlyphWithText"
                                         CollapsePriority="Low"
                                         />
                    <Ribbon:RibbonButton Content="Paste"
                                         IconSource="ms-appx:///Icons/Paste.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="GlyphWithText"
                                         CollapsePriority="Low"
                                         />
                </Ribbon:RibbonGroup>
                <Ribbon:RibbonGroup>
                    <Ribbon:RibbonCheckBox Content="Read-only"/>
                </Ribbon:RibbonGroup>
            </Ribbon:RibbonTab>
            <Ribbon:RibbonTab Caption="Format" >
                <Ribbon:RibbonGroup Caption="Font">
                    <Ribbon:RibbonToggleButton Content="Bold"
                                         IconSource="ms-appx:///Icons/Bold.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="Glyph"
                                         CollapsePriority="Low"
                                         IsChecked="{ThemeResource TrueValue}"
                                         />
                    <Ribbon:RibbonToggleButton Content="Italic"
                                         IconSource="ms-appx:///Icons/Italic.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="Glyph"
                                         CollapsePriority="Low"
                                         />
                    <Ribbon:RibbonToggleButton Content="Underline"
                                         IconSource="ms-appx:///Icons/Underline.png"
                                         IconWidth="32"
                                         IconHeight="32"
                                         ItemStyle="Glyph"
                                         CollapsePriority="Low"
                                         />
                </Ribbon:RibbonGroup>
            </Ribbon:RibbonTab>
        </Ribbon:RibbonControl>
        <RichEditBox Grid.Row="1" />
    </Grid>
</Page>