question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

NavigationView's Settings menu item space is still present when `IsSettingsVisible` set to false

See original GitHub issue

Describe the bug In a NavigationView, when the Settings NavigationViewMenuItem is hidden with IsSettingsVisible="False", the spacing for that menu item still exists.

Steps to reproduce the bug

Sample Code
<Page
    x:Class="WinUIPlayground.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WinUIPlayground"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
    mc:Ignorable="d">
    <Page.Resources>
        <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
    </Page.Resources>

    <muxc:NavigationView
        IsSettingsVisible="True">
        <muxc:NavigationView.MenuItems>
            <muxc:NavigationViewItem>Menu Item 1</muxc:NavigationViewItem>
            <muxc:NavigationViewItem>Menu Item 2</muxc:NavigationViewItem>
            <muxc:NavigationViewItem>Menu Item 3</muxc:NavigationViewItem>
            <muxc:NavigationViewItem>Menu Item 4</muxc:NavigationViewItem>
        </muxc:NavigationView.MenuItems>

        <muxc:NavigationView.PaneFooter>
            <muxc:NavigationViewItem>
                <muxc:NavigationViewItem.Icon>
                    <FontIcon Glyph="&#xE713;" />
                </muxc:NavigationViewItem.Icon>
                <muxc:NavigationViewItem.Content>
                    Custom Settings Menu Item
                </muxc:NavigationViewItem.Content>
            </muxc:NavigationViewItem>
        </muxc:NavigationView.PaneFooter>
    </muxc:NavigationView>
</Page>

Steps to reproduce the behavior:

  1. Create a muxc:NavigationView with a PaneFooter and IsSettingsVisible="False" (see sample code above)
  2. Launch the sample app

Expected behavior The PaneFooter should be flush with the bottom of the NavigationView.

Screenshots NavigationViewPaneFooterBug

Version Info NuGet package version: [Microsoft.UI.Xaml.2.5.0-prerelease.201202003]

NOTE: This did not exist in [Microsoft.UI.Xaml.2.5.0-prerelease.200609001]

Windows app type:

UWP Win32
Windows 10 version Saw the problem?
Insider Build (xxxxx)
May 2020 Update (19041)
November 2019 Update (18363)
May 2019 Update (18362)
October 2018 Update (17763)
April 2018 Update (17134)
Fall Creators Update (16299)
Creators Update (15063)
Device form factor Saw the problem?
Desktop
Xbox
Surface Hub
IoT

Additional context

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:2
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
chingucodingcommented, Jan 29, 2021

I’m curious what would happen if I remove MinHeight. If you/somebody can direct me to resources on how to build/test this, I’d be down to give it a shot.

Of course, you can find the building steps here: https://github.com/microsoft/microsoft-ui-xaml/blob/master/docs/developer_guide.md#building-the-repository

Regarding removing MinHeigh, you will need to look at dev/NavigationView/NavigationView.xaml (line 462). Best case would be that we can just remove the line and everything works fine. In case you want to run to check if that broke something automatically, run the “VerifyPaneLayout*” tests; searching for “VerifyPaneLayout” in the test explorer should give you the correct tests. For testing this manually, start the “MUXControlsTestApp” project. You will probably need to modify a test page though to test this. The best page would probably be “NavigationView_TestUI/Footer/PaneLayoutTestPage.xaml”.

0reactions
chingucodingcommented, Feb 12, 2021

Thank you for trying to work on this @carlos-zamora! I would work on this then and I’ll ping you on the PR 😊

Read more comments on GitHub >

github_iconTop Results From Across the Web

NavigationView - Windows apps
To hide the settings item, set the IsSettingsVisible property to false . The left pane also contains: A menu button to toggle the...
Read more >
NavigationView.SettingsItem Property
To remove the Settings item, set the IsSettingsVisible property to false rather than removing it from the collection.
Read more >
UWP NavigationView.PaneFooter Rollover Issues
1 Answer 1 · remove Stackpanel and add NavigationViewItem directly to the footer and set HorizontalAlignment of your footer NavigationViewItem to ...
Read more >
Navigation View in UWP - YouTube
In this learn to code tutorial, we learn to create a UWP application that has a navigation view complete with back button and...
Read more >
If you're not having fun, you're doing it wrong. | Page 3
All menu items in the sample are hooked to the same handler that closes the InfoBar by setting the IsOpen property: ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found