原文:c# WPF SVG 文件的引用(SharpVectors)

阿里巴巴矢量图标库提供了大量的 SVG 图标:https://www.iconfont.cn/

但是 WPF 本身不支持 SVG 格式的文件。

方法一:如果对图片的颜色没有要求,那么可以在下载图片时选择:复制 SVG ,然后将文本中的 Path 路径提取出来,多个路径之间用空格隔开。这种方法只能调节图像的前景色和背景色。

原 SVG 文本:

<svg t="" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="" width="" height=""><path d="M651.424 217.066667a32 32 0 0 1 62.485333 13.866666L682.261333 373.333333H800a32 32 0 0 1 31.946667 30.122667L832 405.333333a32 32 0 0 1-32 32H668.032l-33.184 149.333334H800a32 32 0 0 1 31.946667 30.122666L832 618.666667a32 32 0 0 1-32 32H620.629333l-34.72 156.266666a32 32 0 0 1-36.341333 24.661334l-1.845333-0.352a32 32 0 0 1-24.298667-38.186667L555.061333 650.666667H407.296l-34.72 156.288a32 32 0 0 1-36.341333 24.64l-1.845334-0.341334a32 32 0 0 1-24.298666-38.186666L341.728 650.666667 224 650.666667a32 32 0 0 1-31.946667-30.122667L192 618.666667a32 32 0 0 1 32-32h131.957333l33.184-149.333334H224a32 32 0 0 1-31.946667-30.122666L192 405.333333a32 32 0 0 1 32-32h179.36l34.730667-156.266666a32 32 0 0 1 36.341333-24.661334l1.845333 0.352a32 32 0 0 1 24.298667 38.186667l-31.648 142.378667h147.765333zM602.474667 437.333333H454.698667l-33.184 149.333334h147.776l33.184-149.333334z" p-id=""></path></svg>

XAML 代码:

  <Path Width="" Height="" Stretch="Uniform" Data="M856.34479531 833.26631065a42.58114365 42.58114365 0 0 0 40.27053867-48.19261201l-16.1742331-88.13306426A80.87116377 80.87116377 0 0 0 805.18140547 632.57378926h-193.76070732l-15.84414581-99.02591543a236.01176455 236.01176455 0 0 0 148.20878584-221.81804912 240.96306006 240.96306006 0 1 0-481.59603369 0 236.34185098 236.34185098 0 0 0 148.53887226 220.49770341l-11.88310956 99.02591544H206.07461914a77.57030039 77.57030039 0 0 0-76.24995469 64.36684511L113.65043222 783.75335293a37.95993369 37.95993369 0 0 0 36.30950156 48.19261201z M161.51295781 862.97408457h693.18140537a49.51295771 49.51295771 0 0 1 49.51295772 49.51295772 49.51295771 49.51295771 0 0 1-49.51295772 49.51295771h-693.18140537A49.51295771 49.51295771 0 0 1 112.0000001 912.48704229 49.51295771 49.51295771 0 0 1 161.51295781 862.97408457z M664.89469297 277.0707544m-33.00863906 0a33.00863818 33.00863818 0 1 0 66.01727724 0 33.00863818 33.00863818 0 1 0-66.01727724 0Z M527.57875654 144.37602793a177.91656065 177.91656065 0 0 1 56.11468536 28.71751553 165.0431918 165.0431918 0 0 1 33.00863906 47.86252558 25.08656484 25.08656484 0 0 0 44.2315749-23.10604716 221.81805 221.81805 0 0 0-46.21209346-62.05624014A216.20658164 216.20658164 0 0 0 542.43264394 97.50376162a24.7894875 24.7894875 0 0 0-16.17423222 46.87226631z" />
      

方法二:使用 nuget 安装 sharpvectors 包:

Install-Package SharpVectors -Version 1.0.0

在调试时走了一点弯路,后来看到了这篇问答:http://www.jiajianhudong.com/question/778215.html 。

总之要注意两点:1.使用     Source="pack://application:,,,/1.svg"      这种方法来调用 svg 文件,这样才能正确的调用资源。

2. svg 文件的属性默认是内容,务必改为  Resource,然后一定要重新生成项目再运行。

<Window x:Class="WpfStudy.Wnd1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfStudy"
mc:Ignorable="d"
xmlns:svgc="http://sharpvectors.codeplex.com/svgc/"
Title="Wnd1" Height="" Width="">
<Grid>
<StackPanel>
<Button Width="" Height="">
<svgc:SvgViewbox IsHitTestVisible="False" Source="pack://application:,,,/1.svg"/>
</Button>
</StackPanel>
</Grid>
</Window>

