menu

WinUI

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class RibbonGallery - WinUI API Reference | Syncfusion

    Show / Hide Table of Contents

    Class RibbonGallery

    Represents a control that displays a set of related items or commands in a visually rich format.

    Inheritance
    System.Object
    RibbonGallery
    Implements
    IRibbonElement
    IRibbonItem
    System.IDisposable
    Namespace: Syncfusion.UI.Xaml.Ribbon
    Assembly: Syncfusion.Ribbon.WinUI.dll
    Syntax
    public class RibbonGallery : Control, IRibbonElement, IRibbonItem, IDisposable
    Remarks

    The RibbonGallery control arranges the items in a uniform order. It allows to view the items by grouping when the control is expanded.

    Examples

    This code example shows how to declare and use RibbonGallery control.

    <ribbon:RibbonGallery x:Name="ribbonGallery">
        <ribbon:RibbonGallery.Items>
            <ribbon:RibbonGalleryItem Content="Normal"/>
            <ribbon:RibbonGalleryItem Content="Bad"/>
            <ribbon:RibbonGalleryItem Content="Good"/>
            <ribbon:RibbonGalleryItem Content="Neutral"/>
        </ribbon:RibbonGallery.Items>
    </ribbon:RibbonGallery>

    Constructors

    RibbonGallery()

    Initializes a new instance of the RibbonGallery class.

    Declaration
    public RibbonGallery()

    Fields

    AllowedSizeModesProperty

    Identifies the AllowedSizeModes property.

    Declaration
    public static readonly DependencyProperty AllowedSizeModesProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    DisplayOptionsProperty

    Identifies the DisplayOptions property.

    Declaration
    public static readonly DependencyProperty DisplayOptionsProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    IsExpandedProperty

    Identifies the IsExpanded dependency property.

    Declaration
    public static readonly DependencyProperty IsExpandedProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ItemContainerStyleProperty

    Identifies the ItemContainerStyle dependency property.

    Declaration
    public static readonly DependencyProperty ItemContainerStyleProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ItemHeightProperty

    Identifies the ItemHeight dependency property.

    Declaration
    public static readonly DependencyProperty ItemHeightProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ItemsProperty

    Identifies the Items dependency property.

    Declaration
    public static readonly DependencyProperty ItemsProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ItemsSourceProperty

    Identifies the ItemsSource dependency property.

    Declaration
    public static readonly DependencyProperty ItemsSourceProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ItemTemplateProperty

    Identifies the ItemTemplate dependency property.

    Declaration
    public static readonly DependencyProperty ItemTemplateProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ItemWidthProperty

    Identifies the ItemWidth dependency property.

    Declaration
    public static readonly DependencyProperty ItemWidthProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    MaxColumnCountProperty

    Identifies the MaxColumnCount dependency property.

    Declaration
    public static readonly DependencyProperty MaxColumnCountProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ScreenTipProperty

    Identifies the ScreenTip property.

    Declaration
    public static readonly DependencyProperty ScreenTipProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    SelectedItemProperty

    Identifies the SelectedItem dependency property.

    Declaration
    public static readonly DependencyProperty SelectedItemProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    Properties

    AllowedSizeModes

    Gets or sets the size mode options for ribbon element. Using any of these options, the ribbon element gets arranged when resizing the ribbon.

    Declaration
    public RibbonElementSizeModes AllowedSizeModes { get; set; }
    Property Value
    Type Description
    RibbonElementSizeModes

    The default value is Large | Normal | Small. Fields:

    EnumerationDescription
    SmallDisplays only the Image.
    NormalDisplays image along with the content in Horizontal arrangement.
    LargeDisplays image along with the content in Vertical arrangement.

    DisplayOptions

    Gets or sets the way that the ribbon items are displayed in different LayoutModeOptions.

    Declaration
    public DisplayOptions DisplayOptions { get; set; }
    Property Value
    Type Description
    DisplayOptions

    The default value is Normal | Simplified. Fields:

    EnumerationDescription
    NormalThe IRibbonItem gets displayed when SfRibbon is in Normal.
    SimplifiedThe IRibbonItem gets displayed when SfRibbon is in Simplified.
    OverflowThe IRibbonItem gets displayed in overflow menu when SfRibbon is in Simplified.

    Icon

    Gets or sets an icon that appears in a IRibbonItem

    Declaration
    public IconElement Icon { get; set; }
    Property Value
    Type
    Microsoft.UI.Xaml.Controls.IconElement

    IsExpanded

    Gets a value indicating whether RibbonGallery displays its items in expand mode.

    Declaration
    public bool IsExpanded { get; }
    Property Value
    Type Description
    System.Boolean

    true if the RibbonGallery is expanded; otherwise, false.The default value is false.

    ItemContainerStyle

    Gets or sets the style that is used when rendering the item containers.

    Declaration
    public Style ItemContainerStyle { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Style

    The Style that is applied to all items in RibbonGallery. The default value is null.

    Examples

    This example demonstrates how to set ItemContainerStyle in XAML.

    <ribbon:RibbonGallery x:Name="ribbonGallery">
        <ribbon:RibbonGallery.ItemContainerStyle>
             inlineStyle
        </ribbon:RibbonGallery.ItemContainerStyle>
    </ribbon:RibbonGallery>
    - or -
    <ribbon:RibbonGallery ItemContainerStyle="{StaticResource RibbonGalleryItemContainerStyle}" />

    ItemHeight

    Gets or sets a value of RibbonGalleryItem height which gets arranged inside RibbonGallery control.

    Declaration
    public double ItemHeight { get; set; }
    Property Value
    Type Description
    System.Double

    A double that represents the uniform height of all items that are contained within the RibbonGallery. The default value is 28.

    Items

    Gets the collection of RibbonGalleryItem to arrange in RibbonGallery control.

    Declaration
    public IList<RibbonGalleryItem> Items { get; }
    Property Value
    Type Description
    System.Collections.Generic.IList<RibbonGalleryItem>

    The collection that is used to generate the content of the RibbonGallery control. The default value is an empty collection.

    ItemsSource

    Gets or sets an object source used to generate the content of the RibbonGallery.

    Declaration
    public object ItemsSource { get; set; }
    Property Value
    Type Description
    System.Object

    A collection that is used to generate the content of the RibbonGallery. The default value is null.

    ItemTemplate

    Gets or sets the data template for the content view in RibbonGalleryItem.

    Declaration
    public DataTemplate ItemTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    The template that defines the visual representation of the content view. The default value is null.

    Examples

    This example demonstrates how to set ItemTemplate in XAML.

    <ribbon:RibbonGallery x:Name="ribbonGallery" 
                          ItemsSource="{Binding FontStyles}">
        <ribbon:RibbonGallery.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Margin="5"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"
                       Text="{Binding FontText}"
                       TextTrimming="Clip" />
                    <TextBlock Margin="5"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Bottom"
                       Text="{Binding FontDescription}"
                       TextTrimming="CharacterEllipsis" />
                </StackPanel>
            </DataTemplate>
        </ribbon:RibbonGallery.ItemTemplate>
    </ribbon:RibbonGallery>

    ItemWidth

    Gets or sets a value of RibbonGalleryItem width which gets arranged inside RibbonGallery control.

    Declaration
    public double ItemWidth { get; set; }
    Property Value
    Type Description
    System.Double

    A double that represents the uniform width of all items that are contained within the RibbonGallery.The default value is 88.

    MaxColumnCount

    Gets or sets a value that influences the wrap point, also accounting for orientation.

    Declaration
    public int MaxColumnCount { get; set; }
    Property Value
    Type Description
    System.Int32

    The maximum column that this RibbonGallery should present before it introduces wrapping to the layout. The default value is 5, which is a special value that indicates maximum.

    ScreenTip

    Gets or sets the ScreenTip that is used to show a pop-up window when the pointer hovers over a ribbon item to provide details about its functionality.

    Declaration
    public ScreenTip ScreenTip { get; set; }
    Property Value
    Type Description
    ScreenTip

    The default is null. 

    Examples
    <ribbon:RibbonGallery x:Name="ribbonGallery">
         <ribbon:RibbonGallery.Items>
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Background="White"
                   Content="Normal"
                   Foreground="Black" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Background="#ffc7ce"
                   Content="Bad"
                   Foreground="#be0006" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Background="#c6efce"
                   Content="Good"
                   Foreground="#007b74" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Background="#ffeb9c"
                   Content="Neutral"
                   Foreground="#df8c00" />
             <ribbon:RibbonGalleryItem Content="Calculation"
                   Background="#f2f2f2"
                   HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Foreground="#fa7d36" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Background="#a5a5a5"
                   Content="Check Cell"
                   Foreground="White" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Foreground="#7f7f7f"
                   Content="Explanatory Text"
                   FontStyle="Italic" >
             </ribbon:RibbonGalleryItem>
             <ribbon:RibbonGalleryItem Content="Input"
                   HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Foreground="#3f5a88"
                   Background="#ffcc99" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Content="Linked Cell"
                   Foreground="Orange" />
             <ribbon:RibbonGalleryItem  Background="#ffffcc"
                    Content="Note"
                    HorizontalContentAlignment="Center"
                    VerticalContentAlignment="Center"
                    Foreground="#3a0000" />
             <ribbon:RibbonGalleryItem Content="Output"
                   Background="#f2f2f2"
                   FontWeight="Bold"
                   Foreground="#3f3f3f"
                   HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center" />
             <ribbon:RibbonGalleryItem HorizontalContentAlignment="Center"
                   VerticalContentAlignment="Center"
                   Content="Warning Text"
                   Foreground="Red" />
         </ribbon:RibbonGallery.Items>
         <ribbon:RibbonGallery.ScreenTip>
             <ribbon:ScreenTip Title="FontStyle" Content="Style give your document a consistent, polished look"/>
         </ribbon:RibbonGallery.ScreenTip>
    </ribbon:RibbonGallery>

    SelectedItem

    Gets or sets the currently selected item in the RibbonGallery.

    Declaration
    public object SelectedItem { get; set; }
    Property Value
    Type Description
    System.Object

    An object that represents the current selection in the control. The default value is null.

    Remarks

    This property is used to determine the currently selected item by both user interaction and binding.

    Methods

    Dispose()

    Release the unmanaged resources of RibbonGallery.

    Declaration
    public void Dispose()

    Dispose(Boolean)

    Release the unmanaged resources of RibbonGallery.

    Declaration
    protected virtual void Dispose(bool isDisposing)
    Parameters
    Type Name Description
    System.Boolean isDisposing

    true if unmanaged resources should be disposed; otherwise, false.

    OnApplyTemplate()

    Contains the template logic of RibbonGallery.

    Declaration
    protected override void OnApplyTemplate()

    OnCreateAutomationPeer()

    Declaration
    protected override AutomationPeer OnCreateAutomationPeer()
    Returns
    Type
    Microsoft.UI.Xaml.Automation.Peers.AutomationPeer

    Events

    ItemPointerEnter

    This event occurs when a pointer enters the hit test area of any gallery item within this control.

    Declaration
    public event EventHandler<RibbonRoutedEventArgs> ItemPointerEnter
    Event Type
    Type
    System.EventHandler<RibbonRoutedEventArgs>
    Remarks

    The PointerEntered event is triggered when a pointer moves into the RibbonGalleryItem's bounding area.

    ItemPointerExit

    This event occurs when a pointer leaves the hit test area of any gallery item within this control.

    Declaration
    public event EventHandler<RibbonRoutedEventArgs> ItemPointerExit
    Event Type
    Type
    System.EventHandler<RibbonRoutedEventArgs>
    Remarks

    The PointerExited event is triggered when a pointer that was initially in the bounding area RibbonGalleryItem leaves that bounding area.

    SelectionChanged

    Occurs when the currently selected RibbonGalleryItem changes in RibbonGallery.

    Declaration
    public event SelectionChangedEventHandler SelectionChanged
    Event Type
    Type
    Microsoft.UI.Xaml.Controls.SelectionChangedEventHandler
    Remarks

    This event occurs whenever a selection is changed. A selection can be changed not only through user interaction, but also through binding and other set values.

    Explicit Interface Implementations

    IRibbonElement.ActiveSizeMode

    Gets or sets the current SizeMode value of ribbon item which represent the how the image and content of ribbon items get arranged.

    Declaration
    SizeMode IRibbonElement.ActiveSizeMode { get; set; }
    Returns
    Type Description
    SizeMode

    Small mode arrange the ribbon item only with image, Normal mode arrange the ribbon item with image and content in horizontal layout, where in Large mode arrange the ribbon with image and content in vertical layout. The default value is Normal.

    IRibbonItem.Clone()

    This method is used to clone the RibbonGallery control.

    Declaration
    FrameworkElement IRibbonItem.Clone()
    Returns
    Type
    Microsoft.UI.Xaml.FrameworkElement

    Implements

    IRibbonElement
    IRibbonItem
    System.IDisposable
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved