web-dev-qa-db-ja.com

キーボードを防ぐ方法phonegapを使用してiOSアプリでwebviewをプッシュアップする

画面下部の入力フィールドにフォーカスがあると、キーボードがWebビューを押し上げ、ページの上部が表示されなくなります。

キーボードがウェブビューを押し上げるのを防ぎたい。

誰もがアイデアを持っていますか？

ioscordovawebviewkeyboard
17
Yajap

フォーカス時に、window.scrollTo（0,0）;に設定すると、キーボードがWebViewを完全に押し上げることがなくなります。

$('input').on('focus', function(e) {
    e.preventDefault(); e.stopPropagation();
    window.scrollTo(0,0); //the second 0 marks the Y scroll pos. Setting this to i.e. 100 will Push the screen up by 100px. 
});

Yスクロール位置に静的な値を設定したくない場合、この 短いプラグインを自由に使用してください。入力フィールド の下にキーボードを配置します。それは完璧ではありませんが、それは仕事をします。上記のようにフォーカスでこれを呼び出すだけです：

setKeyboardPos(e.target.id);
25
Jonathan

を使用してこの問題を解決しました driftyco/ionic-plugins-keyboard （ https://github.com/driftyco/ionic-plugins-keyboard ）

最初にキーボードプラグインをインストールします。

_cordova plugin add com.ionic.keyboard
_

I）ネイティブキーボードスクロールを無効にすることができます：

_cordova.plugins.Keyboard.disableScroll(true);
_

またはII）devicereadyの_native.keyboardshow_イベントをリッスンし、キーボードが表示されたら上にスクロールします：

_window.addEventListener('native.keyboardshow', keyboardShowHandler);

function keyboardShowHandler(e){
    setTimeout(function() {
        $('html, body').animate({ scrollTop: 0 }, 1000);
    }, 0);
}
_

私の場合、アニメーションスクロールが気に入ったため、II）アプローチを使用しました。アニメーションを使いたくない場合は、対応する行をwindow.scrollTo(0, 0);に置き換えます。しかし、その場合は、この「リッタージッターアニメーション」Imskullが書いたものに再び対処する必要があると思います。

13
capitannaranja

config.xmlでこれを確認してください

<preference name="KeyboardShrinksView" value="true" />
3
Ravi Ranjan

私は同じ問題を抱えていて、上記の解決策はどれも助けにはなりませんでしたが、簡単に解決する方法を見つけました。

プラットフォーム/ Androidフォルダーでmanifest.xmlを開き、メインアクティビティタグでAndroid：windowSoftInputMode = "adjustResize"属性をAndroid：windowSoftInputMode = "adjustPan"に置き換えます

これでキーボードがコンテンツをオーバーレイします。

私はそれが誰かを助けることを願っています。

3
Athinodoros Sgouromallis

自分で答えを見つけなければならない前に、私は100の答えを文字通り通しました。ここで、IOSでUIのスクロールを無効にする方法を説明します。コルドバがロードされているときに、これを追加します。インストールしてください：

cordova plugin add ionic-plugin-keyboard --save

そして、cordova prepareこの新しいプラグインをwwwフォルダーにロードします。

document.addEventListener('deviceready', function(e){
    window.addEventListener('native.keyboardshow', function () {
            cordova.plugins.Keyboard.disableScroll(true);
        });
});

以上です。これが役に立ったかどうか教えてください。もっと回答させていただきます。

3
code_love

このオプションをconfig.xmlに追加すると、うまくいきました。

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

Cordova 3.2. で削除されましたが、 cordova-plugin-keyboard で利用可能です。

このプラグインをインストールする必要があり、このオプションは再び機能します

cordova plugin add cordova-plugin-keyboard
2
sergej