如何更改弹出菜单中所选项目的颜色？

如何解决如何更改弹出菜单中所选项目的颜色？

我已经设置了背景颜色和文本颜色以及其他一些颜色属性，例如禁用和未选择的颜色，但似乎都没有更改所选项目的背景颜色。

如果我必须更改下面的属性以使其看起来像我想要的那样？或者我需要在代码中添加什么？

我有以下几点：

<Shell xmlns="http://xamarin.com/schemas/2014/forms" 
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       Title="Example"
       x:Class="TrackBus.AppShell"
       FlyoutHeaderBehavior="CollapSEOnScroll"
       FlyoutBackgroundColor="{StaticResource Primary}">

    <Shell.Resources>
        <ResourceDictionary>
            <Style x:Key="BaseStyle" targettype="Element">
                <Setter Property="Shell.BackgroundColor" Value="{StaticResource Primary}" />
                <Setter Property="Shell.ForegroundColor" Value="White" />
                <!--Foreground is the menu icon color-->
                <Setter Property="Shell.TitleColor" Value="White" />
                <Setter Property="Shell.disabledColor" Value="magenta" />
                <Setter Property="Shell.UnselectedColor" Value="Cyan" />
            </Style>
            <Style targettype="FlyoutItem" BasedOn="{StaticResource BaseStyle}" />

 <Style Class="FlyoutItemLabelStyle" targettype="Label">
                <Setter Property="TextColor" Value="Cyan"></Setter>
            </Style>
            <Style Class="FlyoutItemLayoutStyle" targettype="Layout" ApplyToDerivedTypes="True">
                <Setter Property="BackgroundColor" Value="magenta"></Setter>
                <Setter Property="visualstatemanager.VisualStateGroups">
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="normal">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="{StaticResource Secondary}" />
                                    <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="Blue"/>
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="{StaticResource SecondaryLight}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </Setter>
            </Style>

<Style Class="MenuItemLayoutStyle" targettype="Layout" ApplyToDerivedTypes="True">
                <Setter Property="visualstatemanager.VisualStateGroups">
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="normal">
                                <VisualState.Setters>
                                    <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="{StaticResource SecondaryLight}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </Setter>
            </Style>
        </ResourceDictionary>
    </Shell.Resources>


<Shell.ItemTemplate>
        <DataTemplate>
            <Grid ColumnDeFinitions="60,Auto">
                <Image Source="{Binding FlyoutIcon}"
                       Margin="5"
                       HeightRequest="35" />
                <Label Grid.Column="1"
                       Text="{Binding Title}"
                       VerticalTextAlignment="Center"
                       FontSize="Title"
                       TextColor="{StaticResource SecondaryLight}" />
            </Grid>
        </DataTemplate>
    </Shell.ItemTemplate>

    <Shell.MenuItemTemplate>
        <DataTemplate>
            <Grid ColumnDeFinitions="60,Auto">
                <Image Source="{Binding Icon}"
                       Margin="5"
                       HeightRequest="35" />
                <Label Grid.Column="1"
                       Text="{Binding Text}"
                       VerticalTextAlignment="Center"
                       FontSize="Title"
                       TextColor="{StaticResource SecondaryLight}"/>
            </Grid>
        </DataTemplate>
    </Shell.MenuItemTemplate>

Primary 是深蓝色和 SecondaryLight 是黄色的

目前我有这个：

我希望它看起来像这样：

解决方法

我们需要覆盖 FlyoutItemLayoutStyle 、MenuItemLayoutStyle 并修改 CommonStates 和 Selected 中的值。

            <Style Class="FlyoutItemLayoutStyle" TargetType="Layout" ApplyToDerivedTypes="True">
                <Setter Property="VisualStateManager.VisualStateGroups">
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="Transparent" />
                                    <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="Orange" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="Orange" />
                                    <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="Black" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </Setter>
            </Style>

            <!--
            Custom Style you can apply to any Flyout Item
            -->
            <Style Class="MenuItemLayoutStyle" TargetType="Layout" ApplyToDerivedTypes="True">
                <Setter Property="VisualStateManager.VisualStateGroups">
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="Transparent" />
                                    <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="Orange" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="Orange" />
                                    <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="Black" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </Setter>
            </Style>