APP的切图原理

因为：Ui设计师用单位px和pt作图，

Android开发人员用dp和sp开发，

于是，经常发生很多沟通上的麻烦。

☞为了让日常切图尺寸的沟通更加和谐，我整理了安卓切图的相关信息。

举例：banner的切图尺寸：iOS和Android的换算举例：已知：在640x1136px，iPhone@2x的banner尺寸是W640xH160px，

问题：在720x1280px，Android@xhdpi时，banner切图尺寸是多少？

解：

因为app首页banner是占满横屏的，所以banner宽度为720px, 高度的计算公式如下，

640px             160px

一一一一  ＝  一一一一

720px               B

解得：B＝180px，

所以：在720x1280px，Android@xhdpi时，banner切图尺寸等于W720xH180px。

安卓的相关尺寸信息统计：【符号表示对应关系】

@Ldpi(安卓手机)240x320px 120ppi

@mdpi(安卓手机)320x480px 160ppi

@hdpi(安卓手机)480x800px 240ppi

@xhdpi(安卓手机)720x1280px 320ppi

@xxhdpi(安卓手机)1080x1920px 480ppi

常见app的banner切图，需要切6张不同尺寸的图：

640x160@2x(苹果手机)

960x240@3x(苹果手机)

320x80@mdpi(安卓手机)

480x120@hdpi(安卓手机)

720x180@xhdpi(安卓手机)

1080x270@xxhdpi(安卓手机)

其中安卓屏幕分辨率的倍数关系如下，

320x1=320，对应屏幕@mdpi(安卓手机)320x480px 160ppi

320x1.5=480，对应屏幕@hdpi(安卓手机)480x800px 240ppi

320x2.25=720，对应屏幕@xhdpi(安卓手机)720x1280px 320ppi

320x3.375＝1080，对应屏幕@xxhdpi(安卓手机)1080x1920px 480ppi

安卓屏幕密度的倍数关系如下，

160x1=160，对应屏幕@mdpi(安卓手机)320x480px 160ppi

160x1.5=240，对应屏幕@hdpi(安卓手机)480x800px 240ppi

160x2=320，对应屏幕@xhdpi(安卓手机)720x1280px 320ppi

160x3＝480，对应屏幕@xxhdpi(安卓手机)1080x1920px 480ppi

因此，安卓的2倍图，实际上是2.25倍。安卓的3倍图，实际上是3.375倍。

dp是虚拟像素，在不同的像素密度的设备上会自动适配，

比如:

在320x480分辨率，像素密度为160,1dp=1px

在480x800分辨率，像素密度为240,1dp=1.5px

计算公式:1dp*像素密度/160 = 实际像素数

dp和px的换算公式 ：

dp*ppi/160 = px。比如1dp x160ppi/160 = 1px。

1dp        160ppi

一一一＝一一一

1 px          160

sp是安卓的字体单位，

英文名称：Scale-independent pixels，以160PPI屏幕为标准，当字体大小为 100%时， 1sp=1px。

sp 与 px 的换算公式：1sp*ppi/160 = 1px

1sp            160ppi

一一一 ＝ 一一一一

1pt               160

Sketch切图倍数如下：

切图切6套，文件夹显示如下：

切图文件夹本文作者：张云钱。微信号；944352559