c# WPF SVG 文件的引用(SharpVectors)的更多相关文章

  1. WPF中Style文件的引用——使用xaml代码或者C#代码动态加载

    原文:WPF中Style文件的引用--使用xaml代码或者C#代码动态加载 WPF中控件拥有很多依赖属性(Dependency Property),我们可以通过编写自定义Style文件来控制控件的外观 ...

  2. WPF 中style文件的引用

    原文:WPF 中style文件的引用 总结一下WPF中Style样式的引用方法: 一,内联样式: 直接设置控件的Height.Width.Foreground.HorizontalAlignment. ...

  3. SVG文件:从Illustrator导文件到Web

    可缩放矢量图形(SVG)是早在1998年就已经有的一种矢量图像格式.它总是和Web一起发展,但是直到现在才开始赶上Web发展的步伐.如今我们已经不能否认SVG和Web的相关性,所以让我们来学习一下从I ...

  4. svg矢量图标在html中的使用, (知识点:1.通过h5中的css实现点击变色,2.一个svg文件包含多个图标)

    svg矢量文件体积小,不变形,比传统的png先进,比现在流行的icon-font灵活.然而在使用过程中还是遇到了很多坑.今天花了一天时间把经验整理出来,以供后来者借鉴.如果您从本文收益,请留言mark ...

  5. 将指定路径下的所有SVG文件导出成PNG等格式的图片(缩略图或原图大小)

    原文:将指定路径下的所有SVG文件导出成PNG等格式的图片(缩略图或原图大小) WPF的XAML文档(Main.xaml): <Window x:Class="SVG2Image.Ma ...

  6. WPF svg 转 xmal

    原文:WPF svg 转 xmal 今天wpf里面要用矢量图,美工出的是svg格式的,需要将svg格式的转换为xaml 1.第一个尝试是安装Inkscape,这个软件可以直接将svg另存为xaml,但 ...

  7. 简单生成svg文件

    this.fileSaveSync = function (file, data) { var fs = require('fs-extra'); fs.writeFileSync(file, dat ...

  8. CDN的combo技术能把多个资源文件合并引用,减少请求次数

    CDN的combo技术能把多个资源文件合并引用,减少请求次数.比如淘宝的写法: <link rel="stylesheet" href="//g.alicdn.co ...

  9. NK3C:关于svg文件使用

    我们从 http://iconfont.cn/ 上下载的SVG文件由以下构成,系统中使用的时候请做适当的修改: 1.width.Height:设置为100%: 2.defs模块去掉:(如果不去掉,IE ...

随机推荐

  1. protocol buffer第一篇:语法介绍

    先理解一下protocol buffer是什么东西. protocol buffer是google发明的一种数据序列化方案,和json是同种类型的玩意,它非常适合在rpc场景下使用.同json一样,p ...

  2. Codeforces Round #303 (Div. 2) E. Paths and Trees Dijkstra堆优化+贪心(!!!)

    E. Paths and Trees time limit per test 3 seconds memory limit per test 256 megabytes input standard ...

  3. 洛谷 P2330 [SCOI2005] 繁忙的都市 x

    题目描述 城市C是一个非常繁忙的大都市,城市中的道路十分的拥挤,于是市长决定对其中的道路进行改造.城市C的道路是这样分布的:城市中有n个交叉路口,有些交叉路口之间有道路相连,两个交叉路口之间最多有一条 ...

  4. pyinstaller打包的exe太大?你需要嵌入式python玄学 拓展篇

    上篇我们讲到embedded版本的基础操作 CodingDog:pyinstaller打包的exe太大?你需要嵌入式python玄学 惊喜篇​zhuanlan.zhihu.com 可是却没有办法用pi ...

  5. AtCoder AGC002E Candy Piles (博弈论)

    神仙题..表示自己智商不够想不到... 好几次读成最后拿的赢了,导致一直没看懂题解... 题目链接: https://atcoder.jp/contests/agc002/tasks/agc002_e ...

  6. android自定义camera以及uri和文件路径之间的转换

    相对直接调用系统的camera,这种方法使用得相对还少一些.根据api文档,步骤如下: 定义一个预览类 可以参照<android高薪之路>这本书上面,有这种方法的一种完整实现 而对应的ac ...

  7. 浏览器端-W3School:JS & DOM 参考手册

    ylbtech-浏览器端-W3School:JS & DOM 参考手册 1.返回顶部 1. JavaScript 参考手册 本部分提供完整的 JavaScript 参考手册: JavaScri ...

  8. 性能测试工具之WebBench

    一.简介 WebBench是一款在Linux下使用非常简单的压力测试工具.它的原理是:WebBench首先fork出多个子进程,每个子进程都循环做web访问测试.子进程把访问的结果通过pipe告诉父进 ...

  9. linux 安装 sudo

    1.安装sudo# apt-get install sudo2.修改 /etc/sudoers 文件属性为可写# chmod +w /etc/sudoers3.编辑 /etc/sudoers ,添加如 ...

  10. 【ABAP系列】SAP ABAP 行列转换的方法

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP ABAP 行列转换的方法 ...