安卓设备像素详解

假设设备分辨率是1280*720 安卓pad 屏幕密度dpi 240

设备像素与逻辑像素的关系：

设备的实际分辨率（物理像素）是由屏幕的宽高和屏幕密度（DPI）共同决定的。
逻辑像素（CSS像素）是浏览器或系统为了适配不同分辨率设备而抽象出来的单位。
逻辑像素的计算公式：

txt 复制代码

逻辑像素 = 物理像素 / 屏幕密度比（devicePixelRatio）

你的设备情况：

分辨率：1280 × 720（物理像素）。
屏幕密度：240 DPI。
devicePixelRatio（屏幕密度比）：240 / 160 = 1.5。（160是基准屏幕密度，下边有详细介绍）
计算逻辑像素宽度：

txt 复制代码

逻辑像素宽度 = 1280 / 1.5 ≈ 853px
通过api拿到的width就是这个逻辑像素宽度

160 是 屏幕密度的基准值 ，它是 Android 系统中定义的一个标准，用于计算设备的 devicePixelRatio 和适配不同屏幕密度的设备。

屏幕密度（DPI）

DPI（Dots Per Inch）表示每英寸的像素点数，用于衡量屏幕的像素密度。

Android 将屏幕密度分为多个级别，例如：

ldpi（低密度）：120 DPI
mdpi（中密度）：160 DPI
hdpi（高密度）：240 DPI
xhdpi（超高密度）：320 DPI
xxhdpi（超超高密度）：480 DPI
xxxhdpi（超超超高密度）：640 DPI

基准值 160 DPI：

Android 系统将 160 DPI 定义为基准密度（mdpi）。
在基准密度下，1 逻辑像素（CSS 像素）等于 1 物理像素。

设备像素比（devicePixelRatio） ：

devicePixelRatio 是设备的物理像素与逻辑像素的比值。

计算公式：

txt 复制代码

devicePixelRatio = 屏幕密度 / 基准密度

获取逻辑像素的方法，以uniapp为例

javascript 复制代码

const systemInfo = uni.getSystemInfoSync();
console.log('逻辑像素宽度:', systemInfo.windowWidth); // 853
console.log('设备像素比:', systemInfo.pixelRatio); // 1.5 = 240 / 160

为什么以uniapp为例 因为项目中进行使用，发现uniapp的配置没有较好的办法对分辨率进行控制，rpx主要是基于750进行计算的，修改rpxCalcBaseDeviceWidth和rpxCalcMaxDeviceWidth会导致换算标准发生改变：

txt 复制代码

假设你的元素宽度为150px
rpx = (设计稿中的 px / 设计稿宽度) * 750
默认rpxCalcBaseDeviceWidth为375
1px = (1 / 375) * 750 = 2rpx
基准宽度为750
rpx = (150 / 750) * 750 = 150rpx
基准宽度为1280
rpx = (100 / 1280) * 750 ≈ 58.59rpx

但是，重点来了，rpxCalcBaseDeviceWidth和rpxCalcMaxDeviceWidth只会影响px转换rpx的比例，但是获取到的逻辑像素不会受到影响，一直为1280 / 1.5 ≈ 853px，所以1280*720 dpi240的设备，宽度就是853px，即1706rpx

所以就不挣扎了，还是默默的用375的默认值吧。
官方文档描述如下

rpx 即响应式 px，一种根据屏幕宽度自适应的动态单位。以 750 宽的屏幕为基准，750rpx 恰好为屏幕宽度。屏幕变宽，rpx 实际显示效果会等比放大，但在 App（vue2 不含 nvue）端和 H5（vue2）端屏幕宽度达到 960px 时，默认将按照 375px 这里就是1px=2rpx的屏幕宽度进行计算