Best way to slide inputs out of the way of the keyboard?



  • So the front page of my app is your stereotypical full screen page with a logo and 2 input boxes. These 2 input boxes have autocomplete dropdowns for categories and location.

    When I deploy using Cordova on iOS or Android, tapping on the inputs leaves them hidden by the keyboard. On Android, I’ve tried the behavior to slide the screen up but it makes things look janky and mostly just causes issues on the page.

    Any good solutions already out there for this?


  • Admin

    I’m working on a solution for this. Made an experiment with a cordova package called something like ionic keyboard. This package triggers events when keyboard is shown, and you can check the keyboard height and add same offset to the scroll position of the page (or .layout-view if using layout). This will probably go into the next Quasar if I’ll be succesfull all the way.

    It’s another common problem with Hybrid Apps that will get solved by Quasar.



  • @rstoenescu Awesome! Is that a couple weeks off? If so, I’ll roll it myself for now. Is this the package you are referring to:

    https://github.com/driftyco/ionic-plugin-keyboard


  • Admin

    Yep. That’s the one.


  • Admin

    If you find a generic way before I start working on it maybe you can make a PR. It would speed things up.


Log in to reply
 

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.