如何计算设备像素比

Question

我想知道 -webkit-device-pixel-ratio 是如何计算的。我已经读过这个。但我却无法清楚地理解它。 我还想知道是否有哪些设备使用哪种像素比的列表。安卓网站说

Android 浏览器和 WebView 支持 CSS 媒体功能，允许您为特定屏幕密度创建样式 -webkit-device-pixel-ratio CSS 媒体功能。您应用于此功能的值应该是“0.75”、“1”或“1.5”，以指示样式分别适用于低密度、中密度或高密度屏幕的设备。

但我发现我们需要使用 -webkit-device-pixel-ratio=2 来使 Web 应用程序在 768 x 1280 分辨率屏幕上兼容。

Answer 1

根据这篇文章

http://www.html5rocks.com/en/mobile/high-dpi/

神奇的数字似乎是 150。

将物理 ppi 除以理想 ppi 150，得出设备像素比。

例如445ppi 的设备的 dpr 为 3 ->> 445 / 150

这个简单的计算似乎对这个列表中的许多项目都适用，

http://en.wikipedia.org/wiki/List_of_displays_by_pixel_密度

Answer 2

您可以通过访问https://www.mydevice.io/找到许多屏幕参数

Answer 3

您可以使用JS找到像素比例：

console.log(window.devicePixelRatio)

Answer 4

设备像素比（DPR）是基于物理硬件的像素和设备无关像素之间的关系，是一种抽象。设备像素比的值无法可靠地计算，因为它基于设备制造商打算如何将一种类型的像素系统映射到另一种类型的像素系统。为了可靠地获取此信息，您需要向设备请求它。

Answer 5

问题在于，没有一个数据库列出了所有（甚至是最常见的）设备，因此查找给定设备的视口规格就像尝试在多个数据库中的任何一个中查找设备一样。

这些是我遇到和使用的数据库，列出了设备视口及其像素比：

• https://yesviz.com/devices.php（目前最全）
• http://dpi.lv/
• https://www.mydevice.io/#compare-devices
• https://viewportsizer.com/devices/
• http://screensiz.es

请随意添加到上面的列表中，因为我确信还有更全面的数据库。

还要记住

resolution / DPR = viewport

，因此为了测试站点的响应能力，您通常只需要 DPR 或视口之一，并且视口本身通常更好。

Answer 6

计算显示指标并获取

DisplayMetrics dm = context.getResources().getDisplayMetrics();
int densityDpi = dm.densityDpi

并使用

dm.xdpi

或

dm.ydpi

即

pixel density