Search code examples
webviewnativescriptnativescript-angular

Unwanted Top and Bottom White Space in Android Webview after keyboard disappears

References SO Questions: remove-unwanted-white-space-in-webview-android and android-webview-has-extra-white-space-at-the-bottom

I am using NativeScript for angular mobile app development. I have a login page that renders in webview and once app has the token, app then redirects to other native components.

My problem is: Screen renders fine for the first time and when user clicks on any of the text field, key board appears but when user presses Android Back button to hide the keyboard it shows the whitespace in top and bottom of the page.

Based on suggestions available on above threads, I have tried setting the padding and marging to 0. and

<meta name="viewport" content="target-densityDpi=device-dpi, width=device-width, height=device-height, initial-scale=1">
Solution

  • Thanks for the Playground Manoj. It looks like there was percentage height and width in html page and everytime user moves out from html page it re adjusts itself to available space and sometimes squeezes as well.

    I was using the webview inside the GridLayout and setting the height and width 100% to that GridLayout solved my problem.