WebView doesn't shrink when keyboard is active



I saw that this has been asked before but the solution didn’t work for me. I’m working on a chat page and I noticed that if the thread has been long enough and the keyboard appears, the WebView wouldn’t shrink. Here it is without the keyboard:

Here’s what it looks like if the keyboard is opened (you’ll notice that the messages have been cut off):

Is there a way to make it look like this?

I already have the cordova-plugin-keyboard plugin installed as well and included in config.xml. I even added Keyboard.shrinkView(true); on device ready but I still get the same result. What else am I missing? I’m using F7 V2 by the way.

Thanks in advance!


Hello, any reason why you are not using v4?

Maybe you could give it a try and see if the problem persists.

Best regards.


Для создания приложения используйте cli. Там много кода именно для клавиатуры и Cordova.


From what i see in your screenshots, keyboard shrinks correctly (because Messagebar is on the top of the keyboard). Issue you have is that messages content doesn’t scroll to bottom on keyboard open. You need to add event listener when keyboard opens and call Messages’s .scroll() method to scroll messages to bottom http://framework7.io/docs/messages.html#messages-methods-properties



Thanks for all your replies! @nolimits4web I tried what you said but the scrollable area (the one that contains the messages) doesn’t adjust its height when the keyboard opens. The lowest it can go is what you see on my second screenshot.

Now I’m thinking a possible workaround is to make the scrollable area longer or add a margin at the bottom that’s at least equal to the height of the keyboard, so that when the keyboard is open it can scroll down and still show the last message. Any idea how I can accomplish this?