cordova 7 上忽略设置视口宽度

Question

几年前，我开发了一个 cordova/phonegap 应用程序。我需要将屏幕宽度固定为 1200（某些设备的宽度为 962px），因此我添加了一个元标记来设置视口内容宽度，例如

<meta name="viewport" content="width=1200, user-scalable-no">

最近，我不得不添加一些新功能并升级到最新的 cordova/phonegap 版本（7.0.1/6.5.0），并且似乎视口元标记被忽略。运行旧版本我可以在 chrome devtools 中看到 html 宽度为 1200px 但在新版本中 html 宽度仍然为 960px

知道如何解决这个问题吗？

Answer 1

我终于可以通过编辑 android 平台文件夹中的 MainActivity.java 文件来解决这个问题。该文件声明一个继承自 CordovaActivity 的类并重写 onCreate 方法。似乎现在需要设置一些设置才能使 Web 视图使用“视口”元。

我在 MainActivity.java 中的 onCreate 方法现在看起来像：

@Override
public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);

    // enable Cordova apps to be started in the background
    Bundle extras = getIntent().getExtras();
    if (extras != null && extras.getBoolean("cdvStartInBackground", false)) {
        moveTaskToBack(true);
    }

    // Set by <content src="index.html" /> in config.xml

    if(appView == null)
              init();

    WebView webView = (WebView)appView.getView();
    WebSettings settings = webView.getSettings();
    settings.setLoadWithOverviewMode(true);
   settings.setUseWideViewPort(true);

   loadUrl(launchUrl);
}

关键是调用将“LoadWithOverviewMode”和“UseWideViewPort”设置为true。

现在应用程序正在按预期工作