0

In every form of my Android application, the keyboard overlaps the whole screen without making it scroll. If I try to scroll the entire view manually, nothing changes. Even adding 300px of fake height to ion-conten, through a div with a fixed height the scroll is locked. I tried to change AndroidManifest adding the property , but nothing. Also I tried to pass config object to IonicModule.forRoot with the property scrollAssist setted true.

I dont't understand why I have this bug only in Android app. In iOS everything works fine. I noticed that the ion-content has --keyboard-offset setted to 0px by :host style.

<ion-row>
    <ion-col>
        <ion-icon (click)="back()" size="large" class="top-custom-navigation" name="arrow-back"></ion-icon>
    </ion-col>
</ion-row>


<ion-row>
    <ion-col size="12" padding-horizontal>

        <h1>{{'REGISTRATION.WHAT_EMAIL' | translate}}</h1>
        <form #form="ngForm" padding-vertical>

            <ion-label class="small bold uppercase">{{'COMMON.EMAIL' | translate}}</ion-label>
            <ion-input [(ngModel)]="mailExist" #mail="ngModel" name="mailExist" email required
                       mailExist></ion-input>
            <div *ngIf="mail.getError('mail') && (mail.dirty || mail.touched)">
                <ion-label class="error-txt">Mail già presente</ion-label>
            </div>
            <br/>
            <ion-label class="small bold uppercase">{{'COMMON.USERNAME' | translate}}</ion-label>
            <ion-input [(ngModel)]="username" #userName="ngModel" usernameExist name="username"
                       required></ion-input>
            <div *ngIf="userName.getError('username') && (userName.dirty || userName.touched)">
                <ion-label class="error-txt">Username già presente</ion-label>
            </div>

            <ion-row>
                <ion-col size="9">
                    <p class="small" [innerHTML]="'REGISTRATION.NEWSLETTER_FLAG' | translate"></p>
                </ion-col>
                <ion-col size="3" padding-vertical>
                    <app-switch (change)="onChangeNewsletterFlag($event)" style="margin-top:10px;"></app-switch>
                </ion-col>
            </ion-row>


        </form>

    </ion-col>
</ion-row>


<app-fab-button class="fixed-bottom-right"
                type="white"
                [active]="form.valid"
                (onClick)="next()"></app-fab-button>

Zun
  • 1,553
  • 3
  • 15
  • 26

1 Answers1

0

In android there are different soft input modes exist. It's looks like you need to apply ADJUST_RESIZE mode for your screen.

You can read about differences in: Difference between adjustResize and adjustPan in android?

and this link may help you to set this mode:

https://forum.ionicframework.com/t/change-android-keyboard-behaviors-for-the-whole-app/83610

Peter Staranchuk
  • 1,343
  • 3
  • 14
  • 29