屌丝个人开发者经常遇到的尴尬问题是，自己不会设计UI素材又请不起专业的美工。最好的方式是去网上下载符合自己需求的素材修修改改直接用上。但是，在这个过程中会发现很多下载下来的素材是PSD格式的，很多图标资源以图层的方式共存于一个PSD文件中。最傻的办法是新建一个图层，把需要的某个图标土层复制过去然后再保存。这种图的掉渣的方式确实影响工作效率，程序员岂能浪费时间在这种事情上？本文采用一种全自动的方式提取出这个PSD里面的所有图标并生成png、jpg、@2x图标，整个过程是傻瓜式的。Let`s go!

step1:下载PSD素材。本文的例子如上图所示，每个图标用一个图层表示

step2：重命名图层。以like图层为例，它所对应的图标是第1行第4列的桃心。如果我们想要保存为.png格式，并且加上@2x后缀，则直接双击图层名字，改为like@2x.png。其他图层都要修改名字，名字不必一致。结束后保存psd

step3：下载切图神奇Slice(mac版)，附上pj版链接：http://ifunapple.com/2014/04/slicy/

step4：将psd文件拖到Slice窗口中，几秒后热腾腾的图标文件就出来了

更多介绍请移步http://jingyan.baidu.com/article/fec4bce2377855f2618d8bfb.html

【原】PSD图标素材的全自动切图方法，适用于IOS、安卓、web前端等领域的更多相关文章

  1. 第144天：PS切图方法总结

    一.切图方法分类 PhotoShop从CS版本演变到现在的CC版本,切图功能发生了比较大的变化,我们可以把PhotoShop CS版本时的切图功能称为传统切图,而从PhotoShop CC版本开始PS ...

  2. [超级懒人最简单法]iPhone 6 plus 适配切图方法分享(转载文章)

    网络上已经有很多适配教程,可是看了半天总是半懂不懂..最后还是要综合多个教程再动动脑子动动手,最好有程序大哥帮你试一下(这得有多大的福气) 如果有跟我一样情况的: 1.       有人说用sketc ...

  3. 两种ps切图方法（图层/切片）

    两种Ps切图方法 一．      基础操作: a)    Ctrl++ 放大图片,ctrl - -缩小图片 b)    按住空格键space+,点击鼠标左键,拖动图片. c)    修改单位,点击编辑 ...

  4. ImageMagick 拼图及切图方法

    ImageMagick 拼图方法1. 拼图montage *.jpg  -tile 22x2  -geometry 64x256+0+0 10-.jpg将目录里的jpg文件按顺序拼成x轴22块,y轴2 ...

  5. 精雕细琢 35 套精美的 PSD 图标素材

    设计师总是有独特的创意和精雕细琢的精湛技术,让我们值得去欣赏和借鉴,如梦想天空所表达的:非常感谢那些很有才华的设计师分享它们的劳动成果,让更多的人可以使用他们的创意设计.今天,本文与大家分享35套精美 ...

  6. 切图教程，PS和AI切图方法分享

  7. 做一个会PS切图的前端开发

    系列链接 做一个会使用PS的前端开发 做一个会PS切图的前端开发 切图方法分类 PhotoShop从CS版本演变到现在的CC版本,切图功能发生了比较大的变化,我们可以把PhotoShop CS版本时的 ...

  8. photoshop CC智能切图

    网页设计在技术层面上,第一步是美工做出网页效果图,第二步就是网页前端进行网页切图.网页切图工具常用的有fireworks.PS,这里使用PS进行网页切图. 我们通过设计稿,得到我们想要的产出物(如.p ...

  9. Sketch 和 PS中的设计图如何实现“自动切图”？

    切图是很多UI设计师的一项日常工作.平时做完设计图,要将设计稿切成便于制作成页面的图片,并标注好尺寸和间距,交付给前端来完成html+css布局的静态页面,有利于交互,形成良好的视觉感. 但有的认为前 ...

随机推荐

  1. xdebug调试一直等待连接

    调试php时一般会启动浏览器,地址栏里一般是 index.php?XDEBUG_SESSION_START=xxx xxx表示调试的ide_key. 开了代理没有关,结果调试时一直无法连上,折腾了好久 ...

  2. 找工作--Java相关

    Hi 各位 首先自我描述一下,80后程序员,现在在做Eclipse插件开发. 求Java相关职位(Java/Swing/Eclipse Plugin/Python etc), 或者Linux下C相关职 ...

  3. 用httpclient访问时，附带cookie信息

    var url = "address"; var cookieContainer = new CookieContainer(); using (var handler = new ...

  4. HMM 自学教程（二）生成模型

    本系列文章摘自 52nlp(我爱自然语言处理: http://www.52nlp.cn/),原文链接在 HMM 学习最佳范例,这是针对 国外网站上一个 HMM 教程 的翻译,作者功底很深,翻译得很精彩 ...

  5. Vue基础---->VueJS的使用(一)

    Vue.js是一个构建数据驱动的web界面的库.它的目标是通过尽可能简单的API 实现响应的数据绑定和组合的视图组件,今天我们就开始vue.js的学习. vue的安装及使用 一.vue的下载地址:ht ...

  6. 转载：第四弹！全球首个微信小程序（应用号）开发教程！通宵吐血赶稿，每日更新！

    感谢大家支持!博卡君周末休息了两天,今天又回到战斗状态了.上周五晚上微信放出官方工具和教程了,推荐程序猿小伙伴们都去试一试,结合教程和代码,写写自己的 demo 也不错. 闲话不多说,开始更新! 第七 ...

  7. Android开发权威指南（第2版）新书发布

    <Android 开发权威指南(第二版)>是畅销书<Android开发权威指南>的升级版,内容更新超过80%,是一本全面介绍Android应用开发的专著,拥有45 章精彩内容供 ...

  8. 华为手机Edittext光标（cursor）颜色修改

    华为手机的emui系统经常让人发出“可以可以,这很华为”的感叹 这两天在edittext部分也发生了这样的事情 正常edittext光标的颜色和宽度都说可以修改的,只需要通过xml中的 textCur ...

  9. 软件测试之黑盒测试：打着手电寻找bug

    功能测试,简单的理解就是黑盒测试,就是检测黑盒子,找到里面存在的缺陷. 功能测试新人学习计划: 1. 对于产品的学习---站在客户的角度学习产品.看待问题 测试人员不是简单地按照开发人员的设计文档去撰 ...

  10. C#中方法的调用

    C#中方法的调用 1.同一个类中方法的调用: 静态方法可以直接调用静态方法 静态方法不能直接调用非静态方法,静态方法先生成. 非静态方法可以直接调用静态方法 如果静态方法要调用非静态的方法,必须使用实 ...