如何修复 iOS 上 Cordova 3.1 的键盘问题？

Question

我刚刚使用示例 iOS 应用测试了 Cordova 3.1，并遇到了几个键盘问题。

应用设置：

• Xcode 5
• 状态栏已隐藏
• 横向模式

config.xml

问题：

1. 所有版本：当专注于输入字段时，整个视图会向上推，包括导航栏。

2. iOS5/6：点击输入字段打开键盘，然后在键盘向上推动整个视图之前，屏幕顶部会短暂显示一个黑色间隙（是状态栏吗？）

3. iOS7：没有像#2问题那样的黑缝，但还有其他问题：

   • 在移除（隐藏）之前，我仍然可以看到附件栏。

   • 键盘是半透明的，然后我可以在当前视图被向上推的空间中看到较暗的背景。

如果我改变了，情况会更糟：

• View 仍然向上推，当输入字段失去焦点时，屏幕顶部会出现一个黑色间隙，即使在 iOS 7 上，如果 KeyboardShrinksView = false 也不会发生什么。

• 键盘在 iOS 7 上不再是半透明的。

下面是我的 config.xml

<preference name="DisallowOverscroll" value="true" />
    <preference name="HideKeyboardFormAccessoryBar" value="true" />
    <preference name="KeyboardDisplayRequiresUserAction" value="false" />
    <preference name="KeyboardShrinksView" value="true" />
    <preference name="SuppressesIncrementalRendering" value="false" />
    <preference name="TopActivityIndicator" value="gray" />
    <preference name="EnableLocation" value="false" />
    <preference name="EnableViewportScale" value="false" />
    <preference name="AutoHideSplashScreen" value="false" />
    <preference name="ShowSplashScreenSpinner" value="false" />
    <preference name="MediaPlaybackRequiresUserAction" value="false" />
    <preference name="AllowInlineMediaPlayback" value="false" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="Fullscreen" value="true" />
    <preference name="Orientation" value="landscape" />

Answer 1

查看此线程。这里报告了很多相同的问题。最好将您的信息添加到 Cordova JIRA 错误跟踪系统，因为这是所有 Cordova 开发人员工作的地方。 https://issues.apache.org/jira/browse/CB-3020?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13769996#comment-13769996

通过在 webview 的大小调整中添加一个简单的动画，我能够从滑动中获得顶部标题。这是放在 CDViewController.m 中的 keyboardWillShow 函数中的代码

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[self.webView setFrame:(CGRectMake(newFrame.origin.x, newFrame.origin.y, newFrame.size.width, newFrame.size.height))];
[UIView commitAnimations];

我已经接近让黑条不被隐藏但不能让它很好地工作。这篇文章描述了你需要做什么。您需要使 webview 调整动画与键盘动画相匹配。 iOS 7 - Keyboard animation