Fix Android keyboard resizing and input obscuring in Ionic (inputShims)

Discussão em 'Angular' iniciado por gtnikqi, Outubro 23, 2024.

  1. gtnikqi

    gtnikqi Guest

    Hi everyone,

    I'm not sure who needs to hear this, but I certainly wish I had known this earlier.

    For a long time, I struggled with getting the keyboard to behave smoothly and predictable on Android devices when building an app with Ionic/Angular. The main issue was that the keyboard would often resize the layout abruptly and covering input field, overall creating a poor UX.

    I spent a lot of time searching for solutions, tweaking different configurations and trying to find a way to prevent the keyboard from causing these issues.

    I tried using android:windowSoftInputMode="adjustPan" in the Android manifest, but that didn't solve it. I also tried with different keyboardResize options in the Capacitor config (Ionic, Body, Native), but none of them gave me the smooth behavior I was looking for.

    After some more searching around, I found a thread on Github about a niche that isn't well documented in Ionic's official documentation - at least not that I could find. This feature ended up being the solution to my problem.

    I'll provide the solution in my answer below :)

    Continue reading...

Compartilhe esta Página