Ribbon

This documentation provides a comprehensive reference for the Ribbon component, guiding you through its configuration options.
Demos

Screenshot #

Blazor Ribbon Component

Ribbon Parameters #

Name Type Default Required Description Added Version
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
ChildContent RenderFragment? null Gets or sets the content to be rendered within the component. 2.2.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
EnableFadeEffect bool False Gets or sets the tabs fade effect. 2.2.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0

Ribbon Methods #

Name Return type Description Added Version
RemoveTabByIndex(int tabIndex) Void Removes the tab by index. 2.2.0
RemoveTabByName(string tabName) Void Removes the tab by name. 2.2.0
ShowFirstTabAsync() Task Selects the first tab and show its associated pane. 2.2.0
ShowLastTabAsync() Task Selects the last tab and show its associated pane. 2.2.0
ShowRecentTab() Void Shows the recently added tab. 2.2.0
ShowTabByIndexAsync(int tabIndex) Task Selects the tab by index and show its associated pane. 2.2.0
ShowTabByNameAsync(string tabName) Task Selects the tab by name and show its associated pane. 2.2.0

Ribbon Events #

Name Return Type Description Added Version
OnClick EventCallback<RibbonItemEventArgs> This event fires when the user clicks the corresponding RibbonItem. 2.2.0
OnHidden EventCallback<RibbonEventArgs> This event fires after a new tab is shown (and thus the previous active tab is hidden). 2.2.0
OnHiding EventCallback<RibbonEventArgs> This event fires when a new tab is to be shown (and thus the previous active tab is to be hidden). 2.2.0
OnShowing EventCallback<RibbonEventArgs> This event fires on tab show, but before the new tab has been shown. 2.2.0
OnShown EventCallback<RibbonEventArgs> This event fires on tab show after a tab has been shown. 2.2.0

RibbonEventArgs Properties #

Name Type Default Required Description Added Version
ActiveTabTitle string null Gets the active tab title. 1.0.0
PreviousActiveTabTitle string null Gets the previous active tab title. 1.0.0

RibbonTab Parameters #

Name Type Default Required Description Added Version
Active bool False Gets or sets the active state. 2.2.0
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
Content RenderFragment? null Gets or sets the content to be rendered within the component. 2.2.0
Disabled bool False Gets or sets the disabled state. 2.2.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
Name string? null Gets or sets the tab name. 2.2.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0
Title string? null Gets or sets the tab title. 2.2.0
TitleTemplate RenderFragment? null Gets or sets the tab title template. 2.2.0

RibbonTab Events #

Name Return Type Description Added Version
OnClick EventCallback<TabEventArgs> This event fires when the user clicks the corresponding tab button and the tab is displayed. 2.2.0

RibbonGroup Parameters #

Name Type Default Required Description Added Version
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
ChildContent RenderFragment? null Gets or sets the content to be rendered within the component. 2.2.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0

RibbonItemGroup Parameters #

Name Type Default Required Description Added Version
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
ChildContent RenderFragment? null Gets or sets the content to be rendered within the component. 2.2.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0
Text string? null Gets or sets the text. 2.2.0

RibbonItem Parameters #

Name Type Default Required Description Added Version
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
ChildContent RenderFragment? null Gets or sets the content to be rendered within the component. 2.2.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
CustomIconName string? null Gets or sets the custom icon name. 2.2.0
IconColor IconColor None Gets or sets the icon color. 2.2.0
IconCssClass string? null Gets or sets the icon CSS class. 2.2.0
IconName IconName None Gets or sets the icon name. 2.2.0
IconSize IconSize x3 Gets or sets the icon size. 2.2.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
ImgHeight double 28 Gets or sets the image hieght. The height of the image in pixels. 2.2.0
ImgSrc string? null Gets or sets the image source. 2.2.0
ImgWidth double 28 Gets or sets the image width. The width of the image in pixels. 2.2.0
IsFirstItem bool False Gets or sets the first item in the RibbonItemGroup. 2.2.0
IsLastItem bool False Gets or sets the last item in the RibbonItemGroup. 2.2.0
Name string? null Gets or sets the RibbonItem name. 2.2.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0
Text string? null Gets or sets the text to be displayed inside the RibbonItem. 2.2.0

Rejoining the server...

Rejoin failed... trying again in seconds.

Failed to rejoin.
Please retry or reload the page.

The session has been paused by the server.

Failed to resume the session.
Please reload the page.