Xamarin.Forms：如何在AppShell的FlyoutItems中設定圖示的顏色

我正在使用 AppShell 實作 Xamarin.Forms 應用程式，但似乎無法弄清楚如何在 Flyout 選單中設定選定/未選定圖示的顏色。這是我認為控制行為的 appshell.xaml 部分（我使用各種高對比度顏色來顯示哪些設定正在控制什么）。（完整代碼示例：

這是我要展示的圖示的“白色”如何不起作用：

我可以在 FontImageSource 上手動設定顏色，但它始終是該顏色并且與選定/未選定的不匹配：

<ShellContent Route="aboutPage" Title="About" ContentTemplate="{DataTemplate views:AboutPage}" >
    <ShellContent.Icon>
        <FontImageSource Size="{StaticResource FlyoutIconSize}" Color="Black" Glyph="{x:Static fontAwesome:FontAwesomeIcons.InfoCircle}" FontFamily="FA-Solid" />
    </ShellContent.Icon>
</ShellContent>

我嘗試了各種諸如此類的“共同狀態”-“正常”/“選定”，但無法正常作業：

<Setter Property="FontImageSource.Color" Value="{AppThemeBinding Light={StaticResource PrimaryUnselectedTextColorLight}, Dark={StaticResource PrimaryUnselectedTextColorDark}}" />

附帶說明（這可能是一個錯誤）。在 iOS 上，第一次打開浮出控制元件時，沒有“選擇”任何內容：

在 Android 上，選擇了正確的專案：

我知道這是一個單獨的專案，如果我找不到現有的問題/錯誤，我會記錄一個錯誤，但我想我會提到它，因為有人知道我上面的答案可能已經意識到這一點問題。

uj5u.com熱心網友回復：

您可以使用Shell.ItemTemplate設定標簽和圖示的背景顏色。并使用VisualStateGroup更改選定狀態的顏色。

Shell.ItemTemplate：

   <Shell.ItemTemplate>
    <DataTemplate>
        <Grid ColumnDefinitions="0.2*,0.8*" ColumnSpacing="0" Style="{StaticResource FloutItemStyle}">
            <Image  x:Name="FlyoutItemIcon"  Source="{Binding FlyoutIcon}" HeightRequest="45" />
            <Label x:Name="FlyoutItemLabel"   Grid.Column="1"
                   Text="{Binding Title}"
                   FontAttributes="Italic"
                   VerticalTextAlignment="Center" />
        </Grid>
    </DataTemplate>
</Shell.ItemTemplate>

風格：

 <Style  x:Key="FloutItemStyle" 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="{x:OnPlatform UWP=Transparent, iOS=White}" />
                                <Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="{StaticResource Primary}" />
                                <Setter TargetName="FlyoutItemLabel" Property="Label.BackgroundColor" Value="Blue" />
                                <Setter TargetName="FlyoutItemIcon" Property="Image.BackgroundColor" Value="Green" />
                            </VisualState.Setters>
                        </VisualState>
                        <VisualState x:Name="Selected">
                            <VisualState.Setters>
                                <Setter Property="BackgroundColor" Value="{StaticResource Primary}" />
                                <Setter TargetName="FlyoutItemLabel" Property="Label.BackgroundColor" Value="{StaticResource Primary}" />
                                <Setter TargetName="FlyoutItemIcon" Property="Image.BackgroundColor" Value="{StaticResource Primary}" />
                            </VisualState.Setters>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateGroupList>
            </Setter>
        </Style>

uj5u.com熱心網友回復：

在 Wendy Zang

A side not, something in this solution fixed the iOS issue where nothing was selected on initial opening. I'm guessing it was the definded DataTemplate.

標籤：xamarin xamarin.forms

上一篇：Xamarin表單中的資料系結問題

下一篇：XamarinShellFloyout選項卡隱藏部分內容頁面