为TabControl自定义Material Design颜色后,非激活TabItem标题消失求助
问题:Material Design自定义颜色后TabControl非激活TabItem标题消失
我在WPF中使用Material Design时,最初采用默认颜色配置:
<Application.Resources> <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <materialDesign:BundledTheme BaseTheme="Light" PrimaryColor="DeepOrange" SecondaryColor="Amber" /> <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" /> </ResourceDictionary.MergedDictionaries> </ResourceDictionary> </Application.Resources>
之后按照官方Wiki的《Custom Colors》指南修改为自定义颜色配置:
<Application.Resources> <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <materialDesign:BundledTheme BaseTheme="Light" /> <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" /> </ResourceDictionary.MergedDictionaries> <SolidColorBrush x:Key="SecondaryHueLightBrush" Color="#92c9a6"/> <SolidColorBrush x:Key="SecondaryHueLightForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="SecondaryHueMidBrush" Color="#1C8875"/> <SolidColorBrush x:Key="SecondaryHueMidForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="SecondaryHueDarkBrush" Color="#0b4d49"/> <SolidColorBrush x:Key="SecondaryHueDarkForegroundBrush" Color="#FFFFFF"/> <!-- accent --> <SolidColorBrush x:Key="PrimaryHueLightBrush" Color="#6F91B2"/> <SolidColorBrush x:Key="PrimaryHueLightForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="PrimaryHueMidBrush" Color="#104F7A"/> <SolidColorBrush x:Key="PrimaryHueMidForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="PrimaryHueDarkBrush" Color="#0D3351"/> <SolidColorBrush x:Key="PrimaryHueDarkForegroundBrush" Color="#FFFFFF"/> </ResourceDictionary> </Application.Resources>
配置更新后,应用整体颜色正常修改,但TabControl中的非激活TabItem标题消失(比如"Scan History"标签)。相关TabControl代码如下:
<TabControl Name="AppTabs" Grid.Row="0" Grid.Column="0"> <TabItem Header="Scan Configuration"> </TabItem> <TabItem Header="Scan History"> </TabItem> </TabControl>
请问是操作有误还是遗漏了什么配置?
解决方案
问题出在自定义颜色时,仅覆盖了Primary和Secondary色系的核心Brush,但Material Design的非激活TabItem标题依赖全局基础文本颜色资源。当你只指定BaseTheme="Light"而不设置Primary/SecondaryColor时,BundledTheme没有自动初始化所有必要的全局文本颜色,导致非激活TabItem的文本颜色与背景色一致,从而看起来“消失”了。
解决方法是在Application.Resources中补充基础文本颜色资源,添加以下Brush定义:
<!-- 补充Light主题下的全局文本颜色 --> <SolidColorBrush x:Key="MaterialDesignBody" Color="#212121"/> <SolidColorBrush x:Key="MaterialDesignForeground" Color="#212121"/> <SolidColorBrush x:Key="MaterialDesignText" Color="#212121"/>
将这些代码添加到自定义Brush的下方,完整配置如下:
<Application.Resources> <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <materialDesign:BundledTheme BaseTheme="Light" /> <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" /> </ResourceDictionary.MergedDictionaries> <SolidColorBrush x:Key="SecondaryHueLightBrush" Color="#92c9a6"/> <SolidColorBrush x:Key="SecondaryHueLightForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="SecondaryHueMidBrush" Color="#1C8875"/> <SolidColorBrush x:Key="SecondaryHueMidForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="SecondaryHueDarkBrush" Color="#0b4d49"/> <SolidColorBrush x:Key="SecondaryHueDarkForegroundBrush" Color="#FFFFFF"/> <!-- accent --> <SolidColorBrush x:Key="PrimaryHueLightBrush" Color="#6F91B2"/> <SolidColorBrush x:Key="PrimaryHueLightForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="PrimaryHueMidBrush" Color="#104F7A"/> <SolidColorBrush x:Key="PrimaryHueMidForegroundBrush" Color="#FFFFFF"/> <SolidColorBrush x:Key="PrimaryHueDarkBrush" Color="#0D3351"/> <SolidColorBrush x:Key="PrimaryHueDarkForegroundBrush" Color="#FFFFFF"/> <!-- 补充全局文本颜色资源 --> <SolidColorBrush x:Key="MaterialDesignBody" Color="#212121"/> <SolidColorBrush x:Key="MaterialDesignForeground" Color="#212121"/> <SolidColorBrush x:Key="MaterialDesignText" Color="#212121"/> </ResourceDictionary> </Application.Resources>
补充后,非激活TabItem的标题会使用深色文本(与Light主题背景区分),恢复正常显示。
内容的提问来源于stack exchange,提问作者Gerard van den Bosch
相关产品推荐
相关产品推荐

