Android keyboard hides input field

Android
1

Hi,

When I focus on an input field in Android, the virtual keyboard pops up but the interface does not change at all. This means that if the input field is in the lower half of the screen, the keyboard actually hides the input field. How can I make sure that the app pans up, so that the input field always stays in view ?

This issue happens both with the Backendless Viewer mobile app and the native app mobile shell.

Thanks for your help.

2

Hi @Nicolas_REMY ,

Sorry for inconvenience. We are currently working on the solution of this problem. As a temporal solution you can try to add a listener for “on change” event to your input and place in it the next logic:
image
In “Get component by ID” you should specify component ID of your input. Could you please try this fix and write me back about results?

Regards, Andriy

1 Like
3

Hi @Andriy_Konoz ,

Thanks for the suggestion.

However, the way I see it, it wouldn’t be that great because it would wait for the user to type something before it scrolled. Perhaps using the on focus event would be better.

But, unless I am mistaken, that would still not work for components which are located at the bottom of a page, because the page can’t scroll higher than the bottom. Or would it ?

4

Hello @Nicolas_REMY

Have you tried using the “On focus Event”? I tried this event on my Android device and it worked for me.

Regards,
Inna

5

Hi @Inna_Shkolnaya ,

I just tried it, and as expected, it doesn’t work in all cases. I hope I can manage to explain why :

  • If the field is sufficiently far from the bottom of the screen, the screen can be scrolled sufficiently high so as to keep the field in view. In this case it is OK, but it does require adding the logic to each field.

  • However, if the field is near the bottom of the screen, the scroll can’t go high enough because it reaches the end of the scrollable screen. The problem is the field remains behind the keyboard.

Here is a video where I try to demonstrate this :

Edit : for some reason, when uploading to Google Drive, the video got flipped, no clue why. But you can still understand the point, I believe.

6

That is the default behavior for all web apps, so we can’t offer you a silver bullet.

If that is really annoying for you, you could:

  1. Write a custom code in On Page Enter handler to listen to all focus events for all inputs.
  2. Add dynamically some space for inputs at the bottom(style or spacer block, no matter).