制作font-icon有感
连日来有些空闲，趁着这闲余时间，我尝试亲自制作一些Font-Icon，让以后可以运用到工作中。但是基于本人水平有限，PS操作只能以非常基础来形容，而AI呢，根本就只会放大操作。在这过程真的非常感谢设计同事的帮助。
现在想完成以下图标转换成Font-Icon，图标以下所示。
第一个Icon是一个小电视，命名为ico_tv，在设计师给的设计稿中，它已经是路径了，但是细看一下，这个ico_tv有三条路径，但是在网上的一些把svg转成Font-Icon的网站中（例如fontello ，但是icoMoon可以，如果使用的是icoMoon后面的合并路径可以忽略），它在转换的时候只需要一条路径，这就需要我们在PS中把它们的路径都合在一起。
Ico_tv的三条路径
在PS中，把所以的路径合在一起，需要把路径选取好之后，点击上面的“路径操作按钮”，里面有4个选项，合并，减去，相交，去重，这4个效果就相当于集合的操作，我们想保留的是蓝色的部分，也是之后变成字体之后，着色的部分，而这里4条路径，分别是，ico_tv的外框，以及右边的3个小长方形，需要把小长方形的那部分去掉，这里的操作就选用“去重”。完成后，当点击按钮时候，路径都选中。
Ico_tv路径合成后
打开AI，新建面板，350mmX350mm，在PS上选中所有的路径，拖拉到AI上，把路径放大到跟画板差不多大，填充颜色（iconMoon需要填充单一颜色，fontello则可以不填充，不过推荐最好有填充颜色，看着更为直观）。然后保持成为svg格式。
打开IcoMoon网页（我较多使用这个网站），在这里可以上传我刚刚绘制的ico_tv，还可以进行一些简单编辑。
上传icon的按钮
最后导出Font代码，填写icon对应的Unicode编码，旁边会现在所对应的符号。点击download即可下载代码。最后展示如图。
然而，如果给的设计稿里面的icon只是一个图层的话，就需要把它们转化成路径了。一般使用矩形工具那一列，把形状变成路径，还有钢笔工具，路径选择工具等，做图层那个icon的临摹。
最新文章
- spring加载配置文件
- PPP协议
- 我的ORM之四--删除
- 用pywinauto进行win32应用程序的测试
- Sphinx的介绍和原理探索
- LeetCode Walls and Gates
- NSString常见用法总结
- objcopy
- c#,if 分支语句,条件运算符
- python使用rabbitMQ介绍五（话题模式）
- CSL 的神奇序列（猜猜猜？）
- Mac包管理神器Homebrew
- JAVA将单词首字母大写方法
- gradle 很好用的么
- 关于kernel-devel、kernel-header和kernel src的区别
- HTTP和HTTPS的区别（转）
- Git log和git reflog
- RMQ板子
- 全部读取------------ 一次性全部读取的.read() VS 一行一行的for迭代
- APM最佳实践： 诊断平安城市视频网性能问题