iOS 键盘显示后分屏宽度

Question

我刚刚开始调查我的 Cordova 应用程序对分屏多任务处理的支持。到目前为止，该应用程序在模拟器中的 iPad 上显示和调整大小都很好，但是当我单击编辑字段并显示软件键盘时，100% 宽度的值开始 return 整个屏幕，而不是 window 已给出。

初始显示 -- 到目前为止，还不错...

没有。该应用程序现在显示在其 window.

之外

第HTML页：

<html>
  ...
  <body>
    <div class="page">
    ...
    </div>
  </body>
</html>

CSS:

.page {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

编辑：视口元

<meta name="viewport" content="initial-scale=1, user-scalable=no, minimum-scale=1, maximum-scale=1, viewport-fit=cover">

在键盘显示之前，我计算出 page class div 的宽度为 551px。键盘显示后，我计算出的宽度为 1112 像素。知道为什么显示键盘会导致宽度 return 不正确的值——或者我可以做些什么来获得正确的应用程序宽度？我还应该提到我正在使用 cordova-plugin-keyboard 来实现某些键盘功能。

Answer 1

看起来这个问题是由键盘插件引起的。 shrinkView 逻辑通过直接调整影响页面宽度的 WebView 框架的大小来工作。在这种情况下，它正在计算键盘和整个屏幕的交集，而不仅仅是您的应用程序的 window。

我能够重现类似的行为并加入 a patch that appears to solve it. (Thanks Jin Lei) 我想在发布版本之前做一些更多的测试，但您可以直接从 GitHub 安装更新的插件或在本地手动应用补丁。

cordova plugin add https://github.com/cjpearson/cordova-plugin-keyboard

iOS 键盘显示后分屏宽度

iOS split screen width after keyboard displays

css

ios

cordova

split-screen