两种快速切图方式

今天给大家分享一下我自己在前端工作中的一些切图小技巧,虽然好的UI会给我们把图切好,但是他们切的图不一定百分之百符合我们的需求,所以还是自己动手丰衣足食嘛,看本教程之前希望大家能先看看慕课网的切图教程 http://www.imooc.com/learn/506 哦。

这里给大家介绍我在实际工作中用的两种切图方法,一种是“图层切图”,这种切图方式比较适合切形状不规则的png格式的小图标,如企业logo等等,而另外一种是“切片切图”,这种切图方式比较适合形状规则的jpg格式的大图。

一.图层切图:

1.打开你的Photoshop,点击选择工具,将右上角的自动选择勾上,选择为图层,为下图:

2.用鼠标左击某一个图层,这里我选择了psd设计图中的企业logo新天杰股份。

3.ps帮我们自动定位到了该图层所在的位置

4.然后右击图层12,将图层转换为智能对象,至于为什么要转换为智能对象,大家可以参考这篇文章:http://www.jianshu.com/p/73bee622017f。

5.选择选框工具,将你要切的图层圈起来:

6.接着按ctrl+c复制,再按ctrl+n新建,注意背景颜色设置为透明:

7.点击确定,再按ctrl+v粘贴,我们就得到要切的图层了:

8.再按ctrl+shift+alt+s保存,记住背景图存为PNG24格式:

9.存储到我们要存的文件夹下,就大功告成了,是不是很快,下面我们介绍切片切图,和慕课网的大同小异。

二。切片切图:

1.拉辅助线,如下:

2.选择切片工具,将我们要切的所有图片区域,用切片工具选中:

3.按住ctrl+alt+shift+s保存,保存的时候注意,保存为JPEG格式,选择为保存所有用户切片,这样子切出来的才是我们想要的图片:

4.保存之后就完工了,切片切图的方法很方便,但是注意它只能切出形状规则的图片。

作者:筆莘
链接:http://www.jianshu.com/p/704a61080f82
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

时间: 2024-09-29 17:59:35

两种快速切图方式的相关文章

Adnroid 两种下拉刷新 方式的实现 sina刷新 gmail刷新

sina刷新 这种下拉刷新的方式是比较简单的.上个图: 这种刷新方式的思路是这样的: 首先是需要一个HeaderVIew也就是刷新时头部所显示出来的数据.这个view的布局随你,长啥样自己定夺. 其他不是特别重要,重要的是用户触摸事件的捕捉,看到github上的大神的一些方法是比较正规的,我就自己用自己的方法尝试,主要是捕捉到用户的点击事件来计算用户所触摸到的位置然后来更新头部布局的位置. 这个重要的代码贴出来: case MotionEvent.ACTION_MOVE: currentY =

两种访问接口的方式(get和post)

跨机器.跨语言的远程访问形式一共有三种:scoket发送数据包.http发送请求.rmi远程连接: http发送请求方式:分为post和get两种方式 importjava.io.IOException; importjava.io.InputStream; import java.util.Map; importjava.util.concurrent.atomic.AtomicInteger; importorg.apache.commons.httpclient.HttpClient; i

javascript两种声明函数的方式的一次深入解析

声明函数的方式 javascript有两种声明函数的方式,一个是函数表达式定义函数,也就是我们说的匿名函数方式,一个是函数语句定义函数,下面看代码: /*方式一*/ var FUNCTION_NAME = function() { /* FUNCTION_BODY */}; /*方式二*/ function FUNCTION_NAME () { /* FUNCTION_BODY */}; 区别一 方式一的声明方式是先声明后使用 方式二的声明方式可以先调用,后声明 /*方式一: *先声明后使用 *

两种停止Thread的方式

当你想要依据某些条件终结thread的时候,有两种最常见的方式. 设定标记 最常见停止thread的方式是设定某些标记来表示该thread应该要停止了.thread可以周期性地查询标记以判别它是否应该退出.如例: package test; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; public class Main {     public stati

FMX有两种消息处理的实现方式,一种是用TMessageManager来实现自定义的消息,另外一种象TEdit中的实现,直接声明消息方法

看FMX代码,发现有两种消息处理的实现方式,一种是用TMessageManager来实现自定义的消息,另外一种象TEdit中的实现,直接声明消息方法. 早前,看过文章说TMessageManager的用法,可用到的时候,又找不到,只好自己动手. 我的应用场景是这样: 当前的Frame弹出一个对话框Frame,当操作对话框的时候,想让当前的Frame跟着应响,让用户看到操作的结果,如下图,点大中小字体,后面的题目的字体会跟着变化: 参考fmx的代码,试着用消息机制实现了: 1.声明消息类: typ

ajax有两种提交数据的方式,分别为get和post(转)

ajax有两种提交数据的方式,分别为get和post.post方法可传输大于2K的数据,在Ajax里的应用不同之处在于:"post方法的请求地址与传输的数据是放在两个对象里—-请求地址放在open对象里,传输的数据放在send对象里:并且在传输数据之前定义一个传输文件HTTP头信息(setRequestHeader)" 以下为引用的内容: <SCRIPT LANGUAGE="javascript"> function saveUserInfo(){ //

转:Selenium2.0介绍——WebDriver两种驱动浏览器的方式

如果之前熟悉Selenium RC,理解了Selenium RC是如何工作的,那么,当第一次接触Selenium WebDriver的时候,看到WebDriver居然可以不需要指定远端服务器的IP地址和端口号的,一定会惊讶的. 事实上,WebDriver有两种方式“驱动”浏览器的方式.1. Selenium Server:和Selenium RC一样的,通过指定远端服务器IP地址和端口号,由这个远端服务器来驱动浏览器.2. 直接调用:无须指定任何服务器IP地址和端口号.直接使用本地的浏览器(只要

Java中有两种实现多线程的方式以及两种方式之间的区别

网上流传很广的是一个网上售票系统讲解.转发过来.已经不知道原文到底是出自哪里了. Java中有两种实现多线程的方式.一是直接继承Thread类,二是实现Runnable接口.那么这两种实现多线程的方式在应用上有什么区别呢? 为了回答这个问题,我们可以通过编写一段代码来进行分析.我们用代码来模拟铁路售票系统,实现通过四个售票点发售某日某次列车的100张车票,一个售票点用一个线程表示. 我们首先这样编写这个程序: Java代码    class ThreadTest extends Thread{

Python 金融数据可视化(两列数据的提取//分别画//双坐标轴//双图//两种不同的图)

import matplotlib as mpl import numpy as np import matplotlib.pyplot as plt np.random.seed(2000) y = np.random.standard_normal((20,2)) # print(y) ''' 不同的求和 print(y.cumsum()) print(y.sum(axis=0)) print(y.cumsum(axis=0)) ''' # 绘图 plt.figure(figsize=(7,