UWP 的 SettingsFlyout（Windows 10）

Question

我目前正在开发一个 UWP(windows 10) 应用程序，我一直在为我的应用程序开发一个设置面板。

我了解到 UWP 不再有像这样的 SettingsFlyout windows 10

不过，我真的很喜欢它的外观和感觉。因此，有什么方法可以开发 uwp 的 settingflyout 吗？

Answer 1

我没有给你完整的代码，但我希望这能给你正确的方向：

设计类似于“设置”弹出按钮的网格布局。
使用PaneThemeTransition使动画正确
Add/Remove 网格编程。

Answer 2

您可以使用 SplitView control 并将其 DisplayMode 属性设置为 Overlay 并将 PanePlacement 属性设置为 Right.

<SplitView x:Name="SV_SettingsMenu"
           DisplayMode="Overlay"
           PanePlacement="Right"
           >
    <SplitView.Pane>
        <StackPanel>
            <Button Content="Button 1" HorizontalAlignment="Stretch"/>
            <Button Content="Button 2" HorizontalAlignment="Stretch"/>
            <Button Content="Button 3" HorizontalAlignment="Stretch"/>
        </StackPanel>
    </SplitView.Pane>

    <StackPanel Padding="10">
        <Button Click="ToggleSettings">
            <SymbolIcon Symbol="Setting"/>
        </Button>

        <TextBlock Text="Content"/>
    </StackPanel>
</SplitView>


private void ToggleSettings(object sender, RoutedEventArgs e)
{
    SV_SettingsMenu.IsPaneOpen = !SV_SettingsMenu.IsPaneOpen;
}

UWP 的 SettingsFlyout（Windows 10）

SettingsFlyout for UWP (Windows 10)

flyout

windows-10

uwp