Ionic 4-隐藏android导航栏(底部)

Question

当离子输入有焦点时，它会显示导航栏。焦点更改后，导航栏将隐藏。这是代码。

在应用程序组件中使用

this.androidFullScreen.isImmersiveModeSupported().then(() => this.androidFullScreen.immersiveMode());

在注册页面上，我有两个输入字段。当点击第一个字段时，离子输入具有焦点，并显示底部的导航栏。

已尝试(ionFocus(＝"；hideNavigationBar((">

hideNavigationBar() {
this.androidFullScreen.setSystemUiVisibility(AndroidSystemUiFlags.LayoutStable | 
AndroidSystemUiFlags.LayoutHideNavigation | AndroidSystemUiFlags.HideNavigation);
}

此外，当显示软键盘时，尝试隐藏导航栏。

this.keyboard.onKeyboardWillShow().subscribe(()=> { 
this.keyboard.hide();
this.androidFullScreen.setSystemUiVisibility(
AndroidSystemUiFlags.HideNavigation |
AndroidSystemUiFlags.LayoutHideNavigation |
AndroidSystemUiFlags.Immersive |
AndroidSystemUiFlags.LayoutStable);
});

但是仍然显示导航栏。有人能帮忙吗？

Answer 1

使用cordova插件即可实现。

安装

ionic cordova plugin add cordova-plugin-navigationbar
npm install @ionic-native/navigation-bar

代码端

import { NavigationBar } from '@ionic-native/navigation-bar/ngx';
constructor(private navigationBar: NavigationBar) { }
...
let autoHide: boolean = true;
this.navigationBar.setUp(autoHide);

详细说明在这里。https://ionicframework.com/docs/native/navigation-bar