屌丝个人开发者经常遇到的尴尬问题是,自己不会设计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. 用CentOS 7打造合适的科研环境 :zhuan

    这篇博文记录了我用CentOS 7搭建地震学科研环境的过程,供我个人在未来重装系统时参考.对于其他地震学科研人员,也许有借鉴意义. 阅读须知: 本文适用于个人电脑,不适用于服务器: 不推荐刚接触Lin ...

  2. bootstrap插件学习-bootstrap.typehead.js

    先看bootstrap.typehead.js的结构 var Typeahead = function ( element, options ){} //构造器 Typeahead.prototype ...

  3. bootstrap插件学习-bootstrap.carousel.js

    先看bootstrap.carousel.js的结构 var Carousel = function (element, options){} //构造器 Carousel.prototype = { ...

  4. 使用stdarg.h实现可变长度参数

    现在先用一个使用过程讲解一下: ◎用法: func( Type para1, Type para2, Type para3, … ) { /****** Step 1 ******/ va_list ...

  5. iOS-UITextField-常用方法

    一.textField的常用设置 // 创建文本框     UITextField *tf = [[UITextField alloc] initWithFrame:CGRectMake(60, 10 ...

  6. 学习android开发笔记

    最近重点看了几个android工程的源代码,有几点疑问 1:为什么android客户端游戏要开启n个线程,而且通常每个线程的操作只有i++: 2:为什么很多列表在游戏逻辑和绘制逻辑里没有做同步: 3: ...

  7. URL与图像格式

    绝对/相对URL “绝对URL”是指资源的完整的地址,通常以“http://”打头: “相对URL”是指Internet上资源相对于当前页面的地址,它包含从当前页面指向目标资源位置的路径,不以“htt ...

  8. 【原创】记一次Sql2008R2的数据库订阅发布遇到的问题!

    1.首先新建一个空的数据库 CreditTest,里面没有任何表结构,视图,数据等. 2.在已连接的服务器的下方找到“复制”选项,然后兴建发布: ...(新建发布成功) ...(新建订阅成功) 3.问 ...

  9. 剑指offer面试题31连续子数组的最大和

    一.题目描述 HZ偶尔会拿些专业问题来忽悠那些非计算机专业的同学.今天测试组开完会后,他又发话了:在古老的一维模式识别中,常常需要计算连续子向量的最大和,当向量全为正数的时候,问题很好解决.但是,如果 ...

  10. 在一个XAML中点击按钮,界面跳转到另一个XAML界面方法

    private void ButtonGo_camerapage(object sender, RoutedEventArgs e) { this.Content = new cameraPage() ...