在cordova android app中解决问题

Question

我在一个Android应用程序中使用带有jquery mobile的cordova。 对于Viewport元标记，我使用下面的代码

＆＃13;

＆＃13;

<meta name="viewport" 	content="width=device-width,
initial-scale=1.0;maximum-scale=1.0;user-scalable=0; target-densitydpi=device-dpi">

＆＃13;

＆＃13;

＆＃13;

使用较旧的jquery移动版本它返回设备的实际高度和宽度，但是当我将jquery mobile升级到1.4.5并且cordova升级到5.0时，它会返回一些不同的分辨率window.innerHeight和window.innerWidth

基于此分辨率，我正在使用带有媒体查询的css文件

请帮我解决这个问题

此致 Bindal

Answer 1

我当前的解决方法：

• 在index.html中：<meta name="viewport" content="user-scalable=no, initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5, width=device-width, viewport-fit=cover">
• 在index.css的“正文”部分中，添加：transform-origin: 0px 0px; transform: scale(0.5);

window.innerHeight和window.innerWidth具有原始分辨率。

但是尚未测试一个像素是否为一个像素。另外，我没有足够的设备来测试它是否可以在不同的设备和不同版本的android上运行。

Answer 2

有了这个mets，它对我有用，试试吧

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

Answer 3

媒体查询是错误的方法，原因如下：

• 您的屏幕不会完全匹配，比例布局是不可能的某些元素
• 您将无法定位Android 4.0+。 Quad-HD和旧设备使用相同比例的不同设备像素比率因子。通过Android版本对因素进行不同的解释，因此有些显示会混乱
• 媒体查询旨在为不同的分辨率提供不同的视觉效果，而不是跨分辨率的相同视觉比例

我建议使用https://github.com/biodiv/cordova-anyscreen（并删除jquery mobile）。它还会为您提供正确的显示和可用的分辨率app.deviceWidth，app.deviceHeight和app.containerWidth等。