Question

我想创建一个设置页面，如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)方法

问题/怀疑是：

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

任何帮助将不胜感激

Answer 1

使用SplitView怎么样？正是为此任务而设计的。

使用PanePlacement属性
使用IsPaneOpen属性
这是splitview（覆盖模式）的默认行为

创建一个类似于uwp电子邮件应用程序的设置页面

1 个答案: