Cordova应用的固定尺寸 [英] Fixed dimension for cordova app

问题描述

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

更清楚的是，如下图所示， / p>

第一张图片的条件是设备具有比应用更宽的宽度。第二个宽度小于应用的宽度。

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

 < meta id =viewportname =viewport content =width =< fixed width>，height =< fixed height>，initial-scale = 1.0> 
 

但这不工作，因为cordova渲染其webview和设置宽度和高度之前的索引.html加载。是否有任何方法来实现这一点？

注意：我只需要在Android设备上实现这一点。 webview维度

解决方案

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

  .container {background：red; height：400px; width：600px; position：absolute;左：50％; transform：translateX（-50％）; text-align：center;}  

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

I am trying to create a cordova application with a fixed width and height.If the device width is higher than the application width then it will display inside of the device view port. and if the device width is less than the application width,then only need to show the center part of the app.

It is more clear as in the bellow image,

The first image have the condition that the device have more width than the app.and second one have less width than the app.

I have tried by adding <meta> in my index.html file as follows,

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

But this does not work,because of the cordova render its webview and set width and height before the index.html is loaded. Is there any method to achieve this?

Note: I only need to implement this on android devices.And I need to change webview dimension

解决方案

You can try to use a container like this:

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

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

这篇关于Cordova应用的固定尺寸的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！