Ionic ion-content not scrolling down when keyboard

2019-06-16 05:07发布

I have a simple view with a login form. On Android, if the keyboard is opened, the content is not scrolling up to prevent it from getting behind the keyboard.

I followed the Keyboard instructions from the docs, and read a lot of forum posts, but I haven't figured it out.

I installed the Keyboard plugin com.ionic.keyboard.

This is the structure of the page:

<ion-nav-view>
  <ion-view>
    <ion-content>
       ...<form>..Login form..</form>...
    </ion-content>
  </ion-view>
</ion-nav-view>

If I put some extra dummy content in the page, it shows that ion-content is indeed scrollable. However, it's not moving up when the keyboard is opened by focusing on an input.

  • Ionic version? 1.0.0-beta.13
  • Is my app fullscreen? No
  • Did I test if the keyboard plugin is working? Yes

Is there anything else I have to do?

4条回答
Melony?
2楼-- · 2019-06-16 05:44

I have prevent this scrolling property in my project by setting below values in AndroidManifest.xml file.

android:windowSoftInputMode = "adjustNothing"

Please check whether android:windowSoftInputMode value is adjustResize or not in AndroidManifest.xml. If not please update it to adjustResize.

I hope this will you. Thanks

查看更多
forever°为你锁心
3楼-- · 2019-06-16 05:44

On both Android and iOS, Ionic will attempt to prevent the keyboard from obscuring inputs and focusable elements when it appears by scrolling them into view. In order for this to work, any focusable elements must be within a Scroll View or a directive such as Content that has a Scroll View.

description from documentation here

查看更多
迷人小祖宗
4楼-- · 2019-06-16 05:45

In my case there is a footer that hides the input when the keyboard is showing.

Seeing github.com/driftyco/ionic/issues/2151, although its a closed bug it seems that its still an issue.

To me it seems that the scrolling doesn't know how to calculate properly whether it should scroll or not, because it doesn't take under account the footer in its calculations. If the content is big enough from the first place then it knows it has to scroll anyway.

I've ended up using

$timeout(function() {
    $ionicScrollDelegate.scrollBottom(true);
}, 300);

and adding some <br/> at the bottom of my ion-content. There is enough space so it won't effect anything for me, bug will cause the scroll to work properly.

查看更多
beautiful°
5楼-- · 2019-06-16 05:50

In the section where you declare the keyboard plugin, try to add this:

  if (window.cordova && window.cordova.plugins.Keyboard) {
    cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    cordova.plugins.Keyboard.disableScroll(false);

  }
查看更多
登录 后发表回答