.NET MAUI如何更改Flyout菜单图标前景色？适配明暗主题

核心思路：利用Image的TintColor属性+主题绑定 #

.NET MAUI的Image控件虽无前景色属性，但提供了TintColor属性，可给单色调SVG图标统一着色。结合AppThemeBinding，能让图标在浅/深色主题下自动切换颜色，无需准备两份图标资源。

方案1：单个FlyoutItem直接设置 #

针对单个菜单项，直接给图标绑定主题适配的颜色：

<FlyoutItem Title="关于">
    <FlyoutItem.Icon>
        <Image Source="info.svg" 
               TintColor="{AppThemeBinding Light=Black, Dark=White}" />
    </FlyoutItem.Icon>
    <ShellContent Route="AboutPage" 
                  ContentTemplate="{DataTemplate local:AboutPage}" />
</FlyoutItem>

方案2：全局样式统一配置 #

若有多个菜单项，建议在全局资源中定义样式，避免重复代码：

1. 在App.xaml或页面的ResourceDictionary中添加样式：

<Style TargetType="Image" x:Key="FlyoutIconStyle">
    <Setter Property="TintColor" 
            Value="{AppThemeBinding Light=Black, Dark=White}" />
    <Setter Property="Margin" Value="10" />
    <Setter Property="WidthRequest" Value="24" />
</Style>

2. 在所有FlyoutItem的图标中引用该样式：

<FlyoutItem Title="关于">
    <FlyoutItem.Icon>
        <Image Source="info.svg" Style="{StaticResource FlyoutIconStyle}" />
    </FlyoutItem.Icon>
    <ShellContent Route="AboutPage" 
                  ContentTemplate="{DataTemplate local:AboutPage}" />
</FlyoutItem>

方案3：自定义Shell模板批量处理 #

若菜单通过数据源绑定生成，或想彻底统一所有图标样式，可自定义Shell的FlyoutItem模板：

<Shell.FlyoutItemTemplate>
    <DataTemplate>
        <Grid ColumnDefinitions="48, *" 
              Padding="10" 
              HeightRequest="48">
            <Image Source="{Binding Icon}" 
                   TintColor="{AppThemeBinding Light=Black, Dark=White}"
                   VerticalOptions="Center" />
            <Label Grid.Column="1" 
                   Text="{Binding Title}" 
                   VerticalOptions="Center"
                   TextColor="{AppThemeBinding Light=Black, Dark=White}" />
        </Grid>
    </DataTemplate>
</Shell.FlyoutItemTemplate>

所有菜单的图标和文字会自动适配主题，无需逐个设置。

注意事项 #

• 确保SVG图标为单色调、透明底色（你的黑色透明底SVG完全符合要求），TintColor会覆盖图标原有颜色实现统一着色。
• 若需使用系统主题色而非固定黑/白，可替换AppThemeBinding的值为自定义资源，比如{AppThemeBinding Light={StaticResource PrimaryText}, Dark={StaticResource SecondaryText}}，前提是已在资源字典中定义对应主题色。

内容的提问来源于stack exchange，提问作者David Shnayder