Class SfTab
Tab is a content panel to show multiple contents in a compact space. Also, only one tab is active at a time. Each Tab item has an associated content, that will be displayed based on the active Tab.
Inheritance
Namespace: Syncfusion.Blazor.Navigations
Assembly: Syncfusion.Blazor.dll
Syntax
public class SfTab : SfBaseComponent
Constructors
SfTab()
Declaration
public SfTab()
Properties
Animation
Specifies the animation settings of the Tabs component. The animation effect can be applied to activate the tab with duration and delay.
Declaration
public TabAnimationSettings Animation { get; set; }
Property Value
Type | Description |
---|---|
TabAnimationSettings |
ChildContent
Child Content for Tab.
Declaration
public RenderFragment ChildContent { get; set; }
Property Value
Type | Description |
---|---|
Microsoft.AspNetCore.Components.RenderFragment |
CssClass
Sets the CSS classes to the root element of the Tabs that helps to customize the component styles.
Declaration
public string CssClass { get; set; }
Property Value
Type | Description |
---|---|
System.String |
EnablePersistence
Enable or disable persisting component's state between page reloads. If enabled, the tab’s selected item will be persisted.
Declaration
public bool EnablePersistence { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
EnableRtl
Enable or disable rendering component in the right to left (RTL) direction.
Declaration
public bool EnableRtl { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
HeaderPlacement
Specifies the orientation of the Tab header. The possible values are:
- Top: Places the Tab header on the top.
- Bottom: Places the Tab header at the bottom.
- Left: Places the Tab header at the left.
- Right: Places the Tab header at the right.
Declaration
public HeaderPosition HeaderPlacement { get; set; }
Property Value
Type | Description |
---|---|
HeaderPosition |
Height
Specifies the height of the Tabs component. By default, Tab height is set based on the height of its parent.
Declaration
public string Height { get; set; }
Property Value
Type | Description |
---|---|
System.String |
HtmlAttributes
You can add the additional html attributes such as id, title etc., to the tab element. If you configured both property and equivalent html attribute then the component considers the property value.
Declaration
public Dictionary<string, object> HtmlAttributes { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.Dictionary<System.String, System.Object> |
ID
Sets ID attribute for the tab element.
Declaration
public string ID { get; set; }
Property Value
Type | Description |
---|---|
System.String |
Items
A list of items that are used to configure the Tabs component.
Declaration
public List<TabItem> Items { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.List<TabItem> |
LoadOn
Specifies the modes for the Tab content.
The possible modes are:
Dynamic
Load the Tab content dynamically, which is rendering its content when switching its header.
Init
Loads all the tab contents on initial loading.
Demand
Loads the Tab content when required but keeps the content once it is rendered.
Declaration
public ContentLoad LoadOn { get; set; }
Property Value
Type | Description |
---|---|
ContentLoad |
Locale
Overrides the global culture and localization value for this component. Default global culture is 'en-US'.
Declaration
public string Locale { get; set; }
Property Value
Type | Description |
---|---|
System.String |
OverflowMode
Specifies the display mode which will be applied when the Tabs exceeds the viewing area. The possible modes are:
- Scrollable: All the elements will be displayed in a single line with horizontal scrolling enabled.
- Popup: Tab container will hold the items that can be placed within the available space and the rest of the items will be moved to the popup.
Declaration
public OverflowMode OverflowMode { get; set; }
Property Value
Type | Description |
---|---|
OverflowMode |
ScrollStep
Specifies the scrolling distance that applies when scrolling in Tab and enabled Scrollable mode.
Declaration
public int ScrollStep { get; set; }
Property Value
Type | Description |
---|---|
System.Int32 |
SelectedItem
Specifies the index for activating the Tab item.
Declaration
public int SelectedItem { get; set; }
Property Value
Type | Description |
---|---|
System.Int32 |
SelectedItemChanged
Gets or sets a callback of the bound value.
Declaration
public EventCallback<int> SelectedItemChanged { get; set; }
Property Value
Type | Description |
---|---|
Microsoft.AspNetCore.Components.EventCallback<System.Int32> |
ShowCloseButton
Specifies a value that indicates whether to show the close button in the Tab header or not.
Declaration
public bool ShowCloseButton { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
Width
Specifies the width of the Tabs component. By default, Tab width sets based on the width of its parent.
Declaration
public string Width { get; set; }
Property Value
Type | Description |
---|---|
System.String |
Methods
AddTab(List<TabItem>, Int32)
Adds new items to the Tab that accepts a list of Tab items.
Declaration
public Task AddTab(List<TabItem> items, int index)
Parameters
Type | Name | Description |
---|---|---|
System.Collections.Generic.List<TabItem> | items | A list of items that are added to the Tab |
System.Int32 | index | Specifies an index value that determines where the items to be added. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
BuildRenderTree(RenderTreeBuilder)
Declaration
protected override void BuildRenderTree(RenderTreeBuilder __builder)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder | __builder |
Disable(Boolean)
Specifies the value to disable or enable the Tabs component. When set to true
, the component will be disabled.
Declaration
public Task Disable(bool disable)
Parameters
Type | Name | Description |
---|---|---|
System.Boolean | disable | Based on this Boolean value, Tab will be enabled (false) or disabled (true). |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
EnableTab(Double, Boolean)
Enables or disables a particular tab item. On passing the value as false
, the tab will be disabled.
Declaration
public Task EnableTab(double index, bool isEnable)
Parameters
Type | Name | Description |
---|---|---|
System.Double | index | Index value of target Tab item. |
System.Boolean | isEnable | Specify a Boolean value that determines whether the command should be enabled or disabled. By default, isEnable has true. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
EnableTab(Int32, Boolean)
Enables or disables a particular tab item. On passing the value as false
, the tab will be disabled.
Declaration
public Task EnableTab(int index, bool isEnable)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | Index value of target Tab item. |
System.Boolean | isEnable | Specify a Boolean value that determines whether the command should be enabled or disabled. By default, isEnable has true. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
GetTabContent(Int32)
Declaration
public Task<DOM> GetTabContent(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task<DOM> |
GetTabItem(Int32)
Declaration
public Task<DOM> GetTabItem(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task<DOM> |
HideTab(Double, Nullable<Boolean>)
Shows or hides a particular Tab based on the specified index.
Declaration
public Task HideTab(double index, Nullable<bool> isHide = null)
Parameters
Type | Name | Description |
---|---|---|
System.Double | index | Index value of target item. |
System.Nullable<System.Boolean> | isHide | Based on this Boolean value, item will be hide (false) or show (true). |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
HideTab(Int32, Nullable<Boolean>)
Shows or hides a particular Tab based on the specified index.
Declaration
public Task HideTab(int index, Nullable<bool> isHide = null)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | Index value of target item. |
System.Nullable<System.Boolean> | isHide | Based on this Boolean value, item will be hide (false) or show (true). |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
OnAfterRenderAsync(Boolean)
Declaration
protected override Task OnAfterRenderAsync(bool firstRender)
Parameters
Type | Name | Description |
---|---|---|
System.Boolean | firstRender |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task |
Overrides
OnInitializedAsync()
Declaration
protected override Task OnInitializedAsync()
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task |
Overrides
OnParametersSetAsync()
Declaration
protected override Task OnParametersSetAsync()
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task |
Refresh()
Declaration
public Task Refresh()
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task |
RemoveTab(Int32)
Declaration
public Task RemoveTab(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task |
Select(Int32)
Select (activate) a particular tab based on the specified index.
Declaration
public Task Select(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | Index is used for selecting an item from the Tab. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |
Select(Object)
Select (activate) a particular tab based on the specified index.
Declaration
public Task Select(object index)
Parameters
Type | Name | Description |
---|---|---|
System.Object | index | Index is used for selecting an item from the Tab. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | System.Threading.Tasks.Task |