Android WebView：如果width = device-width和scale = 1.0，CSS像素总是等于DIP吗？

Question

我正试着想一想如何在Android 4.0及更高版本的应用中嵌入WebView中指定CSS尺寸。在我正在测试的三个设备上（Nexus 4/7/10），看来如果我使用以下viewport指令：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

...然后加载到该webview中的内容中的任何CSS维度与设备无关的像素完全相同。也就是说，在我的Nexus 10上，它的物理像素宽度为2560，如果在我的webview中我指定宽度为1280的东西，它将完全填满屏幕的宽度。

我喜欢在CSS中使用与设备无关的像素的想法，但我需要确保能够计算此类DIP中的精确可用空间。所以我希望如果WebView的宽度为1920个物理像素，那么CSS像素的宽度应为：

• 在mdpi显示屏上，1920px。
• 在hdpi显示屏上，1280px。
• 在xhdpi显示屏上，960px。
• 在xxhdpi显示屏上，640px。

这是真的吗？

Answer 1

如果您想转换物理＆lt; - ＆gt; DIP像素然后你需要使用window.devicePixelRatio（或DisplayMetrics）：密度名称（mdpi，hdpi等）只是括号/类别 - 同一类别中的两个设备可以具有不同的devicePixelRatio值。

对于你正在做的事情，看看Pixel-Perfect UI in the WebView可能是个好主意。