Microsoft-ui-xaml: NavigationView Header is being shown in PaneDisplayMode Top despite AlwaysShowHeader to false

Created on 25 May 2019  路  7Comments  路  Source: microsoft/microsoft-ui-xaml

Describe the bug

If the Header property of NavigationView is set, despite setting AlwaysShowHeader is set to false, the header stays in all mode (all non-compact)

Steps to reproduce the bug

Steps to reproduce the behavior:

  1. Create a page, put NavigationView controls in with something for the Content
  2. Set the header property with a control, like a textbox or something.
  3. Set AlwaysShowHeader to false
  4. Observe the content region. it always have a 40px reserved space on top for the header that is not supposed to be shown

Expected behavior

Expected the header to be hidden while the PaneDisplayMode = "Top"

Screenshots

Header being shown in PaneDisplayMode = "Top"
image

But not when the pane is switch to the side.
image

Version Info

NuGet package version:

2.1.190405004.2


| Windows 10 version | Saw the problem? |
| :--------------------------------- | :-------------------- |
| Insider Build (xxxxx) | |
| May 2019 Update (18362) | |
| October 2018 Update (17763) | Yes |
| April 2018 Update (17134) | |
| Fall Creators Update (16299) | |
| Creators Update (15063) | |
| Anniversary Update (14393) | |


| Device form factor | Saw the problem? |
| :-------------------- | :------------------- |
| Desktop | Yes |
| Mobile | |
| Xbox | |
| Surface Hub | |
| IoT | |

Additional context

Setting the header content to Visibility="Collapsed" or setting the header template to be collapsed doesn't work. The reserved space seems to always be there.

Proposed fix

[Edited by YuliKl]
When AlwaysShowHeader = False, the header should be collapsed in all display modes except Minimal.

area-NavigationView bug good first issue team-Controls

Most helpful comment

I'll investigate this.

All 7 comments

This is currently by design -- AlwaysShowHeader was added before top mode was invented. It could probably use a better name. Even in left mode it shows in minimal mode.

What's the reason for wanting to set the header property but have it never show up?

The header is usually set to support Left Minimal Mode, when Hamburger button will just essentially float on top of the content, which needs the header.

The property AlwaysShowHeader itself does this when in non-top mode, it doesn't make sense that it would work with non-Top mode (to support the above scenario), but then doesn't/force it on top mode.

@Code-ScottLe - I believe you're saying that when PaneDisplayMode=Top and AlwaysShowHeader=false, the header should be collapsed. Correct? The various Left modes (including minimal and compact) are working as you expect them to?

@YuliKl That is correct. The header was set only to support the page when in LeftMinimal and i would not expect it to be visible in any other modes that are meant for bigger screen.

In the design docs for NavigationView, the section Top To Left Navigation describe this perfectly, but didn't account for this problem.

image

This feels like a bug. I added the proposed fix into the original issue description.

Thanks @yulikl, given that I've moved this to dev backlog.

I'll investigate this.

Was this page helpful?
0 / 5 - 0 ratings