XAML 如何在导航到页面时更改NavigationView标题?

kxeu7u2r  于 2023-06-03  发布在  其他
关注(0)|答案(1)|浏览(274)

我在这里尝试实现的目标是在按NavigationView MenuItem时更改NavigationView Header属性,在此处它切换到不同的页面。我希望标题显示按钮上的文本,但我仍然在学习使用WinUI/XAML库,查看图库和文档并没有真正帮助。
MainPage.xaml上的NavigationView.MenuItems

<muxc:NavigationView.MenuItems>
            <muxc:NavigationViewItem Icon="Home" Content="Home" x:Name="Menu1Item" Tag="Page1"/>
            <muxc:NavigationViewItem Icon="Contact" Content="Account" x:Name="Menu2Item" Tag="Page2"/>
            <muxc:NavigationViewItem Icon="Bullets" Content="Attendance" x:Name="Menu3Item" Tag="Page3"/>
            <muxc:NavigationViewItem Icon="Library" Content="Grades" x:Name="Menu4Item" Tag="Page4"/>
            <muxc:NavigationViewItem Icon="Flag" Content="Grad Reqs" x:Name="Menu5Item" Tag="Page5"/>
        </muxc:NavigationView.MenuItems>

https://i.stack.imgur.com/ZeNdf.png
https://i.stack.imgur.com/t7eEj.png
编辑:
MainPage.xaml:

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

    <Page.Resources>
        <!--This top margin is the height of the custom TitleBar-->
        <Thickness x:Key="NavigationViewContentMargin">0,48,0,0</Thickness>
    </Page.Resources>
    <Grid>
        <Border x:Name="AppTitleBar"
                IsHitTestVisible="True"
                VerticalAlignment="Top"
                Background="Transparent"
                Height="40"
                Canvas.ZIndex="1" 
                Margin="48,8,0,0">
            <StackPanel Orientation="Horizontal">
                <Image x:Name="AppFontIcon"
                    HorizontalAlignment="Left" 
                    VerticalAlignment="Center"
                    Source="Assets/Square44x44Logo.png" 
                    Width="16" 
                    Height="16"/>

                <TextBlock x:Name="AppTitle"
                    Text="Project"
                    VerticalAlignment="Center"
                    Margin="12, 0, 0, 0"
                    Style="{StaticResource CaptionTextBlockStyle}" />

            </StackPanel>
        </Border>
        <muxc:NavigationView x:Name="NavigationViewControl"
            IsTitleBarAutoPaddingEnabled="False"            
            IsBackButtonVisible="Visible"           
            Header="Home" 
            DisplayModeChanged="NavigationViewControl_DisplayModeChanged"
            SelectionFollowsFocus="Enabled"
            ItemInvoked="NavigationView_ItemInvoked"
            PaneDisplayMode="Left"
            Canvas.ZIndex="0">
            <muxc:NavigationView.MenuItems>
                <muxc:NavigationViewItem Icon="Home" Content="Home" x:Name="Menu1Item" Tag="Page1"/>
                <muxc:NavigationViewItem Icon="Contact" Content="Account" x:Name="Menu2Item" Tag="Page2"/>
                <muxc:NavigationViewItem Icon="Bullets" Content="Attendance" x:Name="Menu3Item" Tag="Page3"/>
                <muxc:NavigationViewItem Icon="Library" Content="Grades" x:Name="Menu4Item" Tag="Page4"/>
                <muxc:NavigationViewItem Icon="Flag" Content="Grad Reqs" x:Name="Menu5Item" Tag="Page5"/>
            </muxc:NavigationView.MenuItems>
            <Grid Padding="20">
                <Frame x:Name="rootFrame"/>
            </Grid>
        </muxc:NavigationView>
    </Grid>
</Page>

MainPage.xaml.cs:
OnItem已调用:

private void NavigationView_OnItemInvoked(Microsoft.UI.Xaml.Controls.NavigationView sender, Microsoft.UI.Xaml.Controls.NavigationViewItemInvokedEventArgs args)
        {
            FrameNavigationOptions navOptions = new FrameNavigationOptions();
            navOptions.TransitionInfoOverride = args.RecommendedNavigationTransitionInfo;

#pragma warning disable IDE0007 // Use implicit type
            string navItemTag = args.InvokedItemContainer.Tag.ToString();
#pragma warning restore IDE0007 // Use implicit type

            Type pageType = null;
            if (navItemTag == "Page1")
            {
                pageType = typeof(Page1);
            }
            else if (navItemTag == "Page2")
            {
                pageType = typeof(Page2);
            }
            else if (navItemTag == "Page3")
            {
                pageType = typeof(Page3);
            }
            else if (navItemTag == "Page4")
            {
                pageType = typeof(Page4);
            }
            else if (navItemTag == "Page5")
            {
                pageType = typeof(Page5);
            }
            if (pageType == null)
            {
                return;
            }
            rootFrame.NavigateToType(pageType, null, navOptions);
        }
zpjtge22

zpjtge221#

您可以将ItemInvoked事件添加到NavigationView中,在该事件中,您可以简单地获取所选项目的Content。
muxc的using-directive

using muxc = Microsoft.UI.Xaml.Controls;

MainPage.xaml.cs中的事件

private void NavigationView_ItemInvoked(Microsoft.UI.Xaml.Controls.NavigationView sender, Microsoft.UI.Xaml.Controls.NavigationViewItemInvokedEventArgs args)
{
    if (NavigationView.SelectedItem is muxc.NavigationViewItem item)
    {
        sender.Header = item.Content.ToString();
    }
}

添加到NavigationView的事件

<muxc:NavigationView ItemInvoked="NavigationView_ItemInvoked" x:Name="NavigationView">

相关问题