WinUI 3 UWP应用：如何为用户提供主题选择功能

当然有可行方案！我帮你梳理一套完整的实现步骤，让你的WinUI 3 UWP应用支持用户自主切换主题，包括跟随系统、浅色、深色三种常见选项：

1. 设计主题选择UI #

先给用户提供选择入口，比如在设置页面添加一组单选按钮或者下拉菜单，示例XAML代码如下：

<RadioButtons x:Name="ThemeRadioButtons" SelectionChanged="ThemeRadioButtons_SelectionChanged">
    <RadioButton Content="跟随系统" Tag="System"/>
    <RadioButton Content="浅色主题" Tag="Light"/>
    <RadioButton Content="深色主题" Tag="Dark"/>
</RadioButtons>

2. 持久化用户主题设置 #

使用UWP的本地存储来保存用户的选择，确保重启应用后设置依然生效：

// 保存主题设置
private void SaveThemeSetting(string theme)
{
    ApplicationData.Current.LocalSettings.Values["AppTheme"] = theme;
}

// 读取已保存的主题设置
private string GetSavedTheme()
{
    if (ApplicationData.Current.LocalSettings.Values.TryGetValue("AppTheme", out var value) && value is string theme)
    {
        return theme;
    }
    // 默认返回跟随系统
    return "System";
}

3. 应用主题设置 #

应用启动时加载主题 #

在App.xaml.cs的OnLaunched方法中，读取保存的设置并应用主题：

protected override void OnLaunched(LaunchActivatedEventArgs args)
{
    var savedTheme = GetSavedTheme();
    switch (savedTheme)
    {
        case "Light":
            RequestedTheme = ApplicationTheme.Light;
            break;
        case "Dark":
            RequestedTheme = ApplicationTheme.Dark;
            break;
        default:
            RequestedTheme = ApplicationTheme.Default; // 跟随系统
            break;
    }

    // 其他启动逻辑...
}

动态切换主题（无需重启） #

如果要让用户在应用运行时切换主题立即生效，可以直接设置当前窗口根元素的RequestedTheme属性：

private void ThemeRadioButtons_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (ThemeRadioButtons.SelectedItem is RadioButton selectedBtn && selectedBtn.Tag is string theme)
    {
        SaveThemeSetting(theme);
        
        // 获取当前窗口的根元素
        var rootElement = Window.Current.Content as FrameworkElement;
        if (rootElement != null)
        {
            switch (theme)
            {
                case "Light":
                    rootElement.RequestedTheme = ElementTheme.Light;
                    break;
                case "Dark":
                    rootElement.RequestedTheme = ElementTheme.Dark;
                    break;
                default:
                    rootElement.RequestedTheme = ElementTheme.Default;
                    break;
            }
        }
    }
}

4. 关键注意事项 #

• 确保你的应用中所有控件的样式都使用了ThemeResource（比如{ThemeResource ButtonBackground}），而不是硬编码的颜色值，这样切换主题时控件样式才能自动更新。
• ApplicationTheme.Default对应跟随系统主题，当系统主题变化时，应用也会同步更新（如果用户选择了“跟随系统”选项）。

内容的提问来源于stack exchange，提问作者Luís