Class RibbonGallerySettings

Gets or sets the configuration options for a gallery-type item within the SfRibbon component.

Inheritance
object
ComponentBase
OwningComponentBase
SfOwningComponentBase
RibbonGallerySettings
Implements
Inherited Members
Namespace: Syncfusion.Blazor.Ribbon
Assembly: Syncfusion.Blazor.dll
Syntax
public class RibbonGallerySettings : SfOwningComponentBase, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Remarks

This property allows you to configure a visual gallery of items (such as styles, shapes, or templates) directly inside the ribbon. It supports multiple groups of items, custom item count, popup dimensions, selection handling, and custom templates for both inline and popup views.

Examples

Ribbon component with a gallery item displaying style previews:

@using Syncfusion.Blazor.Ribbon
<SfRibbon>
    <RibbonTabs>
        <RibbonTab HeaderText="Home">
            <RibbonGroups>
                <RibbonGroup HeaderText="Gallery">
                    <RibbonCollections>
                        <RibbonCollection>
                            <RibbonItems>
                                <RibbonItem Type="RibbonItemType.Gallery">
                                    <RibbonGallerySettings Groups="@galleryGroups"
                                                           PopupOpening="@PopupOpening"
                                                           PopupClosing="@PopupClosing"
                                                           ItemRendering="@ItemRendering"
                                                           ItemHover="@ItemHover"
                                                           Selecting="@Selecting"
                                                           Selected="@Selected">
                                    </RibbonGallerySettings>
                                </RibbonItem>
                            </RibbonItems>
                        </RibbonCollection>
                    </RibbonCollections>
                </RibbonGroup>
            </RibbonGroups>
        </RibbonTab>
    </RibbonTabs>
</SfRibbon>

@code {
    private void PopupOpening(GalleryPopupOpenEventArgs args) { /* your actions here */ }
    private void PopupClosing(GalleryPopupCloseEventArgs args) { /* your actions here */ }
    private void ItemHover(GalleryItemHoverEventArgs args) { /* your actions here */ }
    private void ItemRendering(GalleryItemRenderEventArgs args) { /* your actions here */ }
    private void Selecting(GallerySelectEventArgs args) { /* your actions here */ }
    private void Selected(GallerySelectedEventArgs args) { /* your actions here */ }

    List<GalleryGroup> galleryGroups = new List<GalleryGroup>
    {
        new GalleryGroup
        {
            Header = "Title and Headings",
            Items = new List<GalleryItem>
            {
                new GalleryItem { Content = "Heading 1" },
                new GalleryItem { Content = "Heading 2" },
                new GalleryItem { Content = "Heading 3" },
                new GalleryItem { Content = "Heading 4" }
            }
        }
    };
}

Constructors

RibbonGallerySettings()

Declaration
public RibbonGallerySettings()

Properties

Groups

Gets or sets the properties for the collection of gallery items in the Ribbon.

Declaration
[Parameter]
public List<GalleryGroup> Groups { get; set; }
Property Value
Type Description
List<GalleryGroup>

A list of GalleryGroup that represents the gallery groups. The default value is null.
Remarks

Use this property to configure multiple gallery groups, each containing a collection of items displayed in the Ribbon.

ItemCount

Gets or sets the number of items to be displayed in the Ribbon Gallery.

Declaration
[Parameter]
public int ItemCount { get; set; }
Property Value
Type Description
int

An integer representing the number of items in the gallery. The default value is 3.
Remarks

This property controls how many items are visible in the Ribbon Gallery at a time. Increasing this number will display more items.

ItemHover

Gets or sets an event callback that is raised when a user hovers over a gallery item.

Declaration
[Parameter]
public EventCallback<GalleryItemHoverEventArgs> ItemHover { get; set; }
Property Value
Type Description
EventCallback<GalleryItemHoverEventArgs>

An event callback function of type GalleryItemHoverEventArgs.
Remarks

Use this event to customize hover effects or display additional information.

ItemRendering

Gets or sets an event callback that is raised before rendering each gallery item.

Declaration
[Parameter]
public EventCallback<GalleryItemRenderEventArgs> ItemRendering { get; set; }
Property Value
Type Description
EventCallback<GalleryItemRenderEventArgs>

