Display resizing after keyboard is closed

[jlbrenneke]

I'm working on an experience that uses multiple popups that require inputs. Once I enter the input (and the keyboard closes) and close the popup, my 2d display is shifted up, almost like it is shifting everything above where the keyboard was. This causes some widgets on top to shift off the display. Additionally, I can't click on anything, like my buttons are frozen. I can still move my model around though. 

This issue seems to happen when I run the experience on an iPhone 8, but did not have an issue when running on an iPad.

Flipping the orientation of the phone resolves the issue, but is not an acceptable solution.

[tmccombie]

Can you share a sample project where this is happening? I tried to reproduce with a simple project locally and was unable to. 

[ghoofman · Accepted solution]

I also came across this issue, although it happened on the iPad as well. The solution was to scroll by 0 after an input happens. It has something to do with the fixed positioning.

https://github.com/apache/cordova-ios/issues/417

The solution:

function setupKeyboardFix() {
    // Once the view is ready, automatically scroll by 0 to fix
    // This is beneficial when navigating to a new view
    window.scrollBy(0,0);
    
    // When the document has a blur event
    document.addEventListener('blur', function() { window.scrollBy(0,0); } );

    // When any input loses focus (blur event)
    const inputBlurFixes = document.getElementsByTagName('input');
    for(var i = 0; i < inputBlurFixes.length; i++) {
        inputBlurFixes[i].addEventListener('blur',() => {
            window.scrollBy(0,0);
            document.body.scrollTop = 0;
        });
    }
}

$scope.$on("$ionicView.afterEnter", function(event) {
    setupKeyboardFix();
}

[CliffRice]

@ghoofman 's fix worked well for this keyboard resizing issue I was having as well. I would love to set up a brief chat with anyone from PTC to walk me through what each line does and why it is necessary. But I am not sure if there is a system in place to do that. @tmccombie would this be possible? My application is by no means simple, but if it helps I could create a simple application to replicate this issue.