前言在软件开发过程中图形元素必不可少而在WPF中如果使用jpg或png等格式在应用到Button等控件时的样式时常常需要做MouseEnter,MouseDown鼠标事件提供不同的颜色或特效。一个图标得分别生成三种颜色才行。如下Normal:MouseEnter:MouseDown且jpg与png等图片文件如果生成大尺寸应用于小的图标会产生锯齿如果生成小尺寸应用于大的图标则会模糊。所以最佳的方式是使用系统能直接识别的特殊符号如✎❤等可以拷贝到控件的Content或Text等属性中直接使用在Trigger或事件中更改Foreground即可且它在WPF渲染中是矢量的不必担心它会产生锯齿或模糊等问题。但是系统能直接识别的图标只有部分且对于其它第三方图形它就无能为力了。所以对于第三方的图形最好的解决方式是将图形转化为Path数据可在Path控件中使用。开始方式1网上查找图标直接复制数据适用于现有图形Path数据若只是图片没有Path数据请看方式2。推荐一个非常不错的图标网站阿里的iconfont下面以这个图标网站为示例获取Path的数据 。链接- iconfont1. 进入搜索找到想要的图标然后点击下载按钮。某些图标只是帖个图片不是矢量图形的Path数据的无法获取必须找图标是Path数据的。2.跳转到新的页面按F12调出网页代码并选择图标。以火狐浏览器为例点击选取页面元素按钮后鼠标移动到图标并点击选择中间的图标元素。注意选中的元素可能有多个嵌套选中后下方代码出现Path的那个才是正确的。3.双击该段代码将d里面的数据选中并拷贝到Geometry资源中4.资源调用示例可以自己定义一个Button将Path包含在其中。这样颜色或尺寸等设置可更加随意。以上方式基本上很多图标都能找到对应的Path 数据基本上能解决大部分的需要。如果比较少见或没有Path数据的图标需要自己制作的请看下面方式2方式2没有Path数据只有图片的将图形元素转换成Path数据直接在项目中引用。使用的工具有1.VisualStudio2.Photoshop3.Microsoft Expression Design 4接下来跟着我一步步操作即可1.将要转换的图标文件导入Photoshop然后选择快速选择工具2.鼠标点击选中要转换的图形如图中4个方框就是:3.右键选中的图形选择建立工具路径后面弹出窗口设置容差可根据图形的精度决定。4.在路径选项卡可以看到刚刚添加的工作路径点击添加图层蒙版5.在属性选项卡中点击选择矢量蒙版。此时在图层中可以看到有图层、图层蒙版和矢量蒙版三个。6.依次点击文件-- 存储为将文件将文件导出为.psd文件。Photoshop的处理到此结束 接下来是使用Microsoft Expression Design 4将psd文件转换为Path.7.在Microsoft Expression Design 4中打开刚刚生成的.psd文件直接按CtrlE导出格式选择XAML WPF资源字典打开刚刚生成的.xaml文件将引号内的Clip或ClipGeometry的数据复制(字符可能非常长如果对精度要求不是那么高可以后面写个方法把小数点后的值去掉)在Path的Data属性中粘贴。效果图最后有比较简单的图形还是可以在Microsoft Expression Design 4中画出来画的图形会比PS抠的精准在PS中如果抠不好可能导致图形面目全非。还有一种方式是直接在PS中生成Path数据复制数据后做修改有喜欢这种方式的试试吧如何通过PS选取获取WPF路径 - 走看看