键盘正在将标签和应用程序内容推送到 Android 中的 ionic 3 [重复]

Posted 2023-03-13

【中文标题】键盘正在将标签和应用程序内容推送到 Android 中的 ionic 3 [重复]

【英文标题】：the keyboard is pushing tabs and apps contents up ionic 3 in Android [duplicate]

【发布时间】：2018-05-03 05:16:07

【问题描述】：

我正在 ionic 3 上开发应用程序，但遇到了问题。当我点击搜索并打开键盘时，只需将应用程序的全部内容推到顶部。

我的标签代码，视图

<ion-tabs color='navbarColor'>
<ion-tab [root]="tab1Root" tabTitle="Inicio" tabIcon="ios-home"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Cultivos" tabIcon="ios-leaf"></ion-tab>
<ion-tab [root]="tab3Root" tabTitle="Suelos" tabIcon="ios-flask"></ion-tab>
<ion-tab [root]="tab4Root" tabTitle="Acerca" tabIcon="ios-information-
circle"></ion-tab>
</ion-tabs>

控制器

import  Component  from '@angular/core';
import  AboutPage  from '../about/about';
import  HomePage  from '../home/home';
import  CultivosPage  from '../cultivos/cultivos';
import  SuelosPage  from '../suelos/suelos';

@Component(
templateUrl: 'tabs.html'
)
export class TabsPage 

tab1Root = HomePage;
tab2Root = CultivosPage;
tab3Root = SuelosPage;
tab4Root = AboutPage;

constructor() 

【参考方案1】：

这是我的解决方案：

如下图所示，把你所有的内容放到ionic grid里面。Afer即设置min-height: 100%。就是这样。

.html

<ion-content class="my-content">
  <ion-grid>
    <ion-row class="row1">
      <ion-col col-12>

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

  </ion-grid>
</ion-content>

.scss

.my-content 
        ion-grid 
            min-height: 100%;
        
        .row1 
            flex: 1;
        

【讨论】：

谢谢，我会试试你的解决方案