Class SfRibbon

Specifies the events available in the SfRibbon component.

Inheritance

System.Object

SfBaseComponent

SfRibbon

Inherited Members

SfBaseComponent.Dispose()

SfBaseComponent.Dispose(Boolean)

SfBaseComponent.OnObservableChange(String, Object, Boolean, NotifyCollectionChangedEventArgs)

Namespace: Syncfusion.Blazor.Ribbon

Assembly: Syncfusion.Blazor.dll

Syntax

public class SfRibbon : SfBaseComponent

Examples

A simple Ribbon component.

 
<SfRibbon ID="default">
 <RibbonFileMenuSettings></RibbonFileMenuSettings > 
 <HelpPaneTemplate></HelpPaneTemplate> 
    <RibbonTabs>
        <RibbonTab Header="Home">
            <RibbonGroups>
                <RibbonGroup HeaderText="Clipboard">
                    <RibbonCollections>
                        <RibbonCollection>
                            <RibbonItems>
                                <RibbonItem Type=RibbonItemType.Button AllowedSizes="@((RibbonItemSize)RibbonItemSize.Large | RibbonItemSize.Medium)">
                                    <RibbonButtonSettings Content="Copy" IconCss="e-icons e-copy"></RibbonButtonSettings>
                                </RibbonItem>
                            </RibbonItems>
                        </RibbonCollection>
                    </RibbonCollections>
                </RibbonGroup>
            </RibbonGroups>
        </RibbonTab>
    </RibbonTabs>
</SfRibbon>

Constructors

SfRibbon()

Declaration

public SfRibbon()

Properties

ActiveLayout

Gets or sets the active layout of the SfRibbon. Supports two-way binding.

Declaration

public RibbonLayout ActiveLayout { get; set; }

Property Value

Type	Description
RibbonLayout	The active layout of the SfRibbon. The default value is the Classic. The possible values are: Classic: Specifies the ribbon in classic layout. Simplified: Specifies the ribbon in simplified layout.

Remarks

You can use this property to customize the active layout of the SfRibbon. For example, you can set the RibbonLayout property to Classic to render the ribbon tab contents in classic layout, or set it to Simplified to render the ribbon tab contents in single row. Define @bind- ActiveLayout to use two-way binding.

ActiveLayoutChanged

Declaration

public EventCallback<RibbonLayout> ActiveLayoutChanged { get; set; }

Property Value

Type
Microsoft.AspNetCore.Components.EventCallback<RibbonLayout>

ChildContent

Gets or sets a value that indicates the child content for the Ribbon including HTML element.

Declaration

public RenderFragment ChildContent { get; set; }

Property Value

Type
Microsoft.AspNetCore.Components.RenderFragment

Created

Event raised when the rendering of the SfRibbon component is completed.

Declaration

