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

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 |