UWP: Padding around TabItems when using BasedOnText TabWidthMode and custom Header Content

[Maiia Kuzmishyna]

Hello,

I would like to set a custom Header content for TabItem inside a TabView consisting of a Label and BoxView (custom Title and SelectionIndicator):

<tabView:SfTabItem xmlns="http://xamarin.com/schemas/2014/forms"
                   xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                   xmlns:tabView="clr-namespace:Syncfusion.XForms.TabView;assembly=Syncfusion.SfTabView.XForms"
                   x:Class="TabViewSample.CustomTabItem"
                   x:Name="TabItem">
   <tabView:SfTabItem.HeaderContent>
      <Grid HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="PaleGreen"
            Padding="0" Margin="0">
         <Label Text="{Binding Path=Title, Source={x:Reference TabItem}}" HorizontalOptions="Center" Margin="0"
                Padding="0" VerticalOptions="Center" TextColor="Black" FontAttributes="Bold" FontSize="14"
                BackgroundColor="Pink" />
         <BoxView IsVisible="{Binding Path=IsSelected, Source={x:Reference TabItem}}"
                  Color="Purple" CornerRadius="3, 3, 0, 0" HeightRequest="3"
                  HorizontalOptions="Fill" VerticalOptions="End" />
      </Grid>
   </tabView:SfTabItem.HeaderContent>
</tabView:SfTabItem>

However there seems to be an extra margin around HeaderContent on UWP (can be seen on hover):

Expected outcome: no empty space between the HeaderContents of TabItems.

Please, find the full sample attached. 

Attachment: TabView_BasedOnText_HeaderContent_4f7354cb.zip

[Suganya Sethuraman]

Hi Maiia,

Currently, TabWidthMode only supports the default title of SfTabItem and not HeaderContent. For more information, please refer the following UG link.

Link: TabView Header Customization in Xamarin Tabbed View | Syncfusion

Please check and let us know if you have any concerns.

Regards,
Suganya Sethuraman.