如何在 XAML 图像组件中使用 svg 图像文件

Question

我正在尝试使用 svg 在 uwp 应用程序上显示插图。我正在使用如下所示的 svg 创建 BitmapImage 对象

m_imageSource = Windows::UI::Xaml::Media::Imaging::BitmapImage(Windows::Foundation::Uri{ GetFilePath() + L"FamilyValueProp\Assets\Images\family_promo.svg"});

并将此源设置为图像组件

<Image x:Name="PromoImage" Source="{x:Bind ViewModel.ImageSource, Mode=OneWay}" />

但这不会渲染图像。图像存在于提供给 BitmapImage 对象的路径中。不知道出了什么问题。有什么帮助吗？

Answer 1

如果创建 ImageSource，您需要使用 SvgImageSource。

m_imageSource = new SvgImageSource(new Uri("mySvgImage.svg"));

也可以将svg直接设置为Image

<Image Source="Assets/mysvg.svg"/>

请注意，不支持动画

SvgImageSource supports secure static mode from the SVG specification and does not support animations or interactions

如何在 XAML 图像组件中使用 svg 图像文件

How to use svg image file in XAML Image component

xaml

winrt-xaml

uwp

uwp-xaml