像素、分辨率、点、PPI与DPI

Posted by LML on March 19, 2020

前言

本文主要简单介绍一下几个基本概念:像素、分辨率、PPI与DPI。理解这样概念,有助于我们画UI图时候理解原理。 #像素 像素即px,是画面中最小的点(单位色块) #分辨率 例如,屏幕分辨率是1024×768,也就是说设备屏幕的水平方向上有1024个像素点,垂直方向上有768个像素点。像素的大小是没有固定长度的,不同设备上一个单位像素色块的大小是不一样的。 例如,尺寸面积大小相同的两块屏幕,分辨率大小可以是不一样的,分辨率高的屏幕上面像素点(色块)就多,所以屏幕内可以展示的画面就更细致,单个色块面积更小。而分辨率低的屏幕上像素点(色块)更少,单个像素面积更大,可以显示的画面就没那么细致。

点其实是 iOS 中为了使得 APP能适配不同型号的 iPhone 而提出的概念。对于不同的设置,比如不同型号的 iPhone,每个像素点的大小是不一样的,屏幕的大小也是不一样的。为了有个统一的标准定义了点。

比如使用UIScreen获取的bounds和frame,都是点的尺寸,而非像素尺寸。例如,在视网膜屏的iPhone4上,我获取的applicationFrame大小是320x460,很明显它代表的是点的数量。

下图中的1X==一个点对应一个像素点;2X==一个点对应两个像素点;3X==一个点对应3个像素点;所以分辨率越高越清晰。 然后我们日常开发中UI给的UI图,标记了图是的宽度和长度,其实都是点的数量,我们设置view的frame等也是设置view的点数,这样UI给的图与我们的代码就对应上了。

UI出图的时候为了保证高分辨率的手机也能过清晰,需要出分辨率不同的2X、3X图。但是无论2X、3X图的宽度和高度(即点数)是相同的,所以我们写代码只写一次

但是为什么不同型号的手机看同宽度和高度(点数)的图大小不同呢? 因为一个点数的大小即一个点数对应多少英寸,不同型号机器是不一样的。比如下图的pt代表的是不同型号手机对应的点数。这也就有了PPI、DPI的概念

PPI

PPI是每英寸的像素数,可以简单理解为像素密度

DPI

DPI是每英寸的点数,可以简单理解为点的密度。