在 WPF 应用程序中添加 XAML 矢量图形答案

【问题标题】：Add XAML Vector Graphics in WPF Application在 WPF 应用程序中添加 XAML 矢量图形
【发布时间】：2020-05-19 21:13:45
【问题描述】：

我使用 inkscape 将 .svg 文件转换为 .xaml，生成的文件是画布。我将整个画布添加到文件 ImageResources.xaml 中的资源中：

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
<Canvas x:Key="xamltest" Name="svg2" Width="9354.3341" Height="5977.5567"> 
<Canvas.RenderTransform> 
    <TranslateTransform X="0" Y="0"/>
...
...
...
</Canvas>
</ResourceDictionary>

然后我将资源文件合并到资源字典中：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

  <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="/AP_PlugIn;component/Resources/BrushLists.xaml" />
        <ResourceDictionary Source="/AP_PlugIn;component/Resources/System/ConverterResources.xaml" />
        <ResourceDictionary Source="/AP_PlugIn;component/Resources/ImageResources.xaml"/>

  </ResourceDictionary.MergedDictionaries>

</ResourceDictionary>

最后，我尝试使用 ContentControl 在 Grid 中显示画布，但图像没有出现。有什么问题？我没有收到任何错误，我的项目正确启动

<Grid>
<ContentControl Content="{StaticResource xamltest}" Width="1253" Height="637"  /> 
</Grid>

【问题讨论】：

您的图像为 9000x6000 像素，您的 ContentControl 大小为 1200x600 像素。我猜你图像的左上角 1200x600 像素是空的，这就是为什么什么都看不到。

标签： c# wpf xaml

【解决方案1】：

Canvas 似乎比 ContentControl 提供的区域大很多。

您可以改用 Viewbox，它会缩放其子元素：

<Viewbox Child="{StaticResource xamltest}" Width="1253" Height="637"/>

【讨论】：

【解决方案2】：

查看 Canvas 的尺寸，我怀疑图像的可见部分正在从屏幕上绘制出来。

尝试将画布换成网格，但不指定其大小。

以下最小的概念证明可以正常工作

<Window.Resources>
    <Grid x:Key="MyImage">
        <Path
            Data="M 0,0 M 100,100 M 25,50 L 50,25 L 75,50 L 50,75 z"
            Stretch="Fill"
            Stroke="Blue"
            StrokeThickness="5" />
        <Path
            Data="M 0,0 M 100,100 M 25,25 L 25,75 L 75,75 L 75,25 z"
            Stretch="Fill"
            Stroke="Black"
            StrokeThickness="10" />
    </Grid>
</Window.Resources>

<Grid
    Margin="16"
    Background="AliceBlue">

    <ContentControl Content="{StaticResource MyImage}" />

</Grid>

【讨论】：

【解决方案3】：

Clemens 和 Peregrine 的两种解决方案都适用于简单的画布，例如 Peregrine 发布的一个或我在网络上找到的小图标，但它不适用于转换后获得的大文件。我认为问题在于inkScape抛出的文件。我删除了 xaml 图像的大部分行，并显示了一些部分。很难找到问题，因为我没有使用 Visual Studio，而是使用另一个名为 VisiWin 的平台，并且无法调试。您是否处理过使用 inkScape 转换的 xaml 文件？

【讨论】：