时间戳

首页 > 解决方案 > 在 Nativescript 中隐藏底部导航栏

android - 在 Nativescript 中隐藏底部导航栏

问题描述

我正在使用 Nativescript 7+，我想TabStrip在导航到某些页面后隐藏它们。下面是我的.html代码。

<BottomNavigation id="bottomNav">
    <TabStrip>
        <TabStripItem iconSource="font://&#xf015;" title="title1" class="fa tabstripitem"></TabStripItem>
        <TabStripItem iconSource="font://&#xf015;" title="title2" class="fa tabstripitem"></TabStripItem>
        <TabStripItem iconSource="font://&#xf015;" title="title3" class="fa tabstripitem"></TabStripItem>
        <TabStripItem iconSource="font://&#xf015;" title="title4" class="fa tabstripitem"></TabStripItem>
    </TabStrip>

    <TabContentItem>
        <page-router-outlet name="outlet1"></page-router-outlet>
    </TabContentItem>
    <TabContentItem>
        <page-router-outlet name="outlet2"></page-router-outlet>
    </TabContentItem>
    <TabContentItem>
        <page-router-outlet name="outlet3"></page-router-outlet> 
    </TabContentItem>
    <TabContentItem>
        <page-router-outlet name="outlet4"></page-router-outlet>
    </TabContentItem>
</BottomNavigation>

我试过使用：

let bottomBar = <BottomNavigation>Application.getRootView();

if (bottomBar.android) {
    bottomBar.tabStrip.visibility = Visibility.hidden;
} else {
    bottomBar.viewController.tabBar.hidden = true;
}

但是，bottomBar.tabStrip.visibility = Visibility.hidden;隐藏整个选项卡（白页）。我在安卓手机上测试。

标签： androidangularnativescriptbottomnavigationview

解决方案

像这样使用

if (isAndroid) {
this.bottomNavBar.android.bottomNavigationBar.setVisibility(android.view.View.GONE)
} else {
     this.bottomNavBar.ios.tabBar.hidden = true;
}

推荐阅读