UI | 详解px/pt/dp/sp等单位
发布网友
发布时间:2022-10-14 19:06
我来回答
共1个回答
热心网友
时间:2024-08-26 13:03
前言:作为一名UI设计师,在工作中不可避免会遇到px/pt/dp等基础单位,这些并不是一成不变的,场景的不同决定了其所承载的职能也不同,本文将根据查阅到的资料加上作者的理解对这些单位做出较为浅显易懂的解释,百密之中难免一疏,如有解释的不恰当的地方,望指正。
px : 像素,由三个发光管RGB组成的最小基本单元。
常见场景:视觉稿单位/分辨率单位/css常用单位(网页、web应用等)。
pt :点,绝对长度单位。密度无关像素,是IOS开发的基本单位。
常见场景:印刷行业常用单位/IOS开发基本单位/PS中的字体单位。
总结 :虽然印刷行业单位与IOS开发基本单位都叫pt,但是两者无论是概念还是数值都不尽相同,此pt非彼pt。
思考 :为什么要单独设定pt与dp为开发单位,而不是用px呢?
PPI:(pixels per inch)每英寸含有的像素值,又称像素密度。
使用场景:屏幕。
DPI:(dots perinch)每英寸含有的点数。又称点密度。
使用场景:印刷设备/屏幕。
我们知道,一张图片的真正大小是由分辨率所决定的。图片的分辨率决定了所承载的细节内容。那么DPI有什么用呢?
屏幕场景:这里要提到一个“设备的最大解析能力”。有72DPI的设备,也有300DPI的设备。这里的72和300决定了设备的最大解析能力。在72DPI屏幕上我们只能看到最高72DPI的图片。如果将一张300DPI的图片用72DPI的设备进行显示,会怎么样呢?设备会进行“栅格处理”。
栅格处理就是在图片尺寸不变的情况下,对图片DPI进行处理,图片的信息量会受到影响。一张300DPI的图片明显超过了72DPI屏幕的最大解析能力,所以屏幕会将其栅格成72DPI的图片。UI设计师在导出视觉稿1倍图时,在电脑屏幕(96DPI)上看好像没有问题,但是放在手机(300PPI)上预览就会显得模糊了。这是因为手机屏幕将其栅格成300DPI的图片,其缺少很多细节,所以就显得模糊了。
打印机场景:DPI还有一个重要作用就是作为电子屏幕与打印机沟通的桥梁。同等分辨率的图片,一张72DPI,一张300DPI,在显示上可能不会有太大的差别,但是打印出来差别很大。例如72DPI的图片用300DPI的设备打印出来就是模糊的。
物理分辨率/逻辑分辨率 :在日常生活中我们所提到的手机分辨率指的就是物理分辨率。如上图中的640*960、1242*2208等,由于尺寸规格不一,为了方便设计师做视觉稿,诞生了逻辑分辨率。物理分辨率除以缩放因子进行缩放得到逻辑分辨率,逻辑分辨率之间差别不大,例如用320*480的尺寸做的视觉稿同样可以适配320*568。
(结合第一部分:以px为单位的是物理分辨率,以pt为单位的是逻辑分辨率)
结尾:以上就是作者对于用户界面设计中经常会遇到的一些单位做出的归纳总结。个人总结难免有疏忽以及理解不到位的地方,不足之处望指正。谢谢!
End
UI | 详解px/pt/dp/sp等单位
pt :点,绝对长度单位。密度无关像素,是IOS开发的基本单位。常见场景:印刷行业常用单位/IOS开发基本单位/PS中的字体单位。总结 :虽然印刷行业单位与IOS开发基本单位都叫pt,但是两者无论是概念还是数值都不尽相同,此pt非彼pt。思考 :为什么要单独设定pt与dp为开发单位,而不是用px呢?PPI:(pixels...
ip动态 - StormProxies
StormProxies是一家提供动态代理服务器服务的企业,旨在帮助用户更好地管理网络访问和安全。以下是一些关于StormProxies的IP动态代理服务的特点:1. 高匿名性:StormProxies的动态代理服务器具有高匿名性,可以有效地隐藏用户的真实IP地址,保护用户的隐私和安全。2. 快速响应:StormProxies的动态代理服务器具有快速响应的特点,可以快速响应用户的请求,提高用户的网络访问速度和效率。3. 高度可定制:StormProxies的动态代理服务器可以根据用户的需求进行定制,例如可以根据用户的地理位置、网络带宽、访问频率等因素进行定制。4. 多种协议支持:…StormProxies是全球大数据IP资源服务商,其住宅代理网络由真实的家庭住宅IP组成,可为企业或个人提供满足各种场景的代理产品。点击免费测试(注册即送1G流量)StormProxies有哪些优势?1、IP+端口提取形式,不限带宽,IP纯净高匿;2、覆盖全球20...
UI设计中的尺寸单位概念及换算
dp(Device Indepent Pixels):是独立于px的单位,简称"dip",与像素密度(dpi)有关。像素比:不同的Android设备分辨率下,像素比不同(关联dpi;dp;px)sp(Scale-independent Pixel):抽象像素,与dp类似。在Android开发中,一般作为文字单位大小。当系统字体大小为正常时,1sp=1dp 当系统字体大小为...
一篇文章帮你理清pt,px, ppi,dpi,dp,sp
点pt : point,印刷行业常用单位,等于1/72英寸 像素px :pixel,电子屏幕上影像成像的基本单位。 长度单位 dp: dip ,Density-independent pixel, 是安卓开发用的长度单位,1dp表示在屏幕像素点密度为160ppi时1px长...
iOS、Android 开发单位换算及 UI 切图要求
pt 即 point,有两个含义:一是印刷行业常用单位,是一个标准长度单位,绝对大小,1pt = 1/72 英寸 = 0.35mm;二是 iOS 开发用的基本单位,当设计师以 1 倍尺寸进行设计 (375pt × 667pt) 并给出标注稿时,开发人员无需除以 2 便可直接使用。dp 是安卓开发用的基准单位,在 dpi (屏幕像...
ui设计需要会dpi ppi px dp换算吗
dp: dip,Density-independent pixel, 是安卓开发用的长度单位,1dp表示在屏幕像素点密度为160ppi时1px长度 sp: scale-independent pixel,安卓开发用的字体大小单位。以下是换算关系:一、pt和px 公式一: 1pt= (DPI / 72) px 当photoshop中新建画布的分辨率为72ppi( 即 72dpi时 ), 1pt=1px; ...
Android中dip,dp,sp,pt和px的区别详解
pt——点,屏幕上普通字体大小单位。这是一个与像素密度无关联的单位,一pt单位的物理大小在任何像素密度的屏幕上都是一样大的。72pt等于一in。一pt单位转化为多少px单位取决于屏幕的像素密度。dp——像素密度无关联的像素单位。这是一个与像素密度无关联的单位。然而一dp单位的物理大小在不同的像素...
详解px,dp,pt,sp,ppi,dpi及屏幕适配
深入理解px、dp、pt、sp、ppi、dpi及屏幕适配的关键要素 在产品设计领域,尽管有些从业者工作了一两年,但对px、bp、dp等基本单位的掌握仍有待提升。本文将通过实例解析这些概念,以及屏幕适配的核心原则。首先,让我们明确几个关键名词:px:像素,设计的基本单位,尽管没有固定物理长度,但分辨率不同会...
Android像素单位dp,sp,px,pt的区别和比较
px(像素):屏幕上的点。in(英寸):长度单位。mm(毫米):长度单位。pt(磅):1/72英寸。dp(与密度无关的像素):一种基于屏幕密度的抽象单位。在每英寸160点的显示器上,1dp = 1px。dip:与dp相同,多用于android/ophone示例中。sp(与刻度无关的像素):与dp类似,但是可以根据用户的字体...
Android中dip,dp,sp,pt和px的区别详解
dp: dip是一样的 px: pixels(像素). 不同设备显示效果相同,一般我们HVGA代表320x480像素,这个用的比较多。pt: point,是一个标准的长度单位,1pt=1/72英寸,用于印刷业,非常简单易用;sp: scaled pixels(放大像素). 主要用于字体显示best for textsize。in(英寸):长度单位。mm(毫米):...
Android的px,dp和sp等单位的区别详解
1pt=1/72英寸=0.035厘米;最佳实践,文字的尺寸一律用sp单位,非文字的尺寸一律使用dp单位。例如textSize="16sp"、layout_width="60dp";偶尔需要使用px单位,例如需要在屏幕上画一条细的分隔线时:<View layout_width="match_parent" layout_height="1px"/> 补充:1. android.view.ViewGroup....