有什么干凈的方法可以通過WPF / Xaml中的包URL使用矢量圖像

Question

我想出了如何從svg文件中獲取xaml（.svg-> Inkscape-> pdf-> ai-> ExpressionDesign-> xaml）。

轉換要么給我提供了帶有DrawingBrush的資源字典，要么給了帶有畫布的Xaml文件。

現在，我正在尋找一種通過打包網址使用矢量圖像的干凈方法，以便可以從ViewModel中以干凈的方式使用它。 這是xaml片段，可與包含指向（資源）.png文件的包URL的ImagePath（字符串）很好地配合使用。 矢量圖像有什么相似之處嗎？

// View Model: 
MainMenuEntry.ImagePath = "pack://application:,,,/MyBeautifulApp.Wpf.MainGui;component/CommonResources/OpenFile16x16.png"

// .Xaml File
<DataTemplate>
    <Button Command ="{Binding ClickCommand}" Margin="3,0,0,0">
        <Button.Template>
            <ControlTemplate>
                <Image Source="{Binding ImagePath}" Width="16" Height="16"  Stretch="Uniform" VerticalAlignment="Center" />
            </ControlTemplate>
        </Button.Template>
    </Button>
</DataTemplate>

我發現它根本無法工作的唯一方法是使用DrawingBrush（在ResourceDictionary中）將ImageSource綁定到StaticResource，但這對我可能擁有位圖文件或矢量圖像的視圖模型沒有幫助。 必須有任何明智的方式來處理矢量圖像，例如html中的svg嗎？

Answer 1

出於組織目的，請為您的資產創建一個單獨的類庫項目。 在ResourceDictionary中定義XAML矢量圖形

資產/類別/my-asset.xaml：

<ResourceDictionary 
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
  mc:Ignorable="d">
<VisualBrush x:Key="my-asset" Stretch="Uniform">
    <VisualBrush.Visual>
        <Canvas Width="48.822" Height="53.243">
                 <Path {...} />
            </Canvas>
        </VisualBrush.Visual>
    </VisualBrush>
</ResourceDictionary>

定義一個ResourceDictionary，其中包含對您所有資產的引用：

資產/資產.xaml

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" >
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="Category/my-asset.xaml" />
        {...}
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

在您的App.xaml中加載Assets.xaml

<Application x:Class="MyApp.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/ClientAssets;component/Assets/Assets.xaml" />
        </ResourceDictionary>
    </Application.Resources>
</Application>

有了此功能，您就可以將圖形用作矩形中的筆刷。

<Rectangle Grid.Row="2" Fill="{StaticResource my-asset}" Height="16" Width="16" />