The TabView is a way to display a set of tabs and their respective content. TabViews are useful for displaying several views of content.
<TabView
TabStripPlacement="Bottom"
TabStripBackgroundColor="Blue"
TabStripHeight="60"
TabContentBackgroundColor="Yellow">
<TabViewItem
Icon="triangle"
Text="Tab 1"
TextColor="White"
TextColorSelected="Yellow"
FontSize="12">
<Grid
BackgroundColor="Gray">
<Label
HorizontalOptions="Center"
VerticalOptions="Center"
Text="TabContent1" />
</Grid>
</TabViewItem>
<TabViewItem
Icon="circle"
Text="Tab 2"
TextColor="White"
TextColorSelected="Yellow"
FontSize="12">
<Grid>
<Label
HorizontalOptions="Center"
VerticalOptions="Center"
Text="TabContent2" />
</Grid>
</TabViewItem>
</TabView>
Sounds good, but ... why create this control?.
This control has been created with the idea of being able to customize absolutely everything in a simple way.
- Fully customized tabs. You can customize the content of each tab, the tabstrip, the tab indicator or the tab content.
- Dynamic tabs.
- Nested tabs in any way.
- Gestures support.
- Badges support, etc.
| Property | Type |
|---|---|
| TabItemsSource | IEnumerable |
| TabViewItemDataTemplate | DataTemplate |
| TabContentDataTemplate | DataTemplate |
| SelectedIndex | Int |
| TabStripPlacement | TabStripPlacement |
| TabStripBackgroundColor | Color |
| TabStripBackgroundView | View |
| TabIndicatorColor | Color |
| TabIndicatorHeight | double |
| TabIndicatorWidth | double |
| TabIndicatorPlacement | TabIndicatorPlacement |
| TabIndicatorView | View |
| TabContentBackgroundColor | Color |
| TabContentHeight | Double |
| TabStripHeight | Double |
| TabContentHeight | Double |
| IsTabTransitionEnabled | Bool |
| IsSwipeEnabled | Bool |
| Event | Description |
|---|---|
| SelectionChanged | |
| Scrolled |
| Property | Type |
|---|---|
| Text | String |
| TextColor | Color |
| TextColorSelected | Color |
| FontSize | FontSize |
| FontSizeSelected | FontSize |
| FontFamily | String |
| FontFamilySelected | String |
| FontAttributes | FontAttributes |
| FontAttributesSelected | FontAttributes |
| Icon | ImageSource |
| IconSelected | ImageSource |
| Content | View |
| BadgeText | Bool |
| BadgeTextColor | Color |
| BadgeBackgroundColor | Color |
| BadgeBackgroundColorSelected | Color |
| IsSelected | Bool |
| TapCommand | ICommand |
| Event | Description |
|---|---|
| TabTapped |
Functionality in development or to be implemented:
- Allow to disable or hide Tabs.
- Support RTL.
- Accesibility support.
- More TabStrip customization: TabStripBorderColor and TabStripBorderWidth.
- Review integration with Visual and Shell.
Code released under the MIT license.







