How to set backgroundcolor of more button with other tabs [Xamarin Forms]?

Question

I'm developing a application with Xamarin.Forms.Shell for Layout and Navigation. When I use more of five tabs into TabBar, it's naturally appearance the button more, that is native each platformn (Android and iOS). But, same using the customization color in xaml for Shell.Background and Shell.TabBarBackground, not works for the background of tabs into more button.

My code in Xaml APP SHELL:

 <Shell.Resources>
    <ResourceDictionary>
        <Style x:Key="BaseStyle"  TargetType="Element">
            <Setter Property="Shell.BackgroundColor" 
                    Value="{x:Static core:Colors.Background}" />
            <Setter Property="Shell.ForegroundColor" 
                    Value="White" />
            <Setter Property="Shell.TabBarBackgroundColor"
                    Value="{x:Static core:Colors.Background}" />
            <Setter Property="Shell.TabBarTitleColor"
                    Value="{x:Static core:Colors.Selection}" />
            <Setter Property="Shell.TabBarUnselectedColor"
                    Value="White" />
        </Style>
    </ResourceDictionary>
</Shell.Resources>

<ShellItem Route="Home">
    <ShellContent ContentTemplate="{DataTemplate core:HomePage}"/>
</ShellItem>

<TabBar Route="Tabs" Style="{x:StaticResource BaseStyle}">
    <Tab Route="TabSearch"
         Icon="ic_list_white"
         Title="Search">
        <ShellContent ContentTemplate="{DataTemplate core:SearchPage}"/>
    </Tab>
    <Tab
        Icon="ic_filter_list_white"
        Title="Filter">
        <ShellContent ContentTemplate="{DataTemplate core:FilterPage}"/>
    </Tab>
    
    <Tab Icon="ic_star_white"
        Title="Favourites">
        <ShellContent ContentTemplate="{DataTemplate core:FavouritesPage}"/>
    </Tab>
    
    <Tab Icon="ic_remove_red_eye_white"
        Title="Seen">
        <ShellContent ContentTemplate="{DataTemplate core:SeenPage}"/>
    </Tab>

    <Tab Icon="ic_shopping_cart_white" Title="{x:Static resources:Strings.MAINPAGE_MENU_PURCHASE_PACKAGES}">
        <ShellContent ContentTemplate="{DataTemplate core:PackagePurchasePage}"/>
    </Tab>

    <Tab Icon="ic_sync_white" Title="{x:Static resources:Strings.MAINPAGE_MENU_RESTORE_PURCHASES}"  >
        <ShellContent ContentTemplate="{DataTemplate core:RestorePurchasePage}"/>
    </Tab>

    <Tab Icon="ic_settings_white" Title="{x:Static resources:Strings.MAINPAGE_MENU_SETTINGS}"  >
        <ShellContent ContentTemplate="{DataTemplate core:SettingsPage}"/>
    </Tab>

    <Tab Icon="ic_help_white" Title="{x:Static resources:Strings.MAINPAGE_MENU_ABOUT}" >
        <ShellContent ContentTemplate="{DataTemplate views:AboutShell }"/>
    </Tab>
</TabBar>

and here is my tabbar with applied style:

When I clicked on more button:

I need apply the same style that appearance on my TabBar in this screen of more button.

Answer 1

You could set the color for the TabBarUnselectedColor property.

 <Shell.Resources>
    <ResourceDictionary>
        <Style x:Key="BaseStyle"  TargetType="Element">
            <Setter Property="Shell.BackgroundColor" 
                Value="Black" />
            <Setter Property="Shell.ForegroundColor" 
                Value="White" />
            <Setter Property="Shell.TabBarBackgroundColor"
                Value="Green" />
            <Setter Property="Shell.TabBarTitleColor"
                Value="Red" />
            <Setter Property="Shell.TabBarUnselectedColor"
                Value="Red" />
        </Style>
    </ResourceDictionary>
</Shell.Resources>