8

ユーザー インターフェイスに Sencha Touch 2 を使用する小さなアプリに取り組んでいます。現在、iPad と iPhone の Safari で実行しています。

私の問題は、テキスト フィールドをタップするたびに、Safari が仮想キーボードを表示し、Web ビュー全体を画面から押し上げてしまうことです。

トップツールバーが見えなくなっているので、これはあまり自然に見えません。

問題を示す 2 つのスクリーンショットを次に示します。2 番目のスクリーンショットでは、キーボードが表示されている場合の効果を確認できます。

この動作を防ぎ、代わりに 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

Sencha 要素に html を使用する場合は、何かタグ html を削除する必要があります。
または、ソースのhtmlコードにタグを入れることはできますか? お役に立てれば幸いです。:)

于 2012-05-16T21:34:46.413 に答える