CODEWITHSUNDEEP
javascriptcssionic-frameworksassionic3
Dms Malith Disanayake
Dms Malith Disanayake

Reputation: 203

selected ion-input border is moving up and down when the keyboard enters to the screen

I'm using ionic3.The selected ion-input's border in the ion-content is moving when the device keyboard enters to the screen as below.

enter image description here

my .html is like,

<ion-list>
  <ion-card class="xxx-card">
    <ion-item>
      <ion-input class="xxx-card" [disabled]="invoice.isChecked === true" text-center type="number" [(ngModel)]="invoice.paymentValue"
        (ngModelChange)="paymentValueCange($event,invoice,i)" name="paymentValue"></ion-input>
    </ion-item>
  </ion-card>
</ion-list>

And the .css

.xxx-card{
border: 2px solid #00BB84;
margin:10px auto;
border-radius: 10px !important;
}

All I need to do is stop ion-inputs moving when the keyboard enters to the device screen.Waiting for your suggestions.Thank you!

Upvotes: 2

Views: 382

Answers (1)

Mohan Gopi
Mohan Gopi

Reputation: 7724

i am not sure will it work or not but give it a try.

in side your platform folder

platform => android => AndroidMainfest.xml file open it .

 <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:screenOrientation="portrait" android:theme="@android:style/Theme.DeviceDefault.NoActionBar" android:windowSoftInputMode="adjustResize">

check for the above like and android:windowSoftInputMode="adjustResize" change this to this android:windowSoftInputMode="adjustPan"

and the build it and test it please let me know any issue

Upvotes: 1

Related Questions