如何在 Nativescript 中隐藏 BottomNavigation 栏

Question

请问如何在 nativescript core 的特定页面中隐藏底部导航？我的 BottomNavigation 的代码在 App-root.xml 文件中。这使得它在所有页面上都可见，我试图从特定页面隐藏它。下面是我的应用程序-root.xml 文件

<BottomNavigation id="bottomNav">
    <TabStrip backgroundColor="#3f3f3f">
        <TabStripItem class="navigation__item">
            <!--
                Note TabStripItem will only accept single Label and/or single Image elements that it
                will "adopt"; any other layout elements you try to specify will be ignored
            -->
            <Label text="Play" />
            <Image src="font://&#xF04B;" class="fas t-36" />
        </TabStripItem>
        <TabStripItem class="navigation__item">
            <Label text="Trending" />
            <Image src="font://&#xF75A;" class="fas t-36" />
        </TabStripItem>
        <TabStripItem class="navigation__item">
            <Label text="Account" />
            <Image src="font://&#xF2BD;" class="fas t-36" />
        </TabStripItem>
    </TabStrip>

    <TabContentItem>
        <Frame defaultPage="home/home-items-page" />
    </TabContentItem>

    <TabContentItem>
        <Frame defaultPage="browse/browse-page" />
    </TabContentItem>

    <TabContentItem>
        <Frame defaultPage="search/search-page" />
    </TabContentItem>
</BottomNavigation>

Answer 1

您可以在本地切换 TabBar 的可见性

隐藏，

if (bottomNav.android) {
    bottomNav._bottomNavigationBar.setVisibility(android.view.View.GONE);
} else {
    bottomNav.viewController.tabBar.hidden = true;
}

为了展示它，

if (bottomNav.android) {
    bottomNav._bottomNavigationBar.setVisibility(android.view.View.VISIBLE);
} else {
    bottomNav.viewController.tabBar.hidden = false;
}

其中 bottomNav 应该是您的 BottomNavigation 组件的实例。

Answer 2

let bottomBar = application.getRootView();

    if (bottomBar.android) {
        bottomBar._bottomNavigationBar.setVisibility(android.view.View.GONE);
    } else {
        bottomBar.viewController.tabBar.hidden = true;
    }

Answer 3

致所有正在寻找简单解决方案的人：试试这个：

<TabStrip visibility="collapsed">

对我有用。

如何在 Nativescript 中隐藏 BottomNavigation 栏

How to hide BottomNavigation bar in Nativescript

android

nativescript