博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
PS切图
阅读量:6363 次
发布时间:2019-06-23

本文共 1652 字,大约阅读时间需要 5 分钟。

内容:

1.PS安装与基本使用

2.PS切图(只介绍最基础的切图方法)

 

 

 

参考:

 

1.PS安装与基本设置

(1)什么是PS

Adobe Photoshop,简称“PS”,是由Adobe Systems开发和发行的图像处理软件。
Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具,可以有效地进行图片编辑工作。ps有很多功能,在图像、图形、文字、视频、出版等各方面都有涉及

 

(2)PS破解安装

安装包下载: 密码:85di

 

(3)基本设置

ps界面设置:

点击新建,然后选择如下:

选择完之后可以选择存储预设(存储选择下次直接用),然后点击确定即可 ,之后会出现如下画面:

然后我们可以使用打开,打开一个psd文件,如下所示:

 

移动工具设置:

移动工具就是PS快捷键中的第一个工具:

 

视图设置:

在视图选项中选择显示,然后勾选上智能参考线,另外还要在视图中勾上标尺

 

其他设置:

把右上角的一大堆东西关闭只留下以下四个(没有的在视图中找):

设置信息的面板选项,选中信息,点击右上角,选中面板选项设置如下所示:

设置编辑中的首选项中的单位与标尺中的单位均为像素:

 

 

2.PS切图

(1)前端为什么要学切图

UI给我们设计图的时候都会有一份设计原稿psd文件,有的公司可能UI会把需要的图标给切好,更多时候是需要我们自己来切的。而且,有的时候可能需要的东西UI没有切出来,你就要去是去找UI切好了再发给我们,这个过程就变得很麻烦,所以不如自己学一些切图方法 

 

(2)切图的目的

从psd文件中获取我们想要的资源

 

(3)选中切图的目标

删除多余的参考线:

上面的图片中很多条蓝色的参考线,这些线是设计人员用来设计用的,有的文件中的线会直接把我们需要切的东西给包裹出来,但是像我们练习的这个文件中的参考线特别的多,特别的密集,很多我们都不需要,所以我们先把这些参考线都清除掉

删除参考线:选择移动工具,然后把要删除的参考线往标尺上拖,往上或者往左都可以

一次性删除所有参考线:选择视图中的清除参考线选项即可

没有参考线的可能是参考线被隐藏了,通过“CTRL”+ “;”就可以显示出来 

选择要切的图标:

①选择工具栏第一个“移动工具” 

这里写图片描述

②然后查看上面选项栏“自动选择”有没有被选中,没有被选中点击选中,将它旁边的“组”改为“图层”,这样我们点击图标的时候,

右下角的图层面板就能自动的选中对应的图层 

这里写图片描述

③点击我们要切的图标,然后到右下角的图层面板,点击当前选中的这个图层旁边的小眼睛来隐藏当前图层,通过显隐来确定是不是我们要切的图标 

这里写图片描述

④确认了我们要切的图标后,分别从水平标尺和竖直标尺的地方拉取参考线来把图标给包裹住。因为我们当前选中的就是我们要切的图层,所以当参考线拖过去的时候会自动吸附到图标的边缘。

⑤用同样的方法把图标都用参考线包裹出来,最下面一排,要把图标切成一样高的才好,所以以第一个的上边界和下边界为基准

 

(4)切出图标

现在,我们已经用参考线把我们的图标给包裹出来了,下面用切片工具切出图标 

①选择切片工具,左边工具栏从上往下数第五个,然后右键就可以找到,然后选中其中的切片工具

这里写图片描述

②然后找到我们刚才用参考线包裹的图标,从左上角一直拖到右下角

因为有参考线的帮助,所以软件能够自动吸附到参考线上,所以只要大概找准左上角和右下角就可以选取出来 

 

③用同样的方法把剩下的都选取出来 

 

(5)保存切图

①选择 “文件”=》“存储为Web所用格式” 

这里写图片描述

②调整缩放比例,让图片能完整的在窗口显示 

③在窗口中,从左上角一直拖到右下角,选中所有切片,这样我们才能把切片都存储为我们想要的格式 

④存储为png-24格式,png-24格式的图片质量比较高 

 

⑤保存,选择路径保存图片,保存完毕查看图片,查看保存的文件里面就多了一个images文件夹,里面就是我们切出来的图片 

保存的设置如下:

保存完查看如下:

 

转载于:https://www.cnblogs.com/wyb666/p/9491792.html

你可能感兴趣的文章
全球程序员编程水平排行榜TOP50,中国排名第一
查看>>
HDFS 进化,Hadoop 即将拥抱对象存储?
查看>>
Edge 浏览器奇葩 bug:“123456”打印成“114447”
查看>>
Sirius —— 开源版的 Siri ,由 Google 支持
查看>>
《OpenGL ES应用开发实践指南:Android卷》—— 2.7 小结
查看>>
《Windows Server 2012活动目录管理实践》——第 2 章 部署第一台域控制器2.1 案例任务...
查看>>
Java Date Time 教程-时间测量
查看>>
Selector.wakeup实现注记
查看>>
《Java EE 7精粹》—— 第1章 Java EE 1.1 简介
查看>>
《Exchange Server 2013 SP1管理实践》——导读
查看>>
syslog:类Unix系统常用的log服务
查看>>
使用Annotation设计持久层
查看>>
深入实践Spring Boot2.4.1 Neo4j依赖配置
查看>>
Zen Cart 如何添加地址栏上的小图标
查看>>
SecureCrt 连接Redhat linux
查看>>
[NHibernate]持久化类(Persistent Classes)
查看>>
安装oracle数据库提示“程序异常终止”解决方案
查看>>
如何在Hive中使用Json格式数据
查看>>
iOS开发网络篇—简单介绍ASI框架的使用
查看>>
linux如何恢复被删除的热文件
查看>>