C#/UWP Hide NavigationView after button selection

Question

Im bumping into an issue currently where clicking on an AppBarButton doesnt minimise the NavView after navigating. Unlike the NavView_SelectionChanged void which minimises NavView automatically after selecting a NavigationViewItem. Im not sure how to hide the NavView after updating the Content Frame.

Here is the MainPage.xaml.cs

public sealed partial class MainPage : Page
    {

        public MainPage()
        {
            this.InitializeComponent();

            string appName = Windows.ApplicationModel.Package.Current.DisplayName;
        }

        private void NavView_SelectionChanged(Windows.UI.Xaml.Controls.NavigationView sender, Windows.UI.Xaml.Controls.NavigationViewSelectionChangedEventArgs args)
        {
            NavigationViewItem item = args.SelectedItem as NavigationViewItem;

            switch (item.Tag.ToString())
            {
                case "OverView_Page":
                    ContentFrame.Navigate(typeof(Content_Pages.Overview_Page));
                    break;
                case "Bills_Page":
                    ContentFrame.Navigate(typeof(Content_Pages.Bills_Page));
                    break;
                case "BillPayer_Page":
                    ContentFrame.Navigate(typeof(Content_Pages.BillPayer_Page));
                    break;
                case "Transfers_Page":
                    ContentFrame.Navigate(typeof(Content_Pages.Transfers_Page));
                    break;
                case "PayDates_Page":
                    ContentFrame.Navigate(typeof(Content_Pages.PayDates_Page));
                    break;               
            }
        }
       private void SettingsButton_Click(object sender, RoutedEventArgs e)
        {
            ContentFrame.Navigate(typeof(Content_Pages.SettingsPage));
        }
    }

And the MainPage.XAML AppBarButtons:

<mux:NavigationView.MenuItems>
                <StackPanel Orientation="Horizontal" UseLayoutRounding="False">
                    <AppBarButton Icon="Setting" Margin="1, 2, 0, 0" Tag="Settings_Page" HorizontalAlignment="Center" Width="56.5" Height="56.5" ClickMode="Press" Click="SettingsButton_Click"/> 
                </StackPanel>

All of these are closed off correctly so these are just the relevant bits. Please excuse my lack of knowledge on this, still learning

Answer 1

first of all I would recommend you to use the latest version of NavigationView in the new winui library : https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/navigationview

Relevent parts from the docs above

NavigationView can be set to different display modes, via the PaneDisplayMode property: for your scenario you can toggle between values : Left and LeftCompact .

whenever user clicks an appbar button its clicked event will be invoked, within that event you can set the PaneDisplayMode property to your desired value and that way you can control when the NavigationView hidesor shows or whatever you want it to do basically u can do a lot with this newer version of the control, read the docs link above for more detailed docs. Hope this helps.

Answer 2

在SettingsButton_Click ContentFrame.Navigate调用之后添加以下行：

NavView.IsPanelOpen = false;