public EventCallback<EventArgs> Created { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<System.EventArgs>	An event callback that is raised when the SfRibbon component is fully rendered.

CssClass

Gets or sets one or more CSS classes to customize the appearance of the SfRibbon.

Declaration

public string CssClass { get; set; }

Property Value

Type	Description
System.String	Accepts a string of one or more CSS class names separated by spaces to customize the appearance of the SfRibbon. The default value is String.Empty, meaning no additional CSS classes are applied by default.

Remarks

This property allows you to apply custom CSS styles to the SfRibbon component by assigning one or more CSS class names. Use this property to tailor the appearance of the Ribbon to match the design requirements of your application or to apply custom themes and styles.

EnablePersistence

Gets or sets a value indicating whether the state of the modes and built-in items SfRibbon are persisted.

Declaration

public bool EnablePersistence { get; set; }

Property Value

Type	Description
System.Boolean	A boolean value that determines whether the current state of the SfRibbon is persisted. The default value is false.

Remarks

When set to true, the SfRibbon will save its current state of (built-in items and ribbon modes) and restore it when the application is restarted. This feature is useful for maintaining a consistent user experience across sessions. If set to false, the ribbon will not persist its state between application sessions and will reset to its default configuration upon startup.

HideLayoutSwitcher

Gets or sets a value indicating whether the layout switcher button of the SfRibbon is hidden.

Declaration

public bool HideLayoutSwitcher { get; set; }

Property Value

Type	Description
System.Boolean	A boolean value that determines whether the layout switcher button of the SfRibbon is hidden. The default value is false, means the button is visible by default.

Remarks

This property controls the visibility of the layout switcher button, which allows users to toggle between different Ribbon layout styles. When set to true, the button is hidden, preventing users from changing the Ribbon layout. When set to false, the button is visible and allows users to switch between available layout options.

ID

Gets or sets the unique ID for the SfRibbon.

Declaration

public string ID { get; set; }

Property Value

Type	Description
System.String	The ID of the SfRibbon. The default value is String.Empty.

Remarks

This property specifies a unique identifier for the SfRibbon component. The ID is used to uniquely identify the Ribbon within the HTML document, which can be useful for styling, scripting, and accessing the component programmatically.

IsMinimized

Gets or sets a value indicating whether the SfRibbon is minimized.

Declaration

public bool IsMinimized { get; set; }

Property Value

Type	Description
System.Boolean	A boolean value that determines whether the SfRibbon is minimized. The default value is false.

Remarks

When set to true, the SfRibbon component is minimized, typically hiding its content to provide more screen space for other parts of the application. When set to false, the SfRibbon is fully visible, displaying all of its tabs and content. This is the default state where the Ribbon is fully expanded and accessible to the user.

LauncherIconClick

Event raised when the launcher icon is clicked in a SfRibbon group.

Declaration

public EventCallback<LauncherClickEventArgs> LauncherIconClick { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<LauncherClickEventArgs>	An event callback that is triggered when the launcher icon is clicked.

OverflowPopupClosing

Event raised before the overflow popup closes in the SfRibbon component.

Declaration

public EventCallback<OverflowPopupEventArgs> OverflowPopupClosing { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<OverflowPopupEventArgs>	An event callback that is triggered before the overflow popup closes.

OverflowPopupOpening

Event raised before the overflow popup opens in the SfRibbon component.

Declaration

public EventCallback<OverflowPopupEventArgs> OverflowPopupOpening { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<OverflowPopupEventArgs>	An event callback that is triggered before the overflow popup opens.

RibbonCollapsing

Event raised before the SfRibbon component is collapsed.

Declaration

public EventCallback<CollapseEventArgs> RibbonCollapsing { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<CollapseEventArgs>	An event callback that is triggered before the SfRibbon component is collapsed.

RibbonExpanding

Event raised before the SfRibbon component is expanded.

Declaration

public EventCallback<ExpandEventArgs> RibbonExpanding { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<ExpandEventArgs>	An event callback that is triggered before the SfRibbon component is expanded.

SelectedTab

Gets or sets the index of the selected tab in the SfRibbon component.

Declaration

public int SelectedTab { get; set; }

Property Value

Type	Description
System.Int32	An integer representing the index of the currently selected tab. The default value is 0.

Remarks

This property specifies which tab is currently active and selected in the SfRibbon component.

TabAnimation

Gets or sets the animation settings of the SfRibbon.

Declaration

public TabAnimationSettings TabAnimation { get; set; }

Property Value

Type	Description
TabAnimationSettings	The animation settings of the SfRibbon. The default value is null.

Remarks

This property allows you to customize the animation settings of the SfRibbon.

Examples

A simple Ribbon component.

 
<SfRibbon ID="default" TabAnimation="@tabAnimationSettings">
    <RibbonTabs>
        <RibbonTab Header="Home">
            <RibbonGroups>
                <RibbonGroup Header="Clip">
                    <RibbonCollections>
                        <RibbonCollection>
                            <RibbonItems>
                                <RibbonItem Type=RibbonItemType.Button>
                                    <RibbonButtonSettings Content="Copy" IconCss="e-icons e-copy"></RibbonButtonSettings>
                                </RibbonItem>
                            </RibbonItems>
                        </RibbonCollection>
                    </RibbonCollections>
                </RibbonGroup>
            </RibbonGroups>
        </RibbonTab>
    </RibbonTabs>
</SfRibbon>
@code {
       public TabAnimationSettings tabAnimationSettings = new TabAnimationSettings
       {
           Previous = new TabAnimationPrevious { Effect = Syncfusion.Blazor.AnimationEffect.FadeIn },
           Next = new TabAnimationNext { Effect = Syncfusion.Blazor.AnimationEffect.FadeOut }
       };
}

Tabs

Declaration

public List<RibbonTab> Tabs { get; set; }

Property Value

Type
System.Collections.Generic.List<RibbonTab>

TabSelected

Event raised after a tab is selected in the SfRibbon component.

Declaration

public EventCallback<TabSelectedEventArgs> TabSelected { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TabSelectedEventArgs>	An event callback that is triggered after a tab is selected.

TabSelecting

Event raised before a tab is selected in the SfRibbon component.

Declaration

public EventCallback<TabSelectingEventArgs> TabSelecting { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TabSelectingEventArgs>	An event callback that is triggered before a tab is selected.

Width

Gets or sets the width of the SfRibbon.

Declaration

public string Width { get; set; }

Property Value

Type	Description
System.String	The width of the SfRibbon. The default value is "100%".

Remarks

This property specifies the width of the SfRibbon component. You can set this property to a specific pixel value (e.g., "800px") or a percentage value (e.g., "100%") to control the width of the Ribbon relative to its container. A value of "100%" makes the Ribbon occupy the full width of its parent container, adapting to the container's width.

Methods

AddCollection(String, RibbonCollection, String, Boolean)

Adds a new collection to the ribbon group with the specified ID in the SfRibbon component.

Declaration

public void AddCollection(string groupID, RibbonCollection collection, string targetID = null, bool isAfter = false)

Parameters

Type	Name	Description
System.String	groupID	The ID of the ribbon group to add the collection to.
RibbonCollection	collection	The ribbon collection model to add.
System.String	targetID	The ID of the target collection to add the new collection (optional).
System.Boolean	isAfter	A boolean value that defines whether the collection is added before or after the target (optional).

AddGroup(String, RibbonGroup, String, Boolean)

Adds a new group to the ribbon tab with the specified ID in the SfRibbon component.

Declaration

public void AddGroup(string tabID, RibbonGroup group, string targetID = null, bool isAfter = false)

Parameters

Type	Name	Description
System.String	tabID	The ID of the ribbon tab to add the group to.
RibbonGroup	group	The ribbon group model to add.
System.String	targetID	The ID of the target group to add the new group (optional).
System.Boolean	isAfter	A boolean value that defines whether the group is added before or after the target (optional).

AddItem(String, RibbonItem, String, Boolean)

Adds a new item to the ribbon tab with the specified ID in the SfRibbon component.

Declaration

public void AddItem(string collectionId, RibbonItem item, string targetID = null, bool isAfter = false)

Parameters

Type	Name	Description
System.String	collectionId	The ID of the ribbon collection to add the item to.
RibbonItem	item	The ribbon item model to add.
System.String	targetID	The ID of the target item to add the new item (optional).
System.Boolean	isAfter	A boolean value that defines whether the item is added before or after the target (optional).

AddTab(RibbonTab, String, Boolean)

Adds a new tab to the ribbon with the specified ID in the SfRibbon component.

Declaration

public void AddTab(RibbonTab tab, string targetID = null, bool isAfter = false)

Parameters

Type	Name	Description
RibbonTab	tab	The ribbon tab model to add.
System.String	targetID	The ID of the target tab to add the new tab (optional).
System.Boolean	isAfter	A boolean value that defines whether the tab is added before or after the target (optional).

BuildRenderTree(RenderTreeBuilder)

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder	__builder

CreateShrinkContainer(String, String, String, String, String, Boolean)

Declaration

public Task CreateShrinkContainer(string start, string end, string largeWidth, string collectionId, string groupId, bool isRemove = false)

Parameters

Type	Name	Description
System.String	start
System.String	end
System.String	largeWidth
System.String	collectionId
System.String	groupId
System.Boolean	isRemove

Returns

Type
System.Threading.Tasks.Task

DisableGroup(String)

Disables the group with the specified ID in the SfRibbon component.

Declaration

public void DisableGroup(string groupID)

Parameters

Type	Name	Description
System.String	groupID	The ID of the group to disable.

DisableItem(String)

Disables the item with the specified ID in the SfRibbon component.

Declaration

public void DisableItem(string itemID)

Parameters

Type	Name	Description
System.String	itemID	The ID of the item to disable.

DisableTabAsync(String)

Disables the tab with the specified ID in the SfRibbon component.

Declaration

public Task DisableTabAsync(string tabID)

Parameters

Type	Name	Description
System.String	tabID	The ID of the tab to disable.

Returns

Type
System.Threading.Tasks.Task

EnableGroup(String)

Enables the group with the specified ID in the SfRibbon component.

Declaration

public void EnableGroup(string groupID)

Parameters

Type	Name	Description
System.String	groupID	The ID of the group to enable.

EnableItem(String)

Enables the item with the specified ID in the SfRibbon component.

Declaration

public void EnableItem(string itemID)

Parameters

Type	Name	Description
System.String	itemID	The ID of the item to enable.

EnableTabAsync(String)

Enables the tab with the specified ID in the SfRibbon component.

Declaration

public Task EnableTabAsync(string tabID)

Parameters

Type	Name	Description
System.String	tabID	The ID of the tab to enable.

Returns

Type
System.Threading.Tasks.Task

GalleryPopupDocumentClickHandler(MouseEventArgs, String)

Declaration

public Task<bool> GalleryPopupDocumentClickHandler(MouseEventArgs args, string itemId)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Web.MouseEventArgs	args
System.String	itemId

Returns

Type
System.Threading.Tasks.Task<System.Boolean>

GetItem(String)

Retrieves a RibbonItem instance by its identifier.

Declaration

public RibbonItem GetItem(string itemId)

Parameters

Type	Name	Description
System.String	itemId	The unique identifier of the ribbon item to locate.

Returns

Type	Description
RibbonItem	A RibbonItem instance matching the specified itemId if found; otherwise, null.

Remarks

Use this method to obtain a specific ribbon item's information.

OnAfterRenderAsync(Boolean)

Declaration

protected override Task OnAfterRenderAsync(bool firstRender)

Parameters

Type	Name	Description
System.Boolean	firstRender

Returns

Type
System.Threading.Tasks.Task

Overrides

SfBaseComponent.OnAfterRenderAsync(Boolean)

OnInitializedAsync()

Declaration

protected override Task OnInitializedAsync()

Returns

Type
System.Threading.Tasks.Task

Overrides

SfBaseComponent.OnInitializedAsync()

OnParametersSetAsync()

Declaration

protected override Task OnParametersSetAsync()

Returns

Type
System.Threading.Tasks.Task

RefreshLayoutAsync()

Refreshes the layout of the ribbon, ensuring that it checks for overflow and adjusts the display of items accordingly.

Declaration

public Task RefreshLayoutAsync()

Returns

Type	Description
System.Threading.Tasks.Task	A task that represents the asynchronous operation of refreshing the ribbon layout.

Remarks

This method is used to recalculate the ribbon's layout. It is particularly useful when dynamic changes have occurred, and the visual arrangement needs to be updated to maintain a consistent user interface.

RemoveCollection(String)

Removes the collection with the specified ID from the SfRibbon component.

Declaration

public void RemoveCollection(string collectionID)

Parameters

Type	Name	Description
System.String	collectionID	The ID of the collection to remove.

RemoveGroup(String)

Removes the group with the specified ID from the SfRibbon component.

Declaration

public void RemoveGroup(string groupID)

Parameters

Type	Name	Description
System.String	groupID	The ID of the group to remove.

RemoveItem(String)

Removes the item with the specified ID from the SfRibbon component.

Declaration

public void RemoveItem(string itemID)

Parameters

Type	Name	Description
System.String	itemID	The ID of the item to remove.

RemoveTab(String)

Removes the tab with the specified ID from the SfRibbon component.

Declaration

public void RemoveTab(string tabID)

Parameters

Type	Name	Description
System.String	tabID	The ID of the tab to remove.

ToggleOverflowDropDown(Boolean, String, String, Boolean, Boolean)

Declaration

public Task ToggleOverflowDropDown(bool value, string groupId, string itemId, bool isItem, bool isBulkUpdate)

Parameters

Type	Name	Description
System.Boolean	value
System.String	groupId
System.String	itemId
System.Boolean	isItem
System.Boolean	isBulkUpdate

Returns

Type
System.Threading.Tasks.Task

ToggleOverflowDropdownsInBulk(String)

Declaration

public Task ToggleOverflowDropdownsInBulk(string overflowDropdownParamsJson)

Parameters

Type	Name	Description
System.String	overflowDropdownParamsJson

Returns

Type
System.Threading.Tasks.Task

UpdateBackstageClosingState()

Declaration

public void UpdateBackstageClosingState()

UpdateDataAttribute(String, String, Boolean)

Declaration

public Task UpdateDataAttribute(string id, string width, bool isSimplifiedWidth)

Parameters

Type	Name	Description
System.String	id
System.String	width
System.Boolean	isSimplifiedWidth

Returns

Type
System.Threading.Tasks.Task

UpdateGalleryHiddenItems(List<String>)

Declaration

public void UpdateGalleryHiddenItems(List<string> galleryItemIds)

Parameters

Type	Name	Description
System.Collections.Generic.List<System.String>	galleryItemIds

UpdateItemSize(List<String>, RibbonItemSize)

Declaration

public Task UpdateItemSize(List<string> itemIds, RibbonItemSize size)

Parameters

Type	Name	Description
System.Collections.Generic.List<System.String>	itemIds
RibbonItemSize	size

Returns

Type
System.Threading.Tasks.Task

UpdateLoadingState(Boolean)

Declaration

public Task UpdateLoadingState(bool isLoad)

Parameters

Type	Name	Description
System.Boolean	isLoad

Returns

Type
System.Threading.Tasks.Task

UpdateShrinkable(Boolean, List<String>, List<String>)

Declaration

public Task UpdateShrinkable(bool isShrinkable, List<string> itemIds, List<string> collectionId)

Parameters

Type	Name	Description
System.Boolean	isShrinkable
System.Collections.Generic.List<System.String>	itemIds
System.Collections.Generic.List<System.String>	collectionId

Returns

Type
System.Threading.Tasks.Task