Keyboard is pushing tabs in ionic android

问题

I’m developing an app on IONIC 3 and i’m having a problem. When I click on the ion search and the Keyboard opens in ANDROID it simply pushes the entire contents of the App by breaking the layout and squeezing the content.

and i`m use config.xml

<preference name="Fullscreen" value="true" />

app.component.ts

this.statusBar.hide();


this.statusBar.overlaysWebView(false)

Its WORK ! But, when i go to full screen mode it hides my bottom.

Please help me.

回答1:

You can handle the UIScrollView from moving Up when input is focussed using disableScroll method.

https://ionicframework.com/docs/native/keyboard/

回答2:

Try to add this line in activity tag in Manifest file android:windowSoftInputMode="adjustPan

Like This

<activity
   ...
   android:windowSoftInputMode="adjustPan"> 
</activity>

回答3:

Try adding this css in app.scss file. I too had the same problem and I came up with this answer and this one solved me. Hope this will helpful to you.

.scroll-content{
  padding-bottom: 0px !important;
  margin-top: 0px;
}

回答4:

Install Ionic Native Keyboard plugin and try below code

  import { Keyboard } from "@ionic-native/keyboard";

  this.keyboard.onKeyboardShow().subscribe((res) => {
    this.tabBarElement = document.querySelector('.tabbar');
    if (this.tabBarElement != null ) {
      this.tabBarElement.style.display = 'none';
    }
});

this.keyboard.onKeyboardHide().subscribe((res) => {
  if (this.tabBarElement != null) {
    this.tabBarElement.style.display = '-webkit-box';
  }
});

Hope you may help this! Happy Coding!!

回答5:

Try this following code:

window.addEventListener('keyboardDidShow', () => {
  console.log("Keyboard is open")
  let elements = document.querySelectorAll(".tabbar");

  if (elements != null) {
    Object.keys(elements).map((key) => {
      elements[key].style.display = 'none';
    });
  }
});

window.addEventListener('keyboardWillHide', () => {
  let elements = document.querySelectorAll(".tabbar");

  if (elements != null) {
    Object.keys(elements).map((key) => {
      elements[key].style.display = 'flex';
    });
  }
});

Add this code in appcomponent.ts or particular tab where you are facing this issue.

来源：https://stackoverflow.com/questions/52515323/keyboard-is-pushing-tabs-in-ionic-android

标签

android

angular

ionic-framework