如何使用 UWP 在 NavigationView 中添加按钮？

Question

我正在实现一个 NavigationView ，如本主题所述。

在导航项（NavigationViewItem）之间，我需要添加一个简单的按钮，它只会执行一个动作，它不会在任何地方导航。

我添加到导航的每个控件都会在单击时接收到保持选中状态的属性，但我需要一个不会取消选择当前导航的控件，只需执行一个操作。

有谁知道如何做到这一点或可以提出解决方案？ 感激的。

Answer 1

但我需要一个不会取消选择当前导航的控件，只需执行一个操作。

当然，您可以编辑默认 NavigationView 样式并将按钮插入到PaneContentGrid中，您可以从 generic.xaml 文件中获取默认NavigationView样式，然后找到PaneContentGrid添加按钮，如下所示（ InsertButton ）。

<SplitView.Pane>
    <Grid x:Name="PaneContentGrid" Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.LeftPaneVisibility}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="0" />
            <!--  above button margin + back button space  -->
            <RowDefinition x:Name="PaneContentGridToggleButtonRow" Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="8" />
            <!--  above list margin  -->
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="8" />
        </Grid.RowDefinitions>

        <Grid x:Name="ContentPaneTopPadding" Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.TopPadding}" />

        <Grid Grid.Row="2" Height="{StaticResource PaneToggleButtonHeight}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="{ThemeResource PaneToggleButtonWidth}" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <ContentControl
                x:Name="PaneHeaderContentBorder"
                Grid.Column="1"
                HorizontalContentAlignment="Stretch"
                VerticalContentAlignment="Stretch"
                IsTabStop="False" />
        </Grid>

        <Grid
            x:Name="AutoSuggestArea"
            Grid.Row="3"
            Height="{ThemeResource NavigationViewTopPaneHeight}"
            VerticalAlignment="Center">

            <ContentControl
                x:Name="PaneAutoSuggestBoxPresenter"
                Margin="{ThemeResource NavigationViewAutoSuggestBoxMargin}"
                HorizontalContentAlignment="Stretch"
                VerticalContentAlignment="Center"
                IsTabStop="False" />

            <Button
                x:Name="PaneAutoSuggestButton"
                Width="{TemplateBinding CompactPaneLength}"
                Style="{ThemeResource NavigationViewPaneSearchButtonStyle}"
                Visibility="Collapsed" />
        </Grid>

        <ContentControl
            x:Name="PaneCustomContentBorder"
            Grid.Row="4"
            HorizontalContentAlignment="Stretch"
            VerticalContentAlignment="Stretch"
            IsTabStop="False" />

        <!--  Left nav list  -->
        <NavigationViewList
            x:Name="MenuItemsHost"
            Grid.Row="6"
            Margin="0,0,0,20"
            HorizontalAlignment="Stretch"
            IsItemClickEnabled="True"
            ItemContainerStyle="{TemplateBinding MenuItemContainerStyle}"
            ItemContainerStyleSelector="{TemplateBinding MenuItemContainerStyleSelector}"
            ItemTemplate="{TemplateBinding MenuItemTemplate}"
            ItemTemplateSelector="{TemplateBinding MenuItemTemplateSelector}"
            SelectedItem="{TemplateBinding SelectedItem}"
            SelectionMode="Single"
            SingleSelectionFollowsFocus="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.SingleSelectionFollowsFocus}" />

        <ContentControl
            x:Name="FooterContentBorder"
            Grid.Row="7"
            HorizontalContentAlignment="Stretch"
            VerticalContentAlignment="Stretch"
            IsTabStop="False" />
        <Button Grid.Row="7" Content="Command"  x:Name="InsertButton"/>
        <NavigationViewItem
            x:Name="SettingsNavPaneItem"
            Grid.Row="8"
            Icon="Setting" />
    </Grid>
</SplitView.Pane>

如果您不想编辑样式，也可以将按钮插入 NavigationView PaneFooter，如下所示

<NavigationView x:Name="nvSample">
    <NavigationView.MenuItems>
        <NavigationViewItem
            Content="Menu Item1"
            Icon="Play"
            Tag="SamplePage1" />
        <NavigationViewItem
            Content="Menu Item2"
            Icon="Save"
            Tag="SamplePage2" />
        <NavigationViewItem
            Content="Menu Item3"
            Icon="Refresh"
            Tag="SamplePage3" />
        <NavigationViewItem
            Content="Menu Item4"
            Icon="Download"
            Tag="SamplePage4" />
    </NavigationView.MenuItems>
    <Frame x:Name="contentFrame" />
    <NavigationView.PaneFooter>
        <Button Content="Click"/>
    </NavigationView.PaneFooter>
</NavigationView>