search

ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.02k stars 13.51k forks source link

Keyboard blocks the input fields of the modal. #6377

Closed Langstra closed 7 years ago

Langstra commented 8 years ago

Short description of the problem:

When the keyboard pops up it blocks/pushes away the input fields/view of the modal.

I have the basic tabs application starter kit and added a modal. In the modal I have a few input fields. When I focus on a input field the keyboard pops up. Then the height of the view of the modal is so small you can not see anything. The screenshot shows exactly what I mean.

Screenshot of the issue

What behavior are you expecting?

The keyboard should not push away the view. In the worst case it should push the modal away to center it between the top of the screen and the top of the keyboard.

Steps to reproduce:

  1. Download the tabs starter template.
  2. Insert the modal example as written in the documentation.
  3. Build the app for Android using ionic run android

Other information: I ran the application on a Samsung tablet with Android Lollipop and using the swiftkey keyboard. I also tested this on a Asus tablet running Lollipop with the default Android keyboard. I believe this is not an issue on phones, because on phones the modal does not have any spacing between the screen borders and the modal borders.

Which Ionic Version? 1.3

Plunker that shows an example of your issue

http://plnkr.co/edit/BMPqjV0P3dPAjwSvMalJ?p=preview

Run ionic info from terminal/cmd prompt: (paste output below) Cordova CLI: 5.3.3 Gulp version: CLI version 3.9.0 Gulp local:
Ionic Version: 1.3.0 Ionic CLI Version: 1.7.14 Ionic App Lib Version: 0.7.0 OS: Distributor ID: Ubuntu Description: Ubuntu 15.10 Node Version: v0.12.7

Langstra commented 8 years ago

@Ionitron Is someone looking into this?

danbucholtz commented 8 years ago

@Langstra, I am taking a look at this. I'll keep you posted.

Thanks, Dan

lrambert commented 8 years ago

@Langstra Can you please tell us if you found any workaround to fix this issue ? To make things work until a fix. Would be very grateful.

Langstra commented 8 years ago

Revert to ionic 1.2.1.

BraveVN commented 8 years ago

This is issue is happened on iPhone too. When keyboard shows up, there's a space appears above the keyboard and it makes the view of input fields becomes so small. Is there anything new about the solution ?

jgw96 commented 7 years ago

This issue was moved to driftyco/ionic-v1#139

ionitron-bot[bot] commented 6 years ago

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.