I'm studying the Universal window platform. I have a question about the navigation view.

In my page, Navigation view has 4 items. And, when I click the Button, I want to highlight the navigation view item. (ex : When i click the button, I want to highlight the second navigation view item) (through methods such as increasing the thickness or blinking the Color of border of navigation view item).

But, I don't have idea about that. (how handle and what to handle..) I would appreciate it if you could let me know if you know anything or if you have something to refer to.

Sorry to my terrible English.

CodePudding user response：

Generally, you could do this in the NavigationView.ItemInvoked Event. Let's say it's a very simple scenario. When you click on a NavigationViewItem in the NavigationView, the NavigationView.ItemInvoked Event will be fired, you could get the clicked item via NavigationView.SelectedItem Property. Then you could make changes to the NavigationViewItem.

I've made a very simple sample about this. You could adjust these code based on your own scenario.

Code-behind:

 private void nvSample_ItemInvoked(NavigationView sender, NavigationViewItemInvokedEventArgs args)
    {
        //change selected item
        NavigationViewItem selectedItem = nvSample.SelectedItem as NavigationViewItem;
        selectedItem.FontSize = 34;
        // get items
        var items = nvSample.MenuItems;
        //change other items back to normal
        foreach (NavigationViewItem item in items) 
        {
            if (!item.Tag.ToString().Equals(selectedItem.Tag.ToString())) 
            {
                item.FontSize = 20;
            }
        } 


        ContentFrame.Navigate(typeof(HomePage));
    }

Xaml:

 <NavigationView x:Name="nvSample" ItemInvoked="nvSample_ItemInvoked" >
        <NavigationView.MenuItems>
            <NavigationViewItem Icon="Play" Content="Menu Item1" Tag="SamplePage1" FontSize="20" />
            <NavigationViewItem Icon="Save" Content="Menu Item2" Tag="SamplePage2" FontSize="20" />
            <NavigationViewItem Icon="Refresh" Content="Menu Item3" Tag="SamplePage3" FontSize="20"/>
            <NavigationViewItem Icon="Download" Content="Menu Item4" Tag="SamplePage4" FontSize="20" />
        </NavigationView.MenuItems>
        <ScrollViewer>
            <Frame x:Name="ContentFrame" Padding="12,0,12,24" IsTabStop="True"/>
        </ScrollViewer>
    </NavigationView>