WPF使用SVG简单整理

一、SVG是什么

它的英文全称为Scalable Vector Graphics，意思为可缩放的矢量图形。

 具体参考:https://www.w3.org/Graphics/SVG/

 

二、SVG制作

1、在iconfont网站选择要需要的图标加入到项目，进行编辑

2、在线网站svg文件编辑制作

    />    https://www.zhangxinxu.com/sp/svg/
    https://c.runoob.com/more/svgeditor/

3、使用Inkscape软件 

    这个软件在处理svg明显强大的多，有详细帮助文档和示例，具体参考官网。 

 

三、WPF里使用SVG

我常用的有三种方式：

1、单个图标的svg,

    直接复制path下面d属性的内容 到wpf Path里面使用，通常在Iconfont搜索下载

2、直接加载svg文件，就像加载图片路径一样

   需要使用svg文件的库：https://github.com/ElinamLLC/SharpVectors

3、将svg转换为xaml并将其与原生wpf对象一起使用

   首推 Inkscape软件能保存为Xaml文件，wpf里面直接使用。

   使用开源工具：SvgToXaml 转换为DrawingImage 资源 ，

   简单举例一个例子，渐变背景加一个图标。如下：

 <Window.Resources>  <DrawingImage x:Key="svg_DrawingImage">   <DrawingImage.Drawing>    <DrawingGroup ClipGeometry="M0,0 V353 H152 V0 H0 Z">     <GeometryDrawing Geometry="F0 M152,353z M0,0z M43.986,167.058C53.875,167.058 61.892,175.092 61.892,185.002 61.892,194.912 53.875,202.946 43.986,202.946 34.097,202.946 26.08,194.912 26.08,185.002 26.08,175.092 34.097,167.058 43.986,167.058z">      <GeometryDrawing.Brush>       <LinearGradientBrush StartPoint="26.0803,185.0014"             EndPoint="61.8916,185.0014"             MappingMode="Absolute"             SpreadMethod="Pad"             Opacity="1">        <GradientStop Color="#FF3FEAAF"            Offset="0" />        <GradientStop Color="#FF0BE873"            Offset="0.73549999999999993" />       </LinearGradientBrush>      </GeometryDrawing.Brush>     </GeometryDrawing>     <GeometryDrawing Brush="#FFFFFFFF"          Geometry="F1 M152,353z M0,0z M51.162,175.539L36.302,175.539 32.233,182.101 43.492,196.465 55.739,182.099 51.162,175.539z M43.747,176.506L48.205,181.798 39.734,181.798 43.747,176.506z M39.298,181.436L37.053,176.106 43.339,176.106 39.298,181.436z M48.258,182.366L43.52,194.536 39.5,182.366 48.258,182.366z M38.904,182.366L43.086,195.027 33.161,182.366 38.904,182.366z M48.809,182.514L48.827,182.536 48.899,182.366 54.767,182.366 43.908,195.104 48.809,182.514z M49.137,181.798L51.283,176.703 54.837,181.798 49.137,181.798z M50.899,176.154L48.667,181.453 48.649,181.446 44.151,176.107 50.865,176.107 50.899,176.154z M36.51,176.279L38.835,181.798 33.088,181.798 36.51,176.279z" />    </DrawingGroup>   </DrawingImage.Drawing>  </DrawingImage> </Window.Resources> <Grid>  <Image Source="{StaticResource svg_DrawingImage}" /> </Grid>

 

总结：推荐Inkscape设计svg文件，功能强大同时能导出很多种格式。 

 关于wpf如何使用 iconfont字体,下一篇单独总结

 

WPF使用SVG简单整理
"沃付全球 洞悉本土 " World First 2017跨境电商峰会、 Amazon文案设计、 产品运营、 如何应付GBC的侵权控告、 注意！EPS流氓律师所起诉完亚马逊卖家后，黑手伸向独立站、 老公不行 21岁儿媳与52岁公公乱情、 ebay：违规海外仓账号即日起将面临严重处罚、 实用工具推荐：跨境电商老鸟都在用的6个超强悍工具！、 客户问题、 Payoneer简介、 houzz、 类目节点选择要谨慎！亚马逊Listing优化有方法！、 两部委出手！进口汽车零部件利好来袭！、 南美跨境电商有哪些？最新南美跨境电商平台一览、 亚马逊 PPC广告优化 – 关键字的优化关键、 运营做不好，产品卖不好，应该从6个方向找问题、