android app ui如何切图,APP切图详细规范终极指南

我们都知道一套完整的 App 通常会有很多张切图，不管是 iPhone 需要 1x、2x、3x 图档，Android 需要至少 3 种 hdpi、xhdpi、xxhdpi。在庞大的切图数量下如何让负责套图的 RD 快速找到所需图档，档名的命令方式就需要双方统一格式方便大家作业。所以，制定一套非常有效而方便的APP切图命名规范非常有用的。

下面就跟随小编来详细了解APP切图命名的流程和命名规范。

ios切图尺寸规则

目 前iPhone有10种型号，5种屏幕尺寸，再加上6plus的“降采样” (Downsampling)(1080-1920)，还有iPhone6和6+上的放大模式(1125-2001)和默认模式(1242-2208)， 是不是感觉好恐怖？但是不用怕，我分享一套超简单的适配方法，看完你都不信有这么简单~

美术交付给开发的资料有1、  标注图(以640为宽度尺寸为基准标注)2、  2x切图(以640为宽度尺寸为基准切图)3、  3x切图(以1280为宽度尺寸为基准切图)

开发看到这份标注图，可以自己用上面的数字，乘以1.5得出3X的数字。

1.为什么3x切图要以1280来为宽度？其实iPhone6+的尺寸1242*2208作为3X，怎么算都又难记又不能整除，我们直接640*2得到1280跟1242相差也没几十个像素，最重要的是不虚边啊，放在真机上看(处女座除外)看不出差别的。2.为什么只设宽度？为了保持长宽比例。iPhone的这几个尺寸不是正好的，宽度放大后高度总差那么几个像素，这不要紧，千万别去改高度，手机屏幕是可以上下滑动的嘛。不可以滑动必须保证一屏显示的除外，手动去调整好了。3.为什么开发不是乘以2而是乘以1.5来算尺寸和字号？因为大屏手机就是要显示更多内容而存在的。纯等比放大界面看起来傻大傻大的，实验证明1.5倍是正好的。

移动端IOS知识普及：IOS标准分辨率：1242px * 2208px

切片要求：

1、设计稿是按标准分辨率1242X2208设计，图片资源尺寸则是3倍图尺寸，将整个设计图压缩成750X1334，图片资源尺寸则是2倍图尺寸，在二倍图的基础上压缩成50%，图片资源尺寸则是1倍图尺寸；

2、产品效果图独立切片，即是每张效果图独立建立一个文件夹(命名以效果图名称为准)，文件夹内容包含1倍图文件、2倍图文件、3倍图文件和标识文件

3、图片命名要求语义化，格式为png；

4、图片资源需要备有1倍图、2倍图、3倍图，3倍图命名规则为：添加后缀@3x；2倍图命名规则为：添加后缀@2x；例如：1倍图：abg.png，2倍图则为：[email protected]，3倍图则为：[email protected];

5、 字体:IOS默认字体—— 英文  HelveticalNeue   中文 黑体；字体大小采用点pt，设计稿以相对单位px，字体大小需要进行转化，转化公式为：px*72/96=pt(eg：12px*72/96=9pt)， 字体颜色只需给出rgb值(eg：color：rgb(255，255，255))；

6、页面纯色背景需标出rgb值，如果有透明度则需标出rgba值，其他特殊背景直接切图；

7、页面的图标、色块、按钮的高度都必须是4的倍数，最小像素不能低于44px，如不够可以添加补白࿱