如何在WPF中设置SVG图像的颜色？

Question

我们从模型收到一个 SVG 图像路径。这个图片也用在web和winform上，所以我们不能使用XAML。 这些只是灰色图像，我们需要能够为这些图像设置任何颜色。我想知道是否可以添加某种颜色图层来仅设置不透明部分的颜色？

这是我现在所拥有的：

<Window x:Class="CustomBrushesExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:svg1="clr-namespace:SVGImage.SVG;assembly=DotNetProjects.SVGImage"
         xmlns:local="clr-namespace:CustomBrushesExample" WindowStartupLocation="CenterScreen"
        Title="SVGImage" Height="540" Width="720" Background="Wheat" ResizeMode="NoResize" Margin="3">
            <svg1:SVGImage 
                x:Name="StartingImage" SizeType="SizeToContent"
                Source="/CustomBrushesExample;component/Images/test_3.svg" 
                Margin="20" 
                RenderTransformOrigin="0.5,0.5" 
                VerticalContentAlignment="Top" 
                HorizontalContentAlignment="Left" 
                HorizontalAlignment="Left" 
                VerticalAlignment="Top"/>
</Window>

SVGImage 是 .net 团队实现的用于显示 SVG 图像的工具：https://github.com/dotnetprojects/SVGImage

Answer 1

我为我的 svg 文件使用了属性“OverrideFillColor”，这满足了我的需求：

https://github.com/dotnetprojects/SVGImage/blob/master/Source/SVGImage/SVG/SvgIconBase.cs#L49

如果需要，还有一个属性“OverrideStrokeColor”可以设置线条颜色。这是一个例子：

   <svg1:SVGImage 
       x:Name="StartingImage" SizeType="SizeToContent"
       Source="/CustomBrushesExample;component/Images/test_3.svg" 
       OverrideFillColor="Black"
       OverrideStrokeColor="White"
       Margin="20" 
       RenderTransformOrigin="0.5,0.5" 
       VerticalContentAlignment="Top" 
       HorizontalContentAlignment="Left" 
       HorizontalAlignment="Left" 
       VerticalAlignment="Top"/>

您所指的存储库中的 test-svg 有一个背景图案，因此上面的示例将使整个图像看起来像黑色，因为背景将被填充。如果注释掉svg中的“pattern”标签，那么效果会变得更加清晰。