实际屏幕分辨率与Flutter、Chrome逻辑分辨率的关联及换算咨询

核心概念区分 #

• 物理像素：屏幕硬件实际的发光点总数，是屏幕出厂时固定的硬件参数，比如你提到的iPhone X的1125x2436、Redmi Note 9 Pro的1080x2400都属于这类。
• 逻辑像素：系统或开发框架提供的抽象单位，目的是让UI在不同像素密度的屏幕上保持一致的视觉大小，你通过Flutter获取的393x857、Chrome DevTools显示的375x812就是逻辑像素。

关键换算系数：设备像素比（DPR） #

物理像素和逻辑像素的换算关系由**设备像素比（Device Pixel Ratio）**决定，公式为：

物理像素 = 逻辑像素 × DPR
逻辑像素 = 物理像素 ÷ DPR

iPhone X的推导过程 #

iPhone X的设备像素比（DPR）为3，代入公式计算：

• 宽度逻辑像素：1125 ÷ 3 = 375
• 高度逻辑像素：2436 ÷ 3 = 812
  这就完美对应了Chrome开发者工具显示的375x812尺寸。

Redmi Note 9 Pro的情况说明 #

Redmi Note 9 Pro的DPR约为2.75（1080 ÷ 393 ≈ 2.75，2400 ÷ 857 ≈ 2.79，细微差异是因为系统对逻辑像素做了取整优化），同样是通过物理像素除以DPR得到Flutter识别的逻辑像素值。

为什么要区分这两种像素？ #

不同设备的屏幕像素密度（PPI）差异极大，如果直接用物理像素开发UI，同样尺寸的按钮在高PPI屏幕上会显得极小，逻辑像素的存在就是为了跨设备的UI适配，让相同逻辑像素值的元素在不同屏幕上的视觉大小基本一致。

内容的提问来源于stack exchange，提问作者Manish Paul