How to not display icon on nav bar with xamarin.forms?

Question

I would like to have a bottom navbar on my app. But when I use tabbed page, the content that is displayed in the app must be one of tabs on the nav bar.

<TabbedPage>

    <TabbedPage.Children>

        <!--<NavigationPage Title="test" IsVisible="False">
            <x:Arguments>
            <ContentPage>
                <Label Text="Not display this on nav bar but show its content page"/>
            </ContentPage>
            </x:Arguments>
        </NavigationPage>-->

        <NavigationPage Title="{x:Static Resource:AppResource.PaginaInicialTitulo}" Icon="homeBlack.png">
            <x:Arguments>
                <views2:ComoTeSentesPage/>
            </x:Arguments>
        </NavigationPage>

        <NavigationPage Title="{x:Static Resource:AppResource.CalendarioTitulo}" Icon="calendarBlack.png" BarBackgroundColor="White">
            <x:Arguments>
                <views:PaginaInicial/>
            </x:Arguments>
        </NavigationPage>

        <NavigationPage Title="{x:Static Resource:AppResource.ConviteTitulo}" Icon="phoneBlack.png">
            <x:Arguments>
                <views:PaginaInicial/>
            </x:Arguments>
        </NavigationPage>
    </TabbedPage.Children>
</TabbedPage>

I want to display a diferent content for the page instead of the content of one of the selected tabs. By doing this, the nav bar could be visible on every page of the app and the content show for each page to not be linked to tabs content.

EDIT: In this picture it's show my goal. There is bottom navigation bar but none of the tabs are selected and the content displayed is not related to any of the tabs in the navigation bar. But in my project, the content displayed in the page is always related to one of the tabs in the navigation bar.

I am not sure if you have written in a hurry, you have some problems with English (though from the grammar point of view it seems to be very good) or something else, but the text above has no meaning for other developers so you should try to write again if you expect the answers... sorry. — Ivan Ičin, Apr 15 '19 at 00:18
@IvanIčin, don't feel sorry, i didn't understand anything too. What is this "the content that is displayed in the app must be one of tabs on the nav bar."? how can the content of the page be a tab? and why tabs are on the navbar? So many questions — Ali123, Apr 15 '19 at 06:50
I added an edit. Can u guys please check, i really need help. And yes, my english is not so good, sorry for that. — Kelve, Apr 15 '19 at 07:59
@Kelve - I don't understand anything yet, but still I can tell you the answer - Xamarin.Forms cover around 5% of the UI capabilities of native platforms. Don't think that you can easily make anything you can think of with Xamarin.Forms. If you want to use other 95% the answer is almost always the same - either you will have to write the custom renderer (it is usual too much of work for anyone to do it for you) or you will find the ready made component that does that (it may happen that if someone know he will recommend it). — Ivan Ičin, Apr 15 '19 at 09:36
In the first picture, you did select the last tab. Do you mean the navigation behavior? In the bottom navigation bar, each tab owns a content Page and are you wanting to navigate to a new page from these content Pages? — nevermore, Apr 16 '19 at 02:44
@JackHua-MSFT Yes, but that last tab is selected always when i navigate trhough the aplication pages. The other tabs are selected only if i click on them. I want to not have none of the tabs selected and display another content in the page not related to the tabs. — Kelve, Apr 16 '19 at 08:56
Ok, still confused to me. I will post an answer with navigation + tabbar and you can check if it is you want. — nevermore, Apr 16 '19 at 09:02
Can you check [navigation-inside-a-tab](https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/navigation/tabbed-page#navigation-inside-a-tab) if it is what you want? Samples here: [samples](https://developer.xamarin.com/samples/xamarin-forms/Navigation/TabbedPageWithNavigationPage/) — nevermore, Apr 16 '19 at 09:14
On this sample, the content displayed on the page is related to one of the 3 tabs. For example: when today tab is selected, today's content page is displayed. If today is not selected, one of the other 2 tabs will be selected and consequently it's content page displayed. — Kelve, Apr 16 '19 at 09:26
I would like to display a content that is not related to any of the tabs, but still have bottom tab bar menu available. — Kelve, Apr 16 '19 at 09:27
While you can navigate to a new page from today's content page. The new page is whatever you want and the bottom tab bar menu is still there. — nevermore, Apr 16 '19 at 09:37
I tried and bottom bar always disapeared. because i navigated to a `ContentPage`. And the tabs are available in the `TabbedPage`. — Kelve, Apr 16 '19 at 09:47
Well, I think I know what you want, I will update you tomorrow. — nevermore, Apr 16 '19 at 09:51

nevermore · Accepted Answer · 2019-04-17T07:11:41.430

1

I write a simple demo base on the navigation-inside-a-tab sample.

I make the tabbar bottom by adding:

xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
android:TabbedPage.IsSwipePagingEnabled="False"
android:TabbedPage.ToolbarPlacement="Bottom"

I changed todayPage into a carousel-page.
I also added a navigation behavior in the todayPage.

I upload it to Github and you can download: tabbedPage-Naviagtation-CarousePage

Here is the result:

edited Apr 17 '19 at 07:11

answered Apr 17 '19 at 06:58

nevermore

15,432
1
12
30

Hi. Sorry for delayed answer. I was focusing in other parts of the app and left this to the last. So, i think this is not what i wanted. In the bottom navbar, there are 3 menu items, if i click in one of them i am directed to 1 page. – Kelve Apr 26 '19 at 11:34
But i also have hamburguer menu, and the pages of each item on this hamburguer menu are not related to any of the menu items in the nav bar. Nav bar should work just as shortcuts. In this case, when i click on 1 menu item in the hamburguer menu, i am directed to some page and the bottom nav bar disapears because that is a content page. I want the navbar to be always visible but the content displayed to be related to Hamburguer menu. Hope you can understand now ... – Kelve Apr 26 '19 at 11:37
@Kelve Ok, I updated my code and you can check if it is you want. – nevermore Apr 29 '19 at 07:01
Thank you @Jack Hua, that was exactly what i wanted! Im even surprised it didnt even needed a custom renderer :D. Anyway, thank you again for the patiente and for the help. – Kelve Apr 29 '19 at 09:12
Just last small question :D. How can i return to normal content page after tab item is clicked ? – Kelve Apr 29 '19 at 10:52
@Kelve Sorry, I doesn't get your point. What is normal content page? – nevermore Apr 30 '19 at 02:32
The content initially displayed on each tab of tabbedpage – Kelve Apr 30 '19 at 08:45
@Kelve It won't show the initial content if you do operations like navigation, modal... You can try to call Navigation.PopToRootAsync to show the initial content. – nevermore Apr 30 '19 at 08:53
Is it possible to detect click on tabbedPage? If yes, then it would be easy to do. Click on some tab in the tabbedPage – Kelve Apr 30 '19 at 08:55
@Kelve Detect click on tabbedPage need custom renderer. Look at [here](https://stackoverflow.com/questions/45250485/how-can-i-detect-the-clicking-of-a-tab-button-in-xamarin-forms). – nevermore Apr 30 '19 at 09:00
In the custom renderer, i need to call PopToRoot or I should call that tabReselected Function in the viewmodel or codebehind? Sorry, im newbie. – Kelve Apr 30 '19 at 09:03
@Kelve That's depending on your situation and I think it's hard to achieve that. You can have a try. – nevermore Apr 30 '19 at 09:06

How to not display icon on nav bar with xamarin.forms?

1 Answers1