You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

为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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.20 15:40:01