Settings Pane Sample – WinUI 3

Overview

This sample demonstrates how to integrate a Settings Pane in a WinUI 3 desktop application. The pane provides a common UI for navigating app settings such as Account, Appearance, Privacy, and About.

Live Demo

Sample Code

XAML (MainWindow.xaml)

<Window
    x:Class="SettingsPaneSample.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Settings Pane Sample" Height="450" Width="800">
    <Grid>
        <Button Content="Open Settings" Click="OpenSettings_Click" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

C# (MainWindow.xaml.cs)

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;

namespace SettingsPaneSample
{
    public sealed partial class MainWindow : Window
    {
        public MainWindow()
        {
            this.InitializeComponent();
        }

        private void OpenSettings_Click(object sender, RoutedEventArgs e)
        {
            SettingsPane.Instance.Show();
        }
    }

    public sealed class SettingsPane
    {
        private static SettingsPane _instance;
        public static SettingsPane Instance => _instance ??= new SettingsPane();

        public void Show()
        {
            // Implementation would call SettingsFlyout.ShowAsync() in a real WinUI app.
        }
    }
}