UWP 或 XAML 导航视图突出显示 [关闭]

Posted 2023-04-19

【中文标题】UWP 或 XAML 导航视图突出显示 [关闭]

【英文标题】：UWP or XAML Navigation view highlight [closed]

【发布时间】：2021-10-30 07:36:57

【问题描述】：

我正在研究通用窗口平台。 我对导航视图有疑问。

在我的页面中，导航视图有 4 个项目。 而且，当我单击按钮时，我想突出显示导航视图项。 （例如：当我单击按钮时，我想突出显示第二个导航视图项） （通过增加粗细或闪烁导航视图项边框颜色等方法）。

但是，我对此一无所知。 （如何处理和处理什么..） 如果您知道什么或有什么可参考的，请告诉我，我将不胜感激。

对不起我糟糕的英语。

【参考方案1】：

通常，您可以在NavigationView.ItemInvoked Event 中执行此操作。假设这是一个非常简单的场景。当您点击NavigationView 中的NavigationViewItem 时，NavigationView.ItemInvoked Event 将被触发，您可以通过NavigationView.SelectedItem Property 获取点击的项目。然后您可以更改NavigationViewItem。

我对此做了一个非常简单的示例。您可以根据自己的情况调整这些代码。

代码隐藏：

 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>

【讨论】：

嗨。你的回答很完美。但我的问题是缺乏的。在我的程序中，导航视图和按钮不在同一个网格中。按钮仅表示按钮元素。因此，当我单击该按钮时，我想将第二个 Navigationviewitem 的边框更改为闪烁。 （例如，该项目的边框变为红色闪烁......）。抱歉打扰你。但是，如果您对此有所了解或有想法，您能告诉我一些事情吗？非常感谢您的回答。

另外，我尝试了您评论的代码。但是这一行“foreach(NavigationViewItem item in items)”抛出了 InvalidCastException。是我的错吗？

@hong 你的意思是你想改变NavigationViewItem当一个按钮在frame页面里面？您能否更新您的问题，详细说明您的预期行为？

哦，我参考你的代码解决了这个问题。真的谢谢你。

@hong 如果您已经解决了您的问题，请考虑在此处发布您的解决方案并mark 它被接受。