XAML 在WPF中使用矢量图像的最佳方法?

vtwuwzda  于 2023-06-19  发布在  其他
关注(0)|答案(3)|浏览(193)

我正在寻找一个很好的方法来处理矢量文件(EPS或SVG)在XAML。我发现了一个插件,它可以将Illustrator中的图像导出到XAML中,如果我将文件的内容复制到我的窗口中,它就可以很好地工作。
但是,是否可以使用xaml输出作为资源或其他东西,并从给定的XAML窗口示例导入/转换它?
我正在使用的工具:Adobe Illustrator to Xaml

xhv8bpkk

xhv8bpkk1#

使用一个DrawingImage,作为你的 * 容器 *,它被设计成这样一个 Package 器:

<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"/>

以下是所有三个的结果:

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

jfgube3f

jfgube3f2#

就个人而言,如果您谈论的是在多个地方使用它,而不必每次重复使用/重新绘制您的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}"/>
5fjcxozz

5fjcxozz3#

如果您不反对使用第三方工具,请考虑看看SharpVectors。它在SVG方面做得很好:解析、XAML转换、显示等
编辑:我可能没有理解你的问题,你可能和Chris W更好answer ;)

相关问题