创建一个设置页面，如 uwp 电子邮件应用程序之一答案

【问题标题】：Create a settings page like the uwp email app one创建一个设置页面，如 uwp 电子邮件应用程序之一
【发布时间】：2018-09-14 04:53:51
【问题描述】：

我想创建一个设置页面，就像 uwp 电子邮件应用程序中使用的那样：

我想要一些像第一张图片一样的常规设置，所以当我点击其中任何一个时，页面会导航到所选设置。

目前我在我的 MainPage.xaml 中使用导航视图，如下所示：

   <Page
       x:Class="TestApp.UWP.MainPage"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:local="using:TestApp.UWP"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       x:Name="MainContentPage"
       Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
       DataContext="{Binding Home, Source={StaticResource Locator}}"
       mc:Ignorable="d">

        <NavigationView
            x:Name="NavigationView"
            Background="{ThemeResource SystemControlBaseLowAcrylicWindowBrush}"
            CompactModeThresholdWidth="1280"
            ExpandedModeThresholdWidth="1280"
            IsBackButtonVisible="Collapsed"
            IsBackEnabled="False"
            IsSettingsVisible="True"
            MenuItemsSource="{Binding NavigationItems, Mode=OneWay}"
            SelectedItem="{Binding SelectedItem, Mode=TwoWay}">
            <NavigationView.PaneFooter>
                <StackPanel>
                    <Button
                        HorizontalAlignment="Stretch"
                        HorizontalContentAlignment="Stretch"
                        Background="Transparent"
                        Command="{Binding LogoutCommand}"
                        ToolTipService.ToolTip="Sign out">
                        <Grid Height="40" Margin="-9,0,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="48" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <SymbolIcon
                                Grid.Column="0"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                Symbol="People" />
                            <TextBlock
                                Grid.Column="1"
                                HorizontalAlignment="Left"
                                VerticalAlignment="Center"
                                Text="Sign out" />
                        </Grid>
                    </Button>
                </StackPanel>
            </NavigationView.PaneFooter>
        </NavigationView>
    </Page>

我在想我可以使用一个包含常规设置按钮和某种绑定到它们的命令/事件的框架，所以当我点击其中任何一个时，命令/事件将调用Frame.Navigate(pageType) 方法

问题/疑问是：

我不知道如何将主框架放在右侧
要仅在单击导航视图设置按钮后显示框架，我应该使用 Visibility 属性吗？
单击窗口内的任何部分后如何关闭设置？（框架本身除外）
我应该使用框架还是有其他更好的选择？

任何帮助将不胜感激

【问题讨论】：

标签： c# xaml uwp

【解决方案1】：

使用SplitView怎么样？它专为这项任务而设计。

使用 PanePlacement 属性
使用 IsPaneOpen 属性
这是拆分视图的默认行为（覆盖模式）

【讨论】：

非常感谢，这正是我想要的