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: Enumeration Description Small Displays only the Image. Normal Displays image along with the content in Horizontal arrangement. Large Displays 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: Enumeration Description Normal The IRibbonItem gets displayed when SfRibbon is in Normal. Simplified The IRibbonItem gets displayed when SfRibbon is in Simplified. Overflow The 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