NavigationView.MenuItems and navigation

Question

Working on a UWP application and had everything working till I tried to switch to using NavigationView.MenuItems.

 <muxc:NavigationView x:Name="NavView" 
    ItemInvoked="NavView_ItemInvoked"
    IsBackEnabled="False"
    IsBackButtonVisible="Collapsed"
    Loaded="NavView_Loaded">
            <muxc:NavigationView.MenuItems>
                <muxc:NavigationViewItem Content="Home" Icon="Home" ToolTipService.ToolTip="Home" Tag="home"/>
                <muxc:NavigationViewItemSeparator/>
                <muxc:NavigationViewItem x:Uid="RRNavItem" Content="Test Page" Icon="Contact" ToolTipService.ToolTip="Test Page"  >
                    <muxc:NavigationViewItem.MenuItems>
                        <muxc:NavigationViewItemHeader Content="TestPage"  >
                            <muxc:NavigationViewItemHeader.ContentTransitions>
                                <TransitionCollection>
                                    <AddDeleteThemeTransition/>
                                </TransitionCollection>
                            </muxc:NavigationViewItemHeader.ContentTransitions>
                        </muxc:NavigationViewItemHeader>
                        <muxc:NavigationViewItem Content="Test1" x:Uid="TestavItem" Icon="Manage"  Tag="Test"  />
            </muxc:NavigationViewItem.MenuItems>
                </muxc:NavigationViewItem>
                <muxc:NavigationViewItem Content="Test2" Icon="Contact" ToolTipService.ToolTip="Test" >
                    <muxc:NavigationViewItem.MenuItems>
                        <muxc:NavigationViewItem Content="Coming Soon" Icon="NewFolder" ToolTipService.ToolTip="Wait" Tag="Test"/>
                     </muxc:NavigationViewItem.MenuItems>
                </muxc:NavigationViewItem>
            </muxc:NavigationView.MenuItems>
        
            <Frame x:Name="ContentFrame">
                <Frame.ContentTransitions>
                    <TransitionCollection>
                        <NavigationThemeTransition/>
                    </TransitionCollection>
                </Frame.ContentTransitions>
            </Frame>
        
        </muxc:NavigationView>

The application will run, I will get an error when trying to navigate to a page.

Here is the code and sure that its due to using muxc as the name within the menuitem

Namespace Application.Views
{
    
    public sealed partial class Welcome : Windows.UI.Xaml.Controls.Page
    {
      

        public Welcome()
        {
            this.InitializeComponent();
        }



        [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable = true)]
        public IList<object> MenuItems { [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable = true)] get; }


        private void NavView_Loaded(object sender, RoutedEventArgs e)
        {



            // set the initial SelectedItem 
            foreach (muxc.NavigationViewItemBase item in NavView.MenuItems)
            {
                if (item is muxc.NavigationViewItem && item.Tag.ToString() == "home")
                {
                    NavView.SelectedItem = item;

                    break;
                }
            }
        }

        private void NavView_ItemInvoked(muxc.NavigationView sender, muxc.NavigationViewItemInvokedEventArgs args)
        {
            if (args.IsSettingsInvoked)
            {
                ContentFrame.Navigate(typeof(Views.SettingsPage));
            }
            else
            {
                // find NavigationViewItem with Content that equals InvokedItem
                var item = sender.MenuItems.OfType<muxc.NavigationViewItem>().First(x => (string)x.Content == (string)args.InvokedItem);
                NavView_Navigate(item as muxc.NavigationViewItem);
            }
        }

        private void NavView_Navigate(muxc.NavigationViewItem item)
        {
            switch (item.Tag)
            {
                case "home":
                    ContentFrame.Navigate(typeof(Views.Test));
                    break;
                case "Test":
                    ContentFrame.Navigate(typeof(Views.Test));
                    break;

            }
        }
    }
}

Answer 1

Hello,

Welcome to Microsoft Q&A!

The issue is related to the linq that you used to get the NavigationViewItem. Actually, you could directly get the invoked item via the args.InvokedItemContainer property.

Please change the NavView_ItemInvoked method a little bit. Like this:

 private void NavView_ItemInvoked(muxc.NavigationView sender, muxc.NavigationViewItemInvokedEventArgs args)
        {
            if (args.IsSettingsInvoked)
            {
                ContentFrame.Navigate(typeof(TestPage));
            }
            else
            {
                // find NavigationViewItem with Content that equals InvokedItem

                // this line of code is the problem.
                //var item = sender.MenuItems.OfType<muxc.NavigationViewItem>().First(x => (string)x.Content == (string)args.InvokedItem);

               // directly get the item
                muxc.NavigationViewItem item = args.InvokedItemContainer as muxc.NavigationViewItem;

                NavView_Navigate(item);
            }
        }

Thank you.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment". Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.