科尔多瓦应用程序的固定尺寸答案

【问题标题】：Fixed dimension for cordova app科尔多瓦应用程序的固定尺寸
【发布时间】：2016-05-18 08:27:23
【问题描述】：

我正在尝试创建一个具有固定宽度和高度的 cordova 应用程序。如果设备宽度高于应用程序宽度，那么它将显示在设备视口内。如果设备宽度小于应用程序宽度，则只需要显示应用程序的中心部分。

如下图更清晰，

第一个图像的条件是设备的宽度大于应用程序。第二个图像的宽度小于应用程序。

我尝试在我的 index.html 文件中添加<meta>，如下所示，

<meta id="viewport"  name="viewport" content="width=<fixed width>,height=<fixed height>, initial-scale=1.0">

但这不起作用，因为cordova在加载index.html之前渲染了它的webview并设置了宽度和高度。有什么方法可以实现吗？

注意：我只需要在安卓设备上实现这个。我需要改变 webview 尺寸

【问题讨论】：

标签： android cordova phonegap-build

【解决方案1】：

假设您的 HTML 区域位于一个不错的 div 容器中 - 将其位置设置为“绝对”，然后使用 javascript 通过 xpos = (screenWidth - htmlWidth)/2 显式设置其 X 位置

【讨论】：

嗨，感谢您的快速回复。这不能通过 css 或 javascript 完成，因为 webview 大小是在加载 html 之前设置的

【解决方案2】：

您可以尝试使用这样的容器：

.container {
  background: red;
  height: 400px;
  width: 600px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

<div class="container">
  <h1>
    hello
  </h1>
</div>

【讨论】：

您好，感谢您的快速回复。这不能通过 css 来完成。只能通过更改一些安卓平台的平台代码来实现
您可以为特定平台添加css。例如使用合并：developer.com/ws/android/…
有什么方法可以改变webview的大小吗？