Sencha Touch 2 文本框在 iOS 7 中的焦点问题答案

【问题标题】：Sencha Touch 2 textfield's focus issue in iOS 7Sencha Touch 2 文本框在 iOS 7 中的焦点问题
【发布时间】：2013-10-08 13:19:10
【问题描述】：

我在 Sencha Touch 2 中遇到文本字段问题，这仅在 iOS 7 中出现，在 iOS 6 和 Android 中运行良好。

问题是当您点击一个键盘打开但光标消失的字段时，它应该集中在选定的文本字段上，但它没有。您必须再次点击文本字段才能聚焦。

我已经在 iOS 6 和 android（在设备和模拟器上）检查了这个问题，工作正常，但仅在 iOS 7 上没有。

有人遇到这个问题吗...？

这是煎茶中的错误还是我应该遗漏什么，请指教。

谢谢你..

【问题讨论】：

在某些情况下我似乎遇到了同样的问题。
如果我为面板提供高度（在我的代码中我已经给出了设备高度），那么它可以正常工作......但是当它（键盘）打开时位于键盘下方的文本字段textfield ，再次失去焦点......
这对我有用：stackoverflow.com/a/19182670/6347279

标签： iphone sencha-touch-2 ios7

【解决方案1】：

我发现这与两件事直接相关：

centered: true
pack: 'center'

删除这些行后，我的应用开始运行良好。挑战在于找到一种替代方法来使您的面板居中。

【讨论】：

【解决方案2】：

我花了好几天才弄清楚这一点。实际上 Sencha 对 ViewPort 高度的理解存在问题。在您的 index.html 中添加一个包含以下代码的脚本块

if (window.device && parseFloat(window.device.version) == 7.0) {
   document.body.style.paddingTop = "20px";
   Ext.Viewport.setHeight(Ext.Viewport.getWindowHeight() - 20);
}

这为你做了两件事

它在顶部提供了足够的空间来显示活动栏
它将视口高度设置为屏幕高度，无论是否存在键盘。

另外，如果您的应用在纵向和横向模式下工作，您需要在 Viewport.js（或 Main.js）中添加这些行

initialize: function(){
    Ext.Viewport.on('orientationchange', 'handleOrientationChange', this, {buffer: 0 });
},

handleOrientationChange: function(){
     try{
           if (parseFloat(window.device.version) == 7.0) {
            Ext.Viewport.setHeight(Ext.Viewport.getWindowHeight() - 20);
            }else{
            Ext.Viewport.setHeight(Ext.Viewport.getWindowHeight());
            }
      }catch(e){
                // do nothing
      }
},

是的，请确保它们的键盘弹跳为真（如果您使用的是科尔多瓦）。这将确保您的字段不会被隐藏。

希望这对你有用。

【讨论】：

【解决方案3】：

在视口元标记中添加 height="device-height"，修复问题。

ios7 issues with webview focus when using keyboard html

【讨论】：