设计文件转曲转path

     在软件开发过程中，图形元素必不可少，而在WPF中如果使用jpg或png等格式，在应用到Button等控件时的样式时，常常需要做MouseEnter,MouseDown鼠标事件提供不同的颜色或特效。一个图标得分别生成三种颜色才行。如下：

        Normal:

      MouseEnter:

       MouseDown：

且jpg与png等图片文件，如果生成大尺寸应用于小的图标会产生锯齿，如果生成小尺寸应用于大的图标则会模糊。

        所以，最佳的方式是使用系统能直接识别的特殊符号，如✎❤等，可以拷贝到控件的Content或Text等属性中直接使用，在Trigger或事件中更改Foreground即可，且它在WPF渲染中是矢量的，不必担心它会产生锯齿或模糊等问题。但是系统能直接识别的图标只有部分且对于其它第三方图形它就无能为力了。所以对于第三方的图形，最好的解决方式是将图形转化为Path数据，可在Path控件中使用。

   开始

方式1：

网上查找图标直接复制数据，适用于现有图形Path数据；若只是图片没有Path数据，请看方式2。

推荐一个非常不错的图标网站阿里的iconfont，下面以这个图标网站为示例获取Path的数据 。

链接->iconfont

 1. 进入搜索找到想要的图标(注意，某些图标只是帖个图片，这种不是Path数据的无法获取，必须找图标是Path数据的)。然后点击下载按钮。

2.在新的窗体中，按F12调出查看网页代码。当前在火狐浏览器为例，点击选取页面元素按钮后，鼠标移动到图标并点击，选择图标元素。

注意，选中的元素可能有多个嵌套，选中后下方代码出现Path的那个才是正确的。

3.双击该段代码，将d=""里面的数据选中并拷贝到Geometry资源中：

4.资源调用：

方式2：

没有Path数据 ，只有图片的将图形元素转换成Path数据直接在项目中引用。

使用的工具有：

        1.VisualStudio

        2.Photoshop

        3.Microsoft Expression Design 4

       接下来，跟着我一步步 *** 作即可：

1. 将要转换的图标文件导入Photoshop，然后选择快速选择工具：

2.鼠标点击选中要转换的图形，如图中4个方框就是:

3.右键选中的图形，选择建立工具路径，后面d出窗口设置容差，可根据图形的精度决定。

 4.在 路径 选项卡可以看到刚刚添加的工作路径，点击添加图层蒙版

 

5.在属性选项卡中点击选择矢量蒙版。此时在图层中可以看到有图层、图层蒙版和矢量蒙版三个。

6.依次点击 文件-->存储为  将文件将文件导出为.psd文件。

 Photoshop的处理到此结束 ，接下来是使用Microsoft Expression Design 4将psd文件转换为Path.

7. 在Microsoft Expression Design 4中打开刚刚生成的.psd文件，直接按Ctrl+E导出，格式选择XAML WPF资源字典

  打开刚刚生成的.xaml文件，将引号内的Clip或ClipGeometry的数据复制(字符可能非常长如果对精度要求不是那么高，可以后面写个方法把小数点后的值去掉)，在Path的Data属性中粘贴。

   效果图

  最后

       有比较简单的图形还是可以在Microsoft Expression Design 4中画出来，画的图形会比PS抠的精准，在PS中如果抠不好可能导致图形面目全非。

还有一种方式是直接在PS中生成Path数据，复制数据后做修改，有喜欢这种方式的试试吧

如何通过PS选取获取WPF路径 - 走看看

 

wpf

c#

ui设计

天水盛凡专利代办:专利申请价格全透明,无隐性收费!

盛凡知识产权

广告

JPG,PNG等格式的图片转换的ICON保存为ICO文件

449阅读·0评论·0点赞

2011年11月6日

WPF学习之绘图和动画

5.6W阅读·17评论·37点赞

2012年11月13日

【Note】插件式开发中WPF的ICON修改方法

34阅读·0评论·2点赞

2022年12月21日

WPF获得PNG图片外观Path数据

9811阅读·8评论·0点赞

2017年8月14日

利用Path路径设计的按钮图标(Silverlight)

1131阅读·0评论·0点赞

2015年9月14日

在WPF中使用SVG矢量图

3833阅读·0评论·1点赞

2021年8月3日

好消息：专利申请并不麻烦，这有专利申请流程及费用，立即查询！

盛凡知识产权

广告

Expression Design 4工具与Expression Blend 4工具

910阅读·0评论·0点赞

2019年3月1日

android vector矢量图画图详解

7543阅读·0评论·6点赞

2016年5月8日

WPF中如何在Image控件中显示动态生成的Path？

1516阅读·0评论·0点赞

2018年12月20日

PSD路径转换为 WPF path 的data

259阅读·0评论·0点赞

2018年4月2日

C# 绘图3 路径Path &OnPaint方法

1442阅读·0评论·1点赞

2017年2月13日

Android进阶之路 - Uri、Path、File、Bitmap 转换方式

5307阅读·1评论·1点赞

2018年10月13日

WPF开发教程

2.3W阅读·5评论·50点赞

2019年7月2日

WPF绘制矢量图（网址收藏）

1428阅读·0评论·0点赞

2020年1月8日

WPF中制作立体效果的文字或LOGO图形

1.4W阅读·0评论·1点赞

2008年4月20日

CMAKE 批量获取目录下指定类型文件并转换为相对路径

810阅读·0评论·1点赞

2021年3月28日

WPF大图片缩小后显得模糊/锯齿怎么办

685阅读·0评论·1点赞

2020年5月18日

WinForm和WPF中使用字体图标ICON

1369阅读·0评论·0点赞

2022年2月16日

Svg 图标转换成Wpf path Geometry

2824阅读·2评论·0点赞

2020年12月22日

去首页

看看更多热门内容

可以的,但效果不是很好,不妨试试,先在PS里面不要合并图层,然后关闭保存成PSD格式的,然后再导入到CORELDRAW里面,选中图形,打散,解散群组,然后在单个的转曲就行了(CTRL+Q).

PS里是没有转曲功能的，只能把图层进行册格化，相当于转曲。

低版本PS应该也是可以打开高版本保存的文件，只是会出现某些特效或功能不可用、失效的情况。你可以在保存时选择“最大兼容PSD”，没有这个选项的话可以在编辑--首选项--文件处理--最大兼容psd和psb文件中选（总是）。这样低版本就可以打开高版本的文件了。

---