APP设计尺寸解读:px、pt、ppi、dpi、dp、sp之间的关系

看到这样的标题,谁可以一一的把这些单位的含义和使用场景描述一下吗?25学堂也不能,经常忘记这些,所以顾分享这篇非常实用的APP设计尺寸单位换算的文章。

希望大家在平常来多看看。也增加一些自己的理解。让我们设计APP更加精致和漂亮。

feely  chat APP3

 

1、APP设计尺寸单位各自的定义:

px:pixel———————————— 【 像素】  电子屏幕上组成一幅图画或照片的最基本单元

pt: point—————————————【 点】印刷行业常用单位,等于1/72英寸

ppi: pixel per inch————————【每英寸像素数】  该值越高,则屏幕越细腻

dpi: dot per inch—————————【每英寸多少点】,该值越高,则图片越细腻

dp: dip,Density-independent pixel, 【安卓开发用的长度单位】

          1dp表示在屏幕像素点密度为160ppi时1px长度

sp: scale-independent pixel————————————【安卓开发用的字体大小单位】。

 

Android DPI的参数

sp与px的换算公式 Android 系统默认字体 Rotobo

 

以上这些就是我们之前跟大家分享的APP相关尺寸单位的图表。到今天为止,有没有人全部看的明白呢?

如果没有,继续往下看,跟随25学堂的小编来学习。

首先是3个单位换算的公式和算法:各位app设计师必须珍藏的公式。

app设计尺寸单位换算

 

 

四、px和dp

dp为安卓开发时的长度单位,根据不同的屏幕分辨率,与px有不同的对应关系。

安卓端屏幕大小各不相同,根据其像素密度,分为以下几种规格:

1dp定义为屏幕密度值为160ppi时的1px,即,在mdpi时,1dp = 1px。

以mdpi为标准,这些屏幕的密度值比为:ldpi : mdpi : hdpi : xhdpi : xxhdpi = 0.75 : 1 : 1.5 : 2 : 3;

在xhdpi的密度下,1dp=2px;在hdpi情况下,1dp=1.5px。其他类推。

公式四: 1dp=(屏幕ppi/ 160)px

 

以WVGA屏为例,该屏幕为480px*800px,按3.8寸屏算,点密度 √ (480^2 + 800^2) / 3.8 = 245,约等于240,对应于hdpi屏幕,所以该屏幕1dp=1.5px

001-iphone-mockup-flat-black-white-landscape-perspective-psd

五、dp和sp

dp和sp都是安卓的开发单位,dp是长度单位,sp是字体单位。sp与dp类似,但是可以根据用户的字体大小首选项进行缩放。Android系统允许用户自定义文字尺寸大小(小、正常、大、超大等等),

公式五:当文字尺寸是“正常”时1sp=1dp,而当文字尺寸是“大”或“超大”时,1sp>1dp。

 

一般情况下可认为sp=dp。详细阅读《Android APPUI设计师必知:pt sp dp之间的关系

 

总结:由于做设计时以xhdpi为模板,xhdpi条件下,1dp=2px。若新建画布时,将画布分辨率设为144ppi,则1pt=2px=1dp。此时,即可将pt等同于dp。

标注长度的时候,将长度像素除以2即为dp值。

psplay移动预览工具

超级好用的在线实时预览APp设计图的工具:psplay

PS:在photoshop cc中切图时,可直接在.png 图片图层名称前加上200%获得2倍大小的图,其他比例的切图以此类推。输出的两倍图不模糊的前提是,该图是photoshop中用形状工具画出来的未被栅格化的图形,而不是已被栅格化的图层或外部导入的图片。

希望以上Snow作者的总结,有利于大家的app设计学习和进步。

25学堂也感谢Snow作者的辛勤总结:以上内容来源:http://oriental13.lofter.com/

 

每天更新,
全站高品质素材免费下载!