当呼叫/热点指示器可见时停止 phonegap 应用程序滚动答案

【问题标题】：Stop phonegap app from scrolling when call/hotspot indicator is visible当呼叫/热点指示器可见时停止 phonegap 应用程序滚动
【发布时间】：2014-03-27 19:57:37
【问题描述】：

我正在开发一个带有 phonegap 的 iOS 应用程序。 UI 由许多水平布局的“包装器”组成，每个包装器都位于视口高度的 100%。

<html>
  <body>
    <div id="wrapper-one"></div>
    <div id="wrapper-two"></div>
    <div id="wrapper-three"</div>
  </body>
</body>

html、body 和 #wrapper-* 元素都在 CSS 中声明了 height: 100%，这可以完美运行，并阻止应用滚动。

问题是，当“通话中”或“个人热点”指示器可见时，它们会将视口的高度降低约 20 像素。然后，这会将页面底部稍微推离屏幕，您可以上下滚动。正文中的包装 div 是可滚动的，因此我不希望窗口也可滚动。

当这些指示器可见时，有什么方法可以阻止滚动发生，就像只有正常状态栏可见时那样？

【问题讨论】：

标签： javascript ios css cordova

【解决方案1】：

您应该能够检测到窗口调整大小并进行处理。

window.onresize = function() {
    //820 just an example height
    if (window.innerHeight >= 820) {
        // Do something
    }
}

【讨论】：

我已经尝试过了，但就 JS 而言，窗口高度并没有改变，它只是将它向下移动了 20px 以便它稍微离开屏幕。

【解决方案2】：

把这段代码放在你的 MainViewController.m 中，就在 MainViewController @implementation 之后和@end 之前。

- (void)viewDidLayoutSubviews{

    if ([self respondsToSelector:@selector(topLayoutGuide)]) // iOS 7 or above
    {
        CGFloat top = self.topLayoutGuide.length;
        if(self.webView.frame.origin.y == 0){
            // We only want to do this once, or if the view has somehow been "restored" by other code.
            self.webView.frame = CGRectMake(self.webView.frame.origin.x, self.webView.frame.origin.y + top, self.webView.frame.size.width, self.webView.frame.size.height - top);
        }
    }
}

【讨论】：