更改应用主题时更改图像颜色

Question

我正在用 UWP（C# 和 XAML）编写应用程序。我有这个代码：

<Image Source="ms-appx:///Assets/Image.svg"/> <!-- svg is preferred but not required -->

Image.svg 是单色（黑色）图像。我想要实现的是图像根据 system/app 主题（浅色主题 = 黑色图像，深色主题 = 白色图像）改变颜色，而无需分离白色和黑色图像文件。

此时图像为黑色

有可能吗？

我将不胜感激任何帮助和建议。

Answer 1

Change image color when app theme changed

根据您的要求，我们建议您使用BitmapIcon接近。 BitmapIcon 具有前景色属性，您可以在主题更改时动态设置它。另一种方法是为不同的主题定义不同的图像，然后将图像源与 ThemeResource 标记绑定。

例如

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <BitmapIcon
        VerticalAlignment="Center"
        Foreground="{ThemeResource IconColor}"
        UriSource="ms-appx:///Assets/Butterfly.png"
        Visibility="Visible" />
    <Image
        Grid.Row="1"
        VerticalAlignment="Center"
        Source="{ThemeResource MyImage}" />

</Grid>

资源

<ResourceDictionary.ThemeDictionaries>
    <ResourceDictionary x:Key="Light">
        <ImageSource x:Key="MyImage">ms-appx:///Assets/png-icon.png</ImageSource>

        <SolidColorBrush x:Key="IconColor" Color="Black" />
    </ResourceDictionary>

    <ResourceDictionary x:Key="Dark">
        <ImageSource x:Key="MyImage">ms-appx:///Assets/Butterfly.png</ImageSource>

        <SolidColorBrush x:Key="IconColor" Color="White" />
    </ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

更改应用主题时更改图像颜色

Change image color when app theme changed

image

xaml

uwp

uwp-xaml