Xamarin.forms: [UWP]Navigationbar content hidden

Created on 18 Jul 2018  路  5Comments  路  Source: xamarin/Xamarin.Forms

Description

In UWP, when you create an app with a master-detail navigation structure, the content of a navigation bar, specifically the title bar in the navigation bar, get's hidden when you pop in the detail page component of the structure. This only occurs when you set a different NavigationPage. Didn't have time to test the other projects(iOS and android). In example given, the masterpage is a tabbedpage which has multiple childeren. One of those childeren navigates to his own sub page. In my personal project I have a Master detail structure for an hamburgermenu navigation setup. In that case the button for showing the menu is completely hidden as well.

Steps to Reproduce

  1. Create a new mobile App project (Xamarin.Forms)
  2. Choose Master Detail as template
  3. Choose shared Project as Code Sharing Strategy
  4. Select at least Windows(UWP) as platform
  5. Run the UWP app
  6. Click on the about item in the tabbed page.
  7. Click on the browse item in the tabbed page.
  8. Click the plus icon in the upper right corner
  9. Click the save icon in the upper right corner
  10. The content of the navigation bar is now hidden.

Expected Behavior

Even when you pop a page, the content of the navigation bar should be visible.

Actual Behavior

When you pop a page of the detailsection, the TitleArea of the navigationbar is hidden.

Basic Information

  • Version with issue: 3.0.0.561731
  • Last known good version: unknown
  • IDE: VS2017 15.7.5
  • Platform Target Frameworks:

    • UWP: 16299

Screenshots


Content shown:
content showing

Content hidden:
content hidden

Reproduction Link

Clean solution and rebuild before use.
bug.zip

2 good first issue hacktoberfest 馃嵒 help wanted UWP bug up-for-grabs

Most helpful comment

To build a sequel to this, here is a somewhat more urgent problem. It is contain in the following hamburgermenu demo.
hamburgermenudemo.zip

It probably is the same issue as display above however a little more troublesome. When navigating in the demo you will notice a problem when poping pages. Use the following steps to notice the problem:

  1. Navigate to the second page using the navigate button on the detail page:
    image

  2. Navigate to the third page using the navigate button:
    image

  3. Use the back button:
    image

The problem here is that the hamburger menu item button has disappeared. The user has no other options then to go further back in the navigation stack till the menu item button has reappeared or go further up the navigation stack (push the navigation button again). He or she has no other option to go to an item in the hamburger menu.

I suspect that this is the same issue as described above. However this issue is a bit annoying when trying to navigate because you have to make further steps to try got get to where you are going. I couldn't find this issue while using ios or android so this is a UWP only problem.

All 5 comments

This is happening because the UWP NavigationPageRenderer is currently controlling whether the Title shows up on a containing TabbedPage. Since there are multiple NavigationPages in play here (one on each tab), the first one successfully identifies itself as the current page and sets the title. Then the second page (About) runs through the same logic, determines that it is _not_ the current page, and tells the TabbedPage not to display a title.

The offending logic is in UpdateTitleOnParents: https://github.com/xamarin/Xamarin.Forms/blob/ffa53d31137b61e34192521cc10aae5c151d0c98/Xamarin.Forms.Platform.UAP/NavigationPageRendererUWP.cs#L60

To build a sequel to this, here is a somewhat more urgent problem. It is contain in the following hamburgermenu demo.
hamburgermenudemo.zip

It probably is the same issue as display above however a little more troublesome. When navigating in the demo you will notice a problem when poping pages. Use the following steps to notice the problem:

  1. Navigate to the second page using the navigate button on the detail page:
    image

  2. Navigate to the third page using the navigate button:
    image

  3. Use the back button:
    image

The problem here is that the hamburger menu item button has disappeared. The user has no other options then to go further back in the navigation stack till the menu item button has reappeared or go further up the navigation stack (push the navigation button again). He or she has no other option to go to an item in the hamburger menu.

I suspect that this is the same issue as described above. However this issue is a bit annoying when trying to navigate because you have to make further steps to try got get to where you are going. I couldn't find this issue while using ios or android so this is a UWP only problem.

I just discovered that re-setting the Title property on the Detail page (in the OnAppearing method) fixed the issue with dissapearing of the burger menu icon - at least it fixed it for me.

I have the same issue, but I don't want to set a title in my navigationbar so I would like to contribute to this.
Anyone can help me, it's the first time I solve a bug on a big project like this.

I have the same problem. I cannot set a title because I have a title in TileView and both are shown. Then I use this workaround: set the Title and set back to null in the OnAppearing method.

if(Device.RuntimePlatform == Device.UWP) { Title = AppResources.Test; Title = null; }

Was this page helpful?
0 / 5 - 0 ratings