How to hide BottomNavigation bar in Nativescript

Question

Please how can i hide Bottom Navigation in a particular page in nativescript core? The code for my BottomNavigation is in App-root.xml file. this makes it visible on all pages, i'm trying to hide it from a specific page. Below is my app-root.xml file

<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

For anyone who is searching for a simple solution : Try this:

<TabStrip visibility="collapsed">

It worked for me.