app android切图工具,小白自学APP切图:APP切图工具Cutterman的参数设置
其实25学堂分享切图的干货很多了,今天学堂君就给刚刚入门学习APP设计的小伙伴一些干粮。
优秀的切图工具推荐:Cutterman
想要了解更多APP切图工具Cutterman的干货,大家可以在25学堂上搜索:Cutterman就可。
Cutterman是一款运行在photoshop中的插件,能够自动将你需要的图层进行输出, 以替代传统的手工 "导出web所用格式" 以及使用切片工具进行挨个切图的繁琐流程。
它支持各种各样的图片尺寸、格式、形态输出,方便你在pc、ios、Android等端上使用。
它不需要你记住一堆的语法、规则,纯点击操作,方便、快捷,易于上手。
如果你还不懂如果来设置这些切图的参数,今天看完这篇文章 ,你就会了!
第一部分:苹果iOS系统上的切图参数设置规范
无论你是以750*1334px的设计稿切图,还是以1242*2208px的设计稿切图,都可以按照下面的参数设置切图即可。
iOS切图参数设置:选择输出支持IOS平台的单倍图、双倍图,支持IPHONE6/6P尺寸比例。如下图所示的参数设置规范如下:
各位小白请记住:切图最终的目的是输出2套不同的切图文件。
一套是@2x的(对应iphone6 iphone7 以及iphone 5 5s)和一套@3x的(对应iphone 6 plus和iphone 7 plus )。
另外几个点跟大家说明一下:
设置当前基准:意思是选择你当前的设计稿是750px的还是1242px的。
上图当中设置当前基准是 @3x
那么APP设计稿有可能是以1242px*2208px的设计稿。或者是1920*1080的设计稿(安卓转iOS)
在APP切图工具Cutterman的迭代过程当中:又一个出柜模式。不知道大家有印象没?
新版已经没有出柜模式啦。
下面让我们了解下 Cutterman 出柜模式的用途。如下图:
Cutterman的“出柜模式”使用的场景是当前设计稿尺寸是1242px的时候。
假设当前设计稿尺寸是1242*2208px
那么问题来了!
1242与640的比例是1.94,大于1.5
如果我把当前的尺寸认为是@3X,那除以1.5之后的@2X尺寸就会偏大
所以cutterman的@2X图的尺寸是当前尺寸除以1.94,以保证在640的屏幕下是合理的。像这样:
cutterman最初就是这样实现的……
直到有一天,一个小伙伴找上门来(就称呼A同学吧),告诉我这样不对
他的理由是这样的:
@3x的尺寸不应该是@2X的屏幕等比例放大,而应该是严格的1.5倍关系,这样的话,对于6plus而言,图就会偏小,但这是合理的,这样能够给内容流出更多的展示空间,符合6p的设计原则,而不是简单的把5的界面等比例放大到6的界面。
然后我被说服了……觉得这样是有道理的。 于是,cutterman的实现变成这样:
改成这种方案之后,cut不断地被问:怎么我切不出@3x的图了,@3x的图不对等等
因为你再也无法切出120px的图了……每到这个时候,我就需要给大家解释以上那么多内容,而且经常都是没有人能够理解。
然后我发现,大部分同学的理解,还是以@3X为当前设计稿尺寸,来进行缩小展示的,所以……cutterman现在的策略是这样:
这样的策略基本就满足广大切图小伙伴的需要了~
不过,为了满足之前A同学的那种需求,cut君加入了一个开关,即是大家看到的“出柜模式”。
默认,该开关是关闭的,如果你认同A同学的理论,并且觉得它是正确的,你就打开出柜模式,进入出柜状态~~
这是一点点小插曲。 这回你应该明白 出柜模式的用途吧!其实两种都是可取的。如果你认同A同学的看法,就选择出柜模式。如果你认为是正常的缩写1。5倍,就不需要理会出柜模式。
第二部分:Android平台的切图参数设计规范
输出支持Android平台的各种分辨率大小图片,什么XXHPDI,XHDPI,HDPI啊之类的,通通自动化输出,为你节省出更多的时间陪小伙伴好好玩耍。
安卓设计稿的详细的切图参数设置如下:
目前最常见的安卓设计稿为720*1280的或者是1920*1080px的。
最后,25学堂的小编在跟小白们叮嘱一下:
设计 Android 应用的最佳实践:
1. 画布大小定位 720 x 1280,72 dpi
2. 只使用偶数单位的尺寸,比如 96 px 的列表项高度,16 px 的边距,64 px 的图标边长
3. 只使用 24 pt,28 pt,36 pt 和 44 pt 的字体
4. 设计完成以后,所有尺寸的 px 值除以 2 作为 dp 数值交给工程师
5. 所有字体的 pt 值除以 2 作为 sp 数值交给工程师
6. 所有切图变成三份,分别是原始大小、缩小 1.5 倍,放大1.5 倍,分别作为 xhdpi,hdpi,xxhdpi的资源交给安卓工程师。
以上就是25学堂针对小白使用APP切图工具Cutterman当中的一些疑问做一些回答和解读。希望对各位小白有所帮助。
app android切图工具,小白自学APP切图:APP切图工具Cutterman的参数设置相关推荐
- 手机看图app android开源小众,4款小众实用的手机APP,全是安卓手机的黑科技软件!...
原标题:4款小众实用的手机APP,全是安卓手机的黑科技软件! 相信对于每天都捧着手机来玩的小伙伴们而言,对于手机插件应该不至于陌生吧!大家或多或少的都有在桌面上添加过一些天气.壁纸或者一些应用类的软件 ...
- java可以写a手机app吗_JAVA程序员自学编程 a l’App Store
*****Java程序员的给力助手***** -----本应用是一款java程序员自学参考手册,内容涵盖了所有java自学入门教程.高级教程以及数十道java经典面试题及代码答案,十分适合java开发 ...
- 手把手教会OpenGL之纹理贴图、包含纹理载入、纹理过滤、边界处理、纹理参数设置(入门级别案例,棋盘)
一.OpenGL中纹理的加载(对glTexImage2D函数的使用) 二.纹理过滤(glTexParameteri参数中的GL_TEXTURE_MAG_FILTER与 GL_TEXTURE_MIN_F ...
- 上门洗车APP --- Android客户端开发 之 网络框架封装介绍(一)
上门洗车APP --- Android客户端开发 之 网络框架封装介绍(一) 上篇文章中给大家简单介绍了一些业务,上门洗车APP --- Android客户端开发 前言及业务简介,本篇文章给大家介绍下 ...
- Flashlight App Android示例
In this tutorial I will teach you to make a very basic and simple flashlight app for android. This a ...
- app android切图工具,2018最强手机APP切图规范指南和切片要求
关于手机APP切图的干货,25学堂已经分享了很多,但是不是很全面,同时也没有把一些APP切图需要注意点分享给大家,于是,学堂君想在今天把前辈切片的经验分享出来. 之前25学堂分享的APP切图干货: 如 ...
- 百度App Android启动性能优化-工具篇
一.前言 启动性能是APP的极为重要的一环,启动阶段出现卡顿.黑屏问题,会影响用户体验,导致用户流失.百度APP在一些比较低端的机器上也有类似启动性能问题,为保留存,需要对启动流程做深入优化.现有的性 ...
- android自动切换暗色,超实用!Android 深色模式适配(可定时开启的APP内主题切换管理工具)...
前言 前面分享了一篇"黑白化主题"的文,主要适用场景是不久就要到来的"清明"等时节或者是其他的国家公祭日什么的(一名成熟的程序员,要学会自己提产品需求). 今天 ...
- 手机看图app android小众,保证你用到停不下来的8款APP
1.恋爱话术(追女孩聊天神器) 推荐指数:★★★★☆ 支持平台:Android 交朋友谈恋爱,什么最重要?聊天技巧最重要,聊天话术最重要! 恋爱约会.追女孩.恋爱宝典.扩列话术.聊天神器.扩列扩圈-各 ...
- Android 应用性能优化(5)---用两张图告诉你,为什么你的App会卡顿?
用两张图告诉你,为什么你的App会卡顿? Cover 有什么料? 从这篇文章中你能获得这些料: 知道setContentView()之后发生了什么? 知道Android究竟是如何在屏幕上显示我们期望的 ...
最新文章
- 阅读《第31次中国互联网络发展状况统计报告》,分析中国互联网发展趋势和特点...
- ubuntu16.04下面的redis desktop manger的使用
- Android官方开发文档Training系列课程中文版:构建第一款安卓应用之环境配置
- 程序员在群询问破解软件
- 监督学习 | 线性分类 之Logistic回归原理及Sklearn实现
- 【C语言】判断某一正整数是否为完数
- Java ---学习笔记(泛型)
- 【转载+思考】追问泄题之源:命题权寻租打开方便之门
- python生成一组随机数_python怎么产生不重复的随机数
- VirtualPC2007添加Shared Folder的方法for dos
- silverlight中datagrid数据到处excel
- go语言项目如何引用依赖Github上的开源项目
- 非参数统计的Python实现—— Friedman 秩方差分析
- ubuntu22打开utools报错 缺少libcrypto.so.1.1问题解决
- How to compile a node file?如何编译一个节点文件?
- 浪潮服务器管理口IPMI安装系统(浪潮服务器NF5280m5 配置,raid和系统 安装纪录)
- 利用Python破解隔壁老王家的WiFi密码,学习到了!
- 3.2 发送请求参数
- Siggraph三角网格变形之拉普拉斯变换
- Java实现简易联网坦克对战小游戏(内涵源码)//Java+Java游戏+拓展学习+资源分享
热门文章
- 详细Gitee(码云)使用方法
- 软件工程——NS图,PAD图
- AcWing 177. 噩梦(双向BFS)
- 1000瓶药水,一瓶有毒,用10只老鼠来判断到底是哪一瓶
- datax(25):插件加载原理
- 电感滤波电路的工作原理
- BUCK电感工作模式
- 让Excel工作簿中宏自动运行的两种方法
- exce中让两列数据一一对应_excel表格中两组数据如何对应匹配-EXCEL让两个表格中的两列数据一一对应...
- 博士申请 | 香港科技大学(广州)王林助理教授招收计算机视觉博士生