Fluent AcrylicBrush 不会在浅色、深色、主题等之间切换. UWP

本文介绍了Fluent AcrylicBrush 不会在浅色、深色、主题等之间切换. UWP的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

Defined Light 主题 ( TintColor="Red"/>)、Dark、( TintColor="Orange"/>) 在 App.xaml 中.根据这篇文章，希望这能解决您的问题.

Defined Light theme (<AcrylicBrush TintColor="Red"/>), Dark, (<AcrylicBrush TintColor="Orange"/>) in App.xaml. Per this post, Changing UWP project's Target Version from 1803 to 1809 disables NavigationView's Acrylic texture - why?, I added the following to ShellPage.xaml. The expected behavior when I toggle between Light and Dark theme is that the app NavigationView control will have an AcrylicBrush tint that toggles between Red and Orange. In the definition below, actual behavior is it stays Orange.

ShellPage.xaml:

<Page.Resources>
    <StaticResource  x:Key="NavigationViewExpandedPaneBackground"
                     ResourceKey="MyAcrylicBrush"/>
</Page.Resources>

App.xaml:

<Application
x:Class="TEST.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.ThemeDictionaries>
            <ResourceDictionary x:Key="Default">
                <AcrylicBrush x:Key="MyAcrylicBrush"
                              BackgroundSource="HostBackdrop"
                              TintColor="Green"
                              TintOpacity="0.8" />
                <AcrylicBrush x:Key="NavigationViewDefaultPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Green"
                              TintOpacity="0.8" />
                <AcrylicBrush x:Key="NavigationViewTopPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Green"
                              TintOpacity="0.8" />
                <AcrylicBrush x:Key="NavigationViewExpandedPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Green"
                              TintOpacity="0.8" />
            </ResourceDictionary>
            <ResourceDictionary x:Key="Dark">
                <AcrylicBrush x:Key="MyAcrylicBrush"
                              BackgroundSource="HostBackdrop"
                              TintColor="Orange"
                              TintOpacity="0.8" />
                <AcrylicBrush x:Key="NavigationViewDefaultPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Orange"
                              TintOpacity="0.8" />
                <AcrylicBrush x:Key="NavigationViewTopPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Orange"
                              TintOpacity="0.8" />
                <AcrylicBrush x:Key="NavigationViewExpandedPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Orange"
                              TintOpacity="0.8" />
            </ResourceDictionary>
            <ResourceDictionary x:Key="Light">
                <AcrylicBrush x:Key="MyAcrylicBrush"
                              BackgroundSource="HostBackdrop"
                              TintColor="Red"
                              TintOpacity="1"/>
                <AcrylicBrush x:Key="NavigationViewDefaultPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Red"
                              TintOpacity="1" />
                <AcrylicBrush x:Key="NavigationViewTopPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Red"
                              TintOpacity="1" />
                <AcrylicBrush x:Key="NavigationViewExpandedPaneBackground"
                              BackgroundSource="HostBackdrop"
                              TintColor="Red"
                              TintOpacity="1"/> 
            </ResourceDictionary>
        </ResourceDictionary.ThemeDictionaries>
    </ResourceDictionary>
</Application.Resources>
</Application>

解决方案

You can directly give the Key(NavigationViewExpandedPaneBackGround) to your AcrylicBrush. So it will change your navigation view background.

  <Page.Resources>
      <ResourceDictionary>
            <ResourceDictionary.ThemeDictionaries>
                <ResourceDictionary x:Key="Light">
                    <AcrylicBrush x:Key="NavigationViewExpandedPaneBackground" BackgroundSource="HostBackdrop" TintColor="{ThemeResource SystemAccentColorDark1}" FallbackColor="{ThemeResource SystemAccentColorDark1}" TintOpacity="0.80"/>   
                </ResourceDictionary>
                <ResourceDictionary x:Key="Dark">
                    <AcrylicBrush x:Key="NavigationViewExpandedPaneBackground" BackgroundSource="HostBackdrop" TintColor="{ThemeResource SystemAltHighColor}" FallbackColor="#333333" TintOpacity="0.50"/>
                </ResourceDictionary>
            </ResourceDictionary.ThemeDictionaries>
        </ResourceDictionary>
</Page.Resources>

Hope this solves your problem.

                        这篇关于Fluent AcrylicBrush 不会在浅色、深色、主题等之间切换. UWP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！