Ionic 应用程序中的屏幕尺寸错误

Question

我有一个奇怪的问题。我正在开发 Ionic 应用程序，我需要将屏幕的宽度和高度发送到插件。我把它们放在 javascript 边。

我在 Nexus 6 上测试，值不正确。它returns660x412，当本设备的屏幕为2k时，2048x1080。

我试过了：

screen.height
window.innerHeight
window.outerHeight

而且都是错的。

我的元视口是：

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

有人遇到过这个问题吗？

Answer 1

问题是，这些宽度和高度可能不代表物理屏幕，而是称为CSS像素的概念。

我们可以使用此值来获取物理屏幕尺寸，如下所示。

var physicalScreenWidth = window.screen.width * window.devicePixelRatio;
var physicalScreenHeight = window.screen.height * window.devicePixelRatio;

请注意，该值会根据当前屏幕方向而变化。

Wrong screen size in Ionic app