Question

我正在尝试使用PhoneGap for iOS设备开发聊天应用程序。该应用程序有一个标题，显示已登录的用户，一个页脚，用户可以在其中写入他的短信，以及一个放在正文中的列表视图，将显示消息。

我更新到最新版本的JQueryMobile（1.3.0），但问题仍然出现在应用程序中。我附上了一个快照，显示了布局是如何被破坏的。（http://i.stack.imgur.com/RsLfT.png）

我尝试了几种解决方案，例如使页面不可滚动（将UIWebViewBounce设置为false）和不可伸缩（user-scalable = no）以及其他用户界面更改，但问题仍未解决。

有没有人知道如何解决这个问题？（如软键盘外观后刷新）

Answer 1

为了暂时解决此问题（因为它在键盘显示时显示中断），您可以在配置文件（config.xml）中将“KeyboardShrinksView”设置为“true”或添加它：

<widget>
  ...
  <preference name="KeyboardShrinksView" value="true" />

  <plugins>...

Answer 2

现在您可以添加：

document.body.scrollTop = 0;

每当输入字段收到模糊事件时。

Answer 3

使用twitter bootstrap 3我遇到了同样的问题。

添加：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

解决了我的问题。

Answer 4

我已联系过PhoneGap支持，他们告知我们将在PhoneGap 2.6版本中针对此问题做出正确的解决方案

Answer 5

我使用css和包装器修复它

/*Phone < 5:*/
 @media screen and (device-aspect-ratio: 2/3) {
  .content {
   height: 416px !important;
 }
}

 /*iPhone 5:*/
@media screen and (device-aspect-ratio: 40/71) {
  .content {
    height: 504px !important;
  }
}

Answer 6

键盘弹出时屏幕高度会发生变化

当键盘弹出时，cordova / phonegap应用程序屏幕高度或window.innerHeight值会减少，这会重新调整内部和内部的内容。使您的屏幕看起来已损坏。

使用Javascript，在deviceready或应用程序initialize上将设备屏幕高度设置为包装器/容器元素。

 $('#container').height(window.innerHeight);  // jQuery

在iOS设备中键盘外观后，PhoneGap页面向上滚动，导致PhoneGap页面损坏

6 个答案: