8

我正在开发一个使用 Sencha Touch 2 作为用户界面的小应用程序。现在我在我的 iPad 和 iPhone 上的 Safari 中运行它。

我的问题是,每当我点击一个文本字段时,Safari 就会打开虚拟键盘并将整个网页视图向上推,离开屏幕。

这看起来不太自然,因为顶部工具栏不再可见。

这是两个演示问题的屏幕截图。在第二个屏幕截图中,您可以看到键盘可见时的效果。

有没有办法阻止这种行为,并让 Safari调整用户界面的大小?

普通视图


启用键盘

4

5 回答 5

4

不幸的是,Apple 想要这种行为,但有人建议使用 window.scrollTo() 进行一些小技巧:

listeners: {
    focus: function() {
        window.scrollTo(0,0);
    }
}
于 2012-07-23T06:39:49.567 回答
1

将此代码放在 app.js 的启动函数中对我有用:

 if (Ext.os.is.Android) {
        Ext.Viewport.on('painted', function () {
            Ext.Viewport.setHeight(window.innerHeight);
        });
    }

    if (Ext.os.is.iOS) {

        Ext.Viewport.on('painted', function () {
            Ext.Viewport.setHeight(window.innerHeight);
        });
    }
于 2015-12-02T06:28:53.027 回答
0

我找到了适合我的解决方案。您将顶栏移动到容器中。

xtype: 'container',
                docked: 'top',
                height: '100%',
                html: '',
                itemId: 'MyContainer',
                width: '100%',
                items: [
                    {
                        xtype: 'titlebar',
                        docked: 'top',
                        itemId: 'topBar',
                        title: 'Obec Webchat',
                        layout: {
                            type: 'hbox',
                            align: 'start'
                        },
                        items: [
                            {
                                xtype: 'button',
                                action: 'back',
                                id: 'BackButton',
                                itemId: 'BackButton',
                                margin: '5 70% 5 15',
                                ui: 'back',
                                text: 'Home'
                            }
                        ]
                    },
                    {
                        xtype: 'container',
                        docked: 'bottom',
                        height: '95%',
                        html: '<iframe src="http://webim.obec.local/" width="100%" height="100%" scrolling="yes"></iframe>',
                        itemId: 'MyContainer1',
                        width: '100%'
                    }
                ]
            }

希望这可以帮助。

于 2014-05-05T10:13:19.583 回答
-1

您将需要调用该blur()方法textfield

// Assuming the id of textfield - "textFieldId"
Ext.getCmp('textFieldId').blur();

尝试forcefully模糊字段的输入焦点。

于 2012-05-16T14:44:19.307 回答
-2

如果你这个使用 html 进入 Sencha 元素必须删除一些标记 html。或者您可以将标签
放在源 html 代码中。我希望能帮助你。:)

于 2012-05-16T21:34:46.413 回答