21

我正在寻找一种在 XAML 中处理矢量文件（EPS 或 SVG）的好方法。我找到了一个插件，可以将图像从 Illustrator 导出到 XAML ，如果我将文件的内容复制到我的窗口，它会很好地工作。

但是，是否可以将 xaml 输出用作资源或其他东西，并从给定的 XAML 窗口示例中导入/转换它？

我正在使用的工具：Adobe Illustrator 到 Xaml。

4

3 回答 3

14

就个人而言，如果您正在谈论在多个地方使用它，而不必每次都重新使用/重新绘制您的 xaml 路径。然后我将它们放入 ContentControl 中，例如；

<!-- Plop this in your resource dictionary or your resource declaration -->
    <Style x:Key="TheAwesomeXAMLimage" TargetType="ContentControl">
            <!-- Add additional Setters Here -->
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ContentControl">

                                <!-- Just Paste your XAML here -->

                </ControlTemplate>
            </Setter.Value>
        </Setter>                      
    </Style>

<!-- Now actually place it on your view -->
    <ContentControl Style="{StaticResource TheAwesomeXAMLimage}"/>
于 2012-11-08T16:15:51.410 回答
14

使用DrawingImage作为您的容器，该容器被设计为这样的包装器：

<MyWindow.Resources>
     <DrawingImage x:Key="diUndo">
         <DrawingImage.Drawing>
             <DrawingGroup>
                 <GeometryDrawing Brush="#FF22BAFD" Geometry="..."/>
             </DrawingGroup>
         </DrawingImage.Drawing>
     </DrawingImage> 
</MyWindow.Resources>

然后像这样重用它：

<Image Source="{DynamicResource diUndo}" />

但它永远是那个颜色......

或指定颜色

使矢量成为样式，然后在目标处动态更改它（它是矢量而不是静态图像对吗？），然后在使用时指定填充颜色：

 <MyWindow.Resources>
        <Path x:Key="vRedo"
              Data="F1M14.4401,25.5039C15.5755,22.9375 17.1667,20.5703 19.2162,18.5239 23.5781,14.1587 29.3828,11.7539 35.5573,11.7539 41.7344,11.7539 47.5365,14.1587 51.8984,18.5239 56.263,22.8879 58.6667,28.6899 58.6667,34.8645 58.6667,41.0391 56.263,46.8411 51.8984,51.2056 51.2031,51.8997 50.2917,52.2461 49.3828,52.2461 48.474,52.2461 47.5599,51.8997 46.8646,51.2056 45.4818,49.8164 45.4818,47.5664 46.8698,46.177 49.8932,43.1563 51.5573,39.1392 51.5573,34.8645 51.5573,30.5911 49.8932,26.5728 46.8646,23.552 43.849,20.5273 39.8307,18.8645 35.5573,18.8645 31.2813,18.8645 27.2656,20.5273 24.2448,23.552 22.0052,25.7915 20.5182,28.5845 19.8932,31.6184L27.5573,40.1992 5.33334,40.1992 7.10938,17.2969 14.4401,25.5039z" />
        <Style x:Key="ModifiablePathStyle"
               TargetType="{x:Type Path}">
            <Setter Property="Stretch"
                    Value="Uniform" />
            <Setter Property="Data"
                    Value="{Binding Data, Source={StaticResource vRedo}}" />
        </Style>
 </MyWindow.Resources>

这是它的用法：

<Path Style="{StaticResource ModifiablePathStyle}" Fill="Blue"/>
<Path Style="{StaticResource ModifiablePathStyle}" Fill="Red"/>
<Path Style="{StaticResource ModifiablePathStyle}" Fill="Green"/>

这是所有三个的结果：

在此处输入图像描述

我发现可以在Material Design Icons找到一个很好的矢量图标来源（带有 Xaml 剪切/粘贴版本可供下载）

于 2015-06-15T20:52:19.887 回答
2

如果您不反对使用 3rd 方工具，请考虑查看SharpVectors。它在 SVG 方面做得很好：解析、XAML 转换、显示等。

编辑：我可能不明白你的问题，你可能会更好地回答 Chris W. ;)

于 2012-11-08T15:42:51.027 回答