Ionic Android keyboard resize vh and shrink content

I am trying to develop a responsive app where vh unit is used for ion-input height, margin and etc. However, the entire view will be shrink whenever the keyboard is showed up.

After adding the preference below, this issue is solved but only in iOS.

<preference name="KeyboardResizeMode" value="ionic" />

After changing android:windowSoftInputMode from adjustResize to adjustPan, vh remain unchange but keyboard overlay on the ion-input and unable to scroll.

android:windowSoftInputMode="adjustPan"

Approaches that I’ve tried but no luck:

.scroll-content {
    padding-bottom: 0 !important;
}

IonicModule.forRoot(MyApp, {
            scrollPadding: false,
            scrollAssist: true,
            autoFocusAssist: false
 })

Ref:
https://stackoverflow.com/questions/39503996/how-to-keep-layout-unchanged-when-keyboard-is-displayed/39505246

https://stackoverflow.com/questions/52804428/ionic-3-keyboard-pushes-content-up-and-over-other-content-with-no-reason

1 Like