An event callback function of type GalleryItemRenderEventArgs.
Remarks

This event provides a way to customize the rendering of individual gallery items.

PopupClosing

Gets or sets an event callback that is raised when the gallery popup closes.

Declaration
[Parameter]
public EventCallback<GalleryPopupCloseEventArgs> PopupClosing { get; set; }
Property Value
Type Description
EventCallback<GalleryPopupCloseEventArgs>

An event callback function of type GalleryPopupCloseEventArgs.
Remarks

Use this event to handle logic before the gallery popup closes.

PopupHeight

Gets or sets the height of the Ribbon gallery popup.

Declaration
[Parameter]
public string PopupHeight { get; set; }
Property Value
Type Description
string

A string specifying the height of the popup. The default value is "auto".
Remarks

The height can be specified in pixel values or other CSS-supported units. The default setting adjusts the height automatically based on the content.

PopupOpening

Gets or sets an event callback that is raised when the gallery popup opens.

Declaration
[Parameter]
public EventCallback<GalleryPopupOpenEventArgs> PopupOpening { get; set; }
Property Value
Type Description
EventCallback<GalleryPopupOpenEventArgs>

An event callback function of type GalleryPopupOpenEventArgs.
Remarks

This event is triggered when the Ribbon Gallery popup opens.

PopupTemplate

Sets the template for the gallery items in the popup.

Declaration
[Parameter]
[JsonIgnore]
public RenderFragment<GalleryItemContext> PopupTemplate { get; set; }
Property Value
Type Description
RenderFragment<GalleryItemContext>

A context of GalleryItemContext that specifies the template for the gallery items in the popup. The default value is null.
Remarks

Use this property to customize the content of items displayed in the Ribbon Gallery popup.

PopupWidth

Gets or sets the width of the Ribbon gallery popup.

Declaration
[Parameter]
public string PopupWidth { get; set; }
Property Value
Type Description
string

A string specifying the width of the popup. The default value is "auto".
Remarks

The width can be specified in pixel values or other CSS-supported units. The default setting adjusts the width automatically based on the content.

Selected

Gets or sets an event callback that is raised when the gallery item is selected.

Declaration
[Parameter]
public EventCallback<GallerySelectedEventArgs> Selected { get; set; }
Property Value
Type Description
EventCallback<GallerySelectedEventArgs>

An event callback function of type GallerySelectedEventArgs.
Remarks

Use this event to handle actions when an item is selected.

SelectedItemIndex

Gets or sets the index of the currently selected gallery item. Supports two-way binding.

Declaration
[Parameter]
public int SelectedItemIndex { get; set; }
Property Value
Type Description
int

An integer representing the index of the selected item. The default value is 0.
Remarks

This property specifies which item is currently selected in the gallery. Indexing starts at 0, so the first item is at index 0. Define @bind-SelectedItemIndex to use two-way binding.

SelectedItemIndexChanged

Event raised when the SelectedItemIndex property value has changed.

Declaration
[Parameter]
public EventCallback<int> SelectedItemIndexChanged { get; set; }
Property Value
Type
EventCallback<int>

Selecting

Gets or sets an event callback that is raised when selecting a gallery item.

Declaration
[Parameter]
public EventCallback<GallerySelectEventArgs> Selecting { get; set; }
Property Value
Type Description
EventCallback<GallerySelectEventArgs>

An event callback function of type GallerySelectEventArgs.
Remarks

This event is triggered before a gallery item is selected, allowing you to cancel the action if needed.

Template

Sets the template for the gallery item contents.

Declaration
[Parameter]
[JsonIgnore]
public RenderFragment<GalleryItemContext> Template { get; set; }
Property Value
Type Description
RenderFragment<GalleryItemContext>

A context of GalleryItemContext that specifies the template for the gallery items. The default value is null.
Remarks

This property allows you to define a custom template for the content of each gallery item.

Methods

Dispose(bool)

Declaration
protected override void Dispose(bool disposing)
Parameters
Type Name Description
bool disposing
Overrides

OnInitializedAsync()

Declaration
protected override Task OnInitializedAsync()
Returns
Type
Task
Overrides

Implements