XAML 如何设置一些颜色,以考虑暗/亮模式切换?

r9f1avp5  于 2023-08-01  发布在  其他
关注(0)|答案(2)|浏览(129)

我用模板创建了一个WinUI 3项目。它提供了使用ElementTheme.Dark/ElementTheme.Light在黑暗和光明模式之间切换的能力。例如,我如何为StackPanel设置一个与其周围的StackPanel略有不同的背景色,而不总是通过额外的代码考虑切换?比如说我试过

<StackPanel Background="{ThemeResource SystemAccentColorLight2}">

字符串
但在暗模式下不改变其颜色。

dced5bon

dced5bon1#

您可以创建一个ThemeResource,比方说 CustomStackPanelBackground
例如,在整个应用程序的App.xaml中:

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
            <ResourceDictionary Source="/Styles/FontSizes.xaml" />
            <ResourceDictionary Source="/Styles/Thickness.xaml" />
            <ResourceDictionary Source="/Styles/Styles.xaml" />
            <ResourceDictionary Source="/Styles/TextBlocks.xaml" />
            <ResourceDictionary>
                <ResourceDictionary.ThemeDictionaries>
                    <ResourceDictionary x:Key="Light">
                        <SolidColorBrush
                            x:Key="CustomBackground"
                            Color="HotPink" />
                    </ResourceDictionary>
                    <ResourceDictionary x:Key="Dark">
                        <SolidColorBrush
                            x:Key="CustomBackground"
                            Color="SkyBlue" />
                    </ResourceDictionary>
                </ResourceDictionary.ThemeDictionaries>
            </ResourceDictionary>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

字符串
或者如果您只想在Page中使用它:

<Page.Resources>
    <ResourceDictionary>
        <ResourceDictionary.ThemeDictionaries>
            <ResourceDictionary x:Key="Light">
                <SolidColorBrush
                    x:Key="CustomBackground"
                    Color="LightGreen" />
            </ResourceDictionary>
            <ResourceDictionary x:Key="Dark">
                <SolidColorBrush
                    x:Key="CustomBackground"
                    Color="SkyBlue" />
            </ResourceDictionary>
        </ResourceDictionary.ThemeDictionaries>
    </ResourceDictionary>
</Page.Resources>


实际上是这样使用的:

<Grid Background="{ThemeResource CustomBackground}">
...
</Grid>

scyqe7ek

scyqe7ek2#

您需要定义主题相关画笔。通过在“Light”和“Dark”资源字典中定义相同的名称,
当此画笔应用于XAML元素时,其颜色由当前主题在运行时确定,如下表所示。
例如,microsoft-ui-xaml/dev/NavigationView /NavigationView_rs1_themeresources_v1.xaml。

相关问题