如何在WinUI包中正确使用自定义默认Button样式

问题描述 #

我定义了如下ResourceDictionary作为Button的默认样式：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">

    <Style TargetType="Button">

        <Setter Property="VerticalAlignment"
                Value="Stretch" />
        <Setter Property="Background"
                Value="RoyalBlue" />
    </Style>
</ResourceDictionary>

原UWP环境下合并到App.xaml可正常生效，但切换为WinUI 2.8.2包后默认样式失效。尝试在App.xaml内直接定义样式：

<Application x:Class="EroMangaManager.UWP.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:muxc="using:Microsoft.UI.Xaml.Controls">
    <Application.Resources>
        <Style TargetType="Button">
            <Setter Property="Background"
                    Value="RoyalBlue" />
        </Style>
        <muxc:XamlControlsResources x:Key="de">
            <muxc:XamlControlsResources.MergedDictionaries>
                <ResourceDictionary Source="ResourceDictionarys/DefaultControlStyle.xaml" />
            </muxc:XamlControlsResources.MergedDictionaries>
        </muxc:XamlControlsResources>
    </Application.Resources>
</Application>

编译通过，但运行时Page构造函数中this.InitializeComponent()会抛出异常，请问如何在WinUI包中正确使用自定义默认Button样式？

解决方案 #

核心原因 #

WinUI 2的XamlControlsResources要求作为Application.Resources的唯一直接子元素，所有自定义资源必须合并到它的MergedDictionaries中，直接在Application.Resources下定义样式会破坏资源加载顺序，引发初始化异常。

正确实现步骤 #

方式1：使用独立ResourceDictionary

1. 保留已定义的DefaultControlStyle.xaml不变；
2. 修改App.xaml结构，确保XamlControlsResources是唯一直接子元素，并合并自定义资源：

<Application x:Class="EroMangaManager.UWP.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:muxc="using:Microsoft.UI.Xaml.Controls">
    <Application.Resources>
        <muxc:XamlControlsResources>
            <muxc:XamlControlsResources.MergedDictionaries>
                <!-- 若需基于WinUI默认样式修改，可先添加默认资源（可选） -->
                <!-- <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/Themes/themeresources.xaml" /> -->
                <!-- 加载自定义资源字典 -->
                <ResourceDictionary Source="ResourceDictionarys/DefaultControlStyle.xaml" />
            </muxc:XamlControlsResources.MergedDictionaries>
        </muxc:XamlControlsResources>
    </Application.Resources>
</Application>

方式2：直接在App.xaml内定义样式

无需单独的ResourceDictionary，将样式放在XamlControlsResources.MergedDictionaries内部的ResourceDictionary中：

<Application x:Class="EroMangaManager.UWP.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:muxc="using:Microsoft.UI.Xaml.Controls">
    <Application.Resources>
        <muxc:XamlControlsResources>
            <muxc:XamlControlsResources.MergedDictionaries>
                <ResourceDictionary>
                    <Style TargetType="Button">
                        <Setter Property="VerticalAlignment" Value="Stretch" />
                        <Setter Property="Background" Value="RoyalBlue" />
                    </Style>
                </ResourceDictionary>
            </muxc:XamlControlsResources.MergedDictionaries>
        </muxc:XamlControlsResources>
    </Application.Resources>
</Application>

关键注意事项 #

• 不要给XamlControlsResources设置x:Key，它是全局资源容器，不需要命名；
• 自定义资源需在WinUI默认资源之后加载（若依赖默认样式），确保自定义样式能覆盖默认值；
• 所有全局资源都必须放在XamlControlsResources.MergedDictionaries中，不能直接作为Application.Resources的子元素。

内容的提问来源于stack exchange，提问作者大江东去fff