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

Question

我正在实现 NavigationView，如 this 主题所述。

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

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

有谁知道该怎么做或可以提出解决方案吗？感激不尽

Answer 1

but I need a control that doesn't deselect the current nav, just execute an action.

当然，您可以编辑默认的 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>

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

How to add a button in a NavigationView using UWP?

c#

windows

xaml

visual-studio

uwp