Line and border Bug in the Android tabcontrol view

Describe the bug A couple of issues. One is that the border doesn't show and is over/under-lapping other tabs, and secondly there is a weird gray bar at the bottom of every tab. It could be a formatting issue, but not entirely sure.

To Reproduce Running the code in debug mode in the Android emulator

Expected behavior Would like every tab to be the same and have a border that is the same size.

Screenshots

Desktop (please complete the following information):

OS: [e.g. Windows, Mac, Linux (State distribution)] Running on android Emulator for the Pixel 5 - API 33 (Android 13.0 - API 33)

Additional context Code sample of the tab control.

      <DockPanel  Grid.Column="1" Grid.Row="0" HorizontalAlignment="Center" >
      <StackPanel  Grid.Column="1" Grid.Row="0">
        <Label Grid.Column="1" Grid.Row="0" HorizontalAlignment="Center" FontSize="20" FontFamily="Arial Black" FontWeight="Black">test app</Label>

        <TabControl AutoScrollToSelectedItem="True"  HorizontalAlignment="Center"  Grid.Row="0"  HorizontalContentAlignment="Center">
          <TabControl.ItemsPanel>
            <ItemsPanelTemplate >
              <UniformGrid    Columns="6"  Rows="1"   HorizontalAlignment="Center"/>
            </ItemsPanelTemplate>

          </TabControl.ItemsPanel>

          <!--Tab 1-->
             <TabItem Header="Load Screen"  HorizontalContentAlignment="Center" BorderThickness="1" MinWidth="0" MaxWidth="1000" BorderBrush="Black"   VerticalContentAlignment="Center">
            <!--<TextBlock Text="1"   HorizontalAlignment="Left" VerticalAlignment="Center"/>-->

            <StackPanel Grid.Row="0">
              <DataGrid Name="dgvGrid" Grid.Row="0" CanUserSortColumns="True" CanUserResizeColumns="True" CanUserReorderColumns="True" HorizontalAlignment="Center" VerticalAlignment="Center" ItemsSource="{Binding dgvItems}"  AutoGenerateColumns="False" >

                <DataGrid.Columns >
                  <DataGridTemplateColumn CanUserResize="True" MinWidth="100" Width="Auto" Header="Shipment">
                    <DataGridTemplateColumn.CellTemplate>
                      <DataTemplate >
                        <Button Name="btnShipTo" IsEnabled="True" Content="5214321" VerticalAlignment="Center" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"   Click="btnShipTo_Click" />
                      </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                  </DataGridTemplateColumn>
                  <!--<DataGridTemplateColumn MinWidth="400"  Width="Auto" Header="Sold to" CellStyleClasses="dgv">

              <DataGridTemplateColumn.CellTemplate>                 
                <DataTemplate>                  
                  <TextBlock Text="{Binding SoldTo}" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
                </DataTemplate>
              </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>-->

                  <!--<DataGridTextColumn CanUserSort="True" Header="Shipment"  Binding="{Binding btnShipTo}" />-->
                  <!--<Button Width="160" Command="{Binding OnClickCommand}">My Button</Button>-->
                  <!--<TextBox Grid.Row="0" Grid.Column="0" />-->

                  <DataGridTextColumn MinWidth="280" Width="Auto" Header="Sold to" Binding="{Binding SoldTo}" />

                  <DataGridTextColumn MinWidth="140" Width="*" Header="City, State" Binding="{Binding CityState}" />
                  <DataGridTextColumn MinWidth="80" Width="*" Header="Carrier" Binding="{Binding Carrier}" />
                  <DataGridTextColumn MinWidth="100" Width="*" Header="Pick Date" Binding="{Binding PickDate}" />
                  <DataGridTextColumn MinWidth="120" Width="*" Header="Appointment" Binding="{Binding Appointment}" />
                  <DataGridTextColumn MinWidth="100" Width="*" Header="Arrival" Binding="{Binding Arrival}" />

                </DataGrid.Columns>
                <!--<DataGrid.Items Name="dgvItems">

          </DataGrid.Items>-->

              </DataGrid>

              <DataGrid Grid.Row="1"  Height="1000" Name="dgvGrid2" ItemsSource="{Binding dgvItems}" AutoGenerateColumns="False" >
                <DataGrid.Columns >
                  <DataGridTextColumn MinWidth="100" Width="*" CanUserSort="True" Header="Item"  Binding="{Binding SoldTo}" />
                  <DataGridTextColumn MinWidth="100" Width="*" Header="LPN" Binding="{Binding SoldTo}" />
                  <DataGridTextColumn MinWidth="340" Width="*" Header="Item Description" Binding="{Binding CityState}" />
                  <DataGridTextColumn MinWidth="180" Width="*" Header="Location" Binding="{Binding Carrier}" />
                  <DataGridTextColumn MinWidth="180" Width="*" Header="Destination" Binding="{Binding PickDate}" />
                  <DataGridTextColumn MinWidth="100" Width="*" Header="Status" Binding="{Binding Appointment}" />

                </DataGrid.Columns>
                <!--<DataGrid.Items Name="dgvItems">

          </DataGrid.Items>-->

              </DataGrid>
            </StackPanel>

          </TabItem>...  other tabs are similiar </tabcontrol>

Looks like a custom theme. So please investigate that theme. Can you share which Theme you use?

Hello, Looks like i'm only using the Fluent theme in my app.axaml

<Application xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="using:RoseburgForklift"
             x:Class="RoseburgForklift.App"
              xmlns:dialogHostAvalonia="clr-namespace:DialogHostAvalonia;assembly=DialogHost.Avalonia"
             RequestedThemeVariant="Default">
             <!-- "Default" ThemeVariant follows system theme variant. "Dark" or "Light" are other available options. -->

    <Application.DataTemplates>
        <local:ViewLocator/>
    </Application.DataTemplates>

    <Application.Styles>
      <!--<StyleInclude Source="avares://Avalonia.Themes.Default/DefaultTheme.xaml"/>
      <StyleInclude Source="avares://Avalonia.Themes.Default/Accents/BaseLight.xaml"/>
      <StyleInclude Source="avares://Avalonia.Controls.DataGrid/Themes/Default.xaml"/>-->
      <!--<FluentTheme Mode="Light" />-->
      <StyleInclude Source="avares://Avalonia.Controls.DataGrid/Themes/Fluent.xaml"/>

      <dialogHostAvalonia:DialogHostStyles />
        <FluentTheme />
    </Application.Styles>
</Application>

Oh and apparently this is the style im using in my main screen:

  <UserControl.Styles>
    <Style Selector="ItemsPanelTemplate">

    </Style>
    <Style Selector="TabControl">
      <Setter Property="Background" Value="#F0F0F0"/>
      <!--<Setter Property="Height" Value="120"/>-->
    </Style>
    <Style Selector="TabControl WrapPanel">
      <Setter Property="Background" Value="#7fba41"/>
    </Style>

    <Style Selector="TabItem">
      <Setter Property="FontSize" Value="12"/>
      <Setter Property="HorizontalAlignment" Value="Stretch"/>
      <Setter Property="Height" Value="34"/>
      <Setter Property="VerticalAlignment" Value="Center"/>
      <Setter Property="Background" Value="#7fba41"/>
      <Setter Property="Foreground" Value="#F0F0F0"/>
      <Setter Property="Margin" Value="0 0 0 0"/>
      <Setter Property="Padding" Value="10 0"/>
      <Setter Property="Width" Value="220"/>
    </Style>
    <Style Selector="TabItem:pointerover /template/ ContentPresenter#PART_ContentPresenter">
      <Setter Property="Background" Value="Green"/>
    </Style>

    <Style Selector="TabItem:focus">
      <Setter Property="Foreground" Value="#7fba41"/>
      <Setter Property="Margin" Value="0 0 0 0"/>
      <Setter Property="Padding" Value="10 0"/>
    </Style>
    <Style Selector="TabItem:focus /template/ ContentPresenter#PART_ContentPresenter">
      <Setter Property="Background" Value="#f0f0f0"/>
    </Style>

    <Style Selector="TabItem:selected">
      <Setter Property="Foreground" Value="#7fba41"/>
      <Setter Property="Margin" Value="0 0 0 0"/>
      <Setter Property="Padding" Value="10 0"/>
    </Style>
    <Style Selector="TabItem:selected /template/ ContentPresenter#PART_ContentPresenter">
      <Setter Property="Background" Value="#f0f0f0"/>
    </Style>

  </UserControl.Styles>

AvaloniaUI / Avalonia

Line and border Bug in the Android tabcontrol view #12328