Getting Started

This article demonstrates how to create a sample application that contains RadTabView.

Before you proceed, please, take a look at these articles and follow the instructions to setup your app:

Defining RadTabView

To use the tabview control you can include the following namespaces:

xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
using Telerik.XamarinForms.Primitives;

To display something in the tab you can define TabViewItem elements in its Items collection.

<telerikPrimitives:RadTabView x:Name="tabView">
    <telerikPrimitives:RadTabView.Items>
        <telerikPrimitives:TabViewItem HeaderText="Home">
            <telerikPrimitives:TabViewItem.Content>
                <Label Margin="10" Text="This is the content of the Home tab" />
            </telerikPrimitives:TabViewItem.Content>
        </telerikPrimitives:TabViewItem>
        <telerikPrimitives:TabViewItem HeaderText="Folder">
            <telerikPrimitives:TabViewItem.Content>
                <Label Margin="10" Text="This is the content of the Folder tab" />
            </telerikPrimitives:TabViewItem.Content>
        </telerikPrimitives:TabViewItem>
        <telerikPrimitives:TabViewItem HeaderText="View">
            <telerikPrimitives:TabViewItem.Content>
                <Label Margin="10" Text="This is the content of the View tab" />
            </telerikPrimitives:TabViewItem.Content>
        </telerikPrimitives:TabViewItem>
    </telerikPrimitives:RadTabView.Items>
</telerikPrimitives:RadTabView>
RadTabView tabView = new RadTabView(); 
 TabViewItem homeTab = new TabViewItem()
{
    HeaderText = "Home",
    Content = new Label() { Text = "This is the content of the Home tab", Margin = new Thickness(10) },
};
TabViewItem folderTab = new TabViewItem()
{
    HeaderText = "Folder",
    Content = new Label() { Text = "This is the content of the Folder tab", Margin = new Thickness(10) },
};
TabViewItem viewTab = new TabViewItem()
{
    HeaderText = "View",
    Content = new Label() { Text = "This is the content of the View tab", Margin = new Thickness(10) },
};
tabView.Items.Add(homeTab);
tabView.Items.Add(folderTab);
tabView.Items.Add(viewTab);

To define the header of a TabViewItem you can use its HeaderText property as in the example. If you need to show a more complext layout you can use the Header property.

Figure 1: TabView example

BusyIndicator example

See Also