Back to Devexpress

TabPageItem Class

mobilecontrols-devexpress-dot-xamarinforms-dot-navigation-79554e8e.md

latest6.4 KB
Original Source

TabPageItem Class

Stores the TabPage item’s header settings and content.

Namespace : DevExpress.XamarinForms.Navigation

Assembly : DevExpress.XamarinForms.Navigation.dll

NuGet Package : DevExpress.XamarinForms.Navigation

Declaration

csharp
public class TabPageItem :
    TabItem,
    ITabItem

Remarks

A TabPageItem object is a TabPage‘s item. It provides properties to customize the appearance of the tab item’s header and define a page to be displayed in the content area when the item is selected.

Example

The following code configures a TabPage‘s item according to Material Design guidelines.

xml
<dxn:TabPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:TabPageExample"
         xmlns:dxn="http://schemas.devexpress.com/xamarin/2014/forms/navigation"
         x:Class="TabPageExample.MainPage">
    <dxn:TabPageItem HeaderFontSize="14"
                     HeaderFontAttributes="Bold"
                     HeaderTextColor="#99191919"
                     HeaderIconColor="#99191919"
                     HeaderIconPosition="Top"
                     HeaderIconSpacing="4"
                     HeaderWidth="*"
                     HeaderMinWidth="90"
                     HeaderMaxWidth="360"
                     HeaderPadding="16,0,16,0"
                     HeaderVisibleElements="TextAndIcon"
                     SelectedHeaderTextColor="#1e88e5"
                     SelectedHeaderIconColor="#1e88e5"
                     SelectedHeaderBackgroundColor="Transparent">
        <dxn:TabPageItem.Content>
            <ContentPage Title="MAIL" Icon="ic_mail.png">
                <Label Text="Mail List Here" 
                       HorizontalOptions="Center" 
                       VerticalOptions="CenterAndExpand"/>
            </ContentPage>
        </dxn:TabPageItem.Content>
    </dxn:TabPageItem>
</dxn:TabPage>

The markup above uses the following properties of the TabPageItem object:

|

Property

|

Description

| | --- | --- | |

HeaderFontSize

|

Gets or sets the size of the font for the item header’s text.

| |

HeaderFontAttributes

|

Gets or sets a value that indicates whether the font for the item header’s text is bold, italic, or neither.

| |

HeaderTextColor

|

Gets or sets the color the tab item uses in the default state to paint its header text.

| |

HeaderIconColor

|

Gets or sets the color the tab item uses in the default state to paint its header icon.

| |

HeaderIconPosition

|

Gets or sets the position of the icon relative to the text in the item header.

| |

HeaderIconSpacing

|

Gets or sets spacing between the icon and the text in the item header.

| |

HeaderWidth

|

Gets or sets the item header width when TabView.HeaderPanelPosition is set to Top or Bottom.

| |

HeaderMinWidth

|

Gets or sets the minimum width of the item header when TabView.HeaderPanelPosition is set to Top or Bottom.

| |

HeaderMaxWidth

|

Gets or sets the maximum width of the item header when TabView.HeaderPanelPosition is set to Top or Bottom.

| |

HeaderPadding

|

Gets or sets the inner padding of the item header.

| |

HeaderVisibleElements

|

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

| |

SelectedHeaderTextColor

|

Gets or sets the color the tab item uses in the selected state to paint its header text.

| |

SelectedHeaderIconColor

|

Gets or sets the color the tab item uses in the selected state to paint its header icon.

| |

SelectedHeaderBackgroundColor

|

Gets or sets the background color of the tab item header in the selected state.

| |

Content

|

Gets or sets a page that the TabPage displays in the content area when the item is selected.

|

Note

TabPage contains the majority of the visual settings that TabPageItem provides. TabPage’s properties simultaneously configures the appearance of all tab items the page contains.

Inheritance

Object TabItem TabPageItem

See Also

TabPageItem Members

DevExpress.XamarinForms.Navigation Namespace