【问题标题】:the keyboard is pushing tabs and apps contents up ionic 3 in Android [duplicate]键盘正在将标签和应用程序内容推送到 Android 中的 ionic 3 [重复]
【发布时间】: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() {

}
}

【问题讨论】:

    标签: android angular typescript ionic-framework ionic3


    【解决方案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;
            }
    }
    

    【讨论】:

    • 谢谢,我会试试你的解决方案
    猜你喜欢
    • 2019-08-14
    • 2019-03-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-04-23
    • 1970-01-01
    相关资源
    最近更新 更多