TabView.ItemHeaderVisibleElements Property

Gets or sets a value that specifies elements the item header shows.

Namespace: DevExpress.XamarinForms.Navigation

Assembly: DevExpress.XamarinForms.Navigation.dll

NuGet Package: DevExpress.XamarinForms.Navigation

Declaration

public HeaderElements ItemHeaderVisibleElements { get; set; }

Property Value

Type	Description
HeaderElements	The value that specifies elements the item header shows.

Available values:

Name	Description
Default	Identifies header elements a tab item shows by default.
Text	An item header shows only text (TabPageItem.HeaderText or TabViewItem.HeaderText) even if the TabPageItem.HeaderIcon or TabViewItem.HeaderIcon property is also specified.
Icon	An item header shows only an icon (TabPageItem.HeaderIcon or TabViewItem.HeaderIcon) even if the TabPageItem.HeaderText or TabViewItem.HeaderText property is also specified.
TextAndIcon	An item header shows both text (TabPageItem.HeaderText or TabViewItem.HeaderText) and icon (TabPageItem.HeaderIcon or TabViewItem.HeaderIcon).

Remarks

The following values are available:

Value	Sample Image	Description
Text		An item header shows only text (TabPageItem.HeaderText or TabViewItem.HeaderText) even if the TabPageItem.HeaderIcon or TabViewItem.HeaderIcon property is also specified.
Icon		An item header shows only an icon (TabPageItem.HeaderIcon or TabViewItem.HeaderIcon) even if the TabPageItem.HeaderText or TabViewItem.HeaderText property is also specified.
TextAndIcon		An item header shows both text (TabPageItem.HeaderText or TabViewItem.HeaderText) and icon (TabPageItem.HeaderIcon or TabViewItem.HeaderIcon).

Example

This example demonstrates how to customize appearance and behavior of the Tab View:

Xaml

<dxn:TabView HeaderPanelBackgroundColor="#1e88e5"
             HeaderPanelShadowHeight="4"
             HeaderPanelShadowRadius="4"
             HeaderPanelShadowColor="#cc222222"
             IsHeaderPanelShadowVisible="true"
             HeaderPanelHeight="72"
             HeaderPanelPosition="Top"
             HeaderPanelItemSpacing="0"
             HeaderPanelIndent="52"
             HeaderPanelContentAlignment="Center"
             ItemHeaderWidth="*"
             ItemHeaderMinWidth="90"
             ItemHeaderMaxWidth="360"
             ItemHeaderVisibleElements="TextAndIcon"
             ItemHeaderPadding="16,0,16,0"
             ItemHeaderFontSize="14"
             ItemHeaderFontAttributes="Bold"
             ItemHeaderIconSpacing="4"
             ItemHeaderIconPosition="Top"
             ItemHeaderTextColor="#99191919"
             ItemHeaderIconColor="#99191919"
             SelectedItemHeaderTextColor="White"
             SelectedItemHeaderIconColor="White"
             SelectedItemHeaderBackgroundColor="Transparent"
             SelectedItemIndicatorColor="White"
             IsSelectedItemIndicatorVisible="true"
             SelectedItemIndicatorHeight="2"
             ItemHeaderPlacementOnSelection="Edge">
    <!-- Tab items here. -->
</dxn:TabView>

The markup above uses the following properties:

Property	Description
HeaderPanelPosition	Gets or sets the header panel’s position within the view.
HeaderPanelHeight	Gets or sets the header panel’s height when the HeaderPanelPosition is set to Top or Bottom.
HeaderPanelBackgroundColor	Gets or sets the background color of the view’s header panel.
HeaderPanelShadowHeight	Gets or sets the height of the header panel’s shadow.
HeaderPanelShadowRadius	Gets or sets the blur radius of the header panel’s shadow.
HeaderPanelShadowColor	Gets or sets the color the Tab View uses to paint the header panel’s shadow.
IsHeaderPanelShadowVisible	Gets or sets whether the Header Panel’s shadow is visible.
HeaderPanelItemSpacing	Gets or sets the spacing between item headers.
HeaderPanelIndent	Gets or sets spacing before the first item and the panel’s start edge.
HeaderPanelContentAlignment	Gets or sets a value that specifies how the view aligns item headers in the header panel.
ItemHeaderVisibleElements	Gets or sets a value that specifies elements the item header shows.
ItemHeaderWidth	Gets or sets the width of header items when HeaderPanelPosition is set to Top or Bottom.
ItemHeaderMinWidth	Gets or sets the minimum width of header items when HeaderPanelPosition is set to Top or Bottom.
ItemHeaderMaxWidth	Gets or sets the maximum width of header items when HeaderPanelPosition is set to Top or Bottom.
ItemHeaderPadding	Gets or sets the inner padding of header items.
ItemHeaderFontFamily	Gets or sets the font family to which the font for item headers’ text belongs.
ItemHeaderFontSize	Gets or sets the size of the font for item headers’ text.
ItemHeaderFontAttributes	Gets or sets a value that indicates whether the font for item headers’ text is bold, italic, or neither.
ItemHeaderIconPosition	Gets or sets the position of the header icons relative to the headers’ text.
ItemHeaderIconSpacing	Gets or sets spacing between the icon and the text of a header item.
ItemHeaderTextColor	Gets or sets the color tab items use to paint their texts when items are in the default state.
ItemHeaderIconColor	Gets or sets the color all tab items use to paint its header icons.
SelectedItemHeaderTextColor	Gets or sets the color tab item headers in the selected state use to paint icons.
SelectedItemHeaderIconColor	Gets or sets the color tab item headers in the selected state use to paint icons.
SelectedItemHeaderBackgroundColor	Gets or sets the background color of tab item headers in the selected state.
SelectedItemIndicatorColor	Gets or sets the color of the Selected Item Indicator.
IsSelectedItemIndicatorVisible	Gets or sets whether the Selected Item Indicator is visible.
SelectedItemIndicatorHeight	Gets or sets the height of the Selected Item Indicator.
ItemHeaderPlacementOnSelection	Gets or sets a value that specifies how the TabView positions newly selected items.

Note

The TabView’s ItemHeader… properties configure header parameters for all tab items the view shows. Use TabViewItem‘s Header… properties to customize these parameters individually for each item.