spiegelp / MaterialDesignExtensions

Material Design Extensions is based on Material Design in XAML Toolkit to provide additional controls and features for WPF apps
https://spiegelp.github.io/MaterialDesignExtensions/
MIT License
766 stars 123 forks source link

MaterialDesignTabControl sets wrong foreground color for content when dark theme used #155

Open josh2112 opened 3 years ago

josh2112 commented 3 years ago

In MaterialDesignInXAML, text-based elements can be made to use a lighter color in a dark theme by setting TextElement.Foreground="{DynamicResource MaterialDesignBody}" on the window.

Something about the MaterialDesignTabControl style breaks this. The setup is very simple. Create a minimal project with MaterialDesignInXAML and MaterialDesignExtensions and set a BundledTheme in App.xaml. Then replace MainWindow.xaml with the following:

<Window x:Class="MDIXTabItemThemeBug.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        TextElement.Foreground="{DynamicResource MaterialDesignBody}"
        Background="{DynamicResource MaterialDesignPaper}">

    <StackPanel>
        <TextBlock Text="what color is this?"/>
        <TabControl Style="{StaticResource MaterialDesignTabControl}">
            <TabItem Header="Tab 1">
                <TextBlock Text="what color is this?"/>
            </TabItem>
        </TabControl>
    </StackPanel>
</Window>

Run the project with BundledTheme set to a light theme, then to a dark theme. In both cases, the text outside the tab uses the correct color (dark on the light theme and light on the dark theme), but the text inside the tab stays dark.

I can fix this by making my own copy of MaterialDesignTabControl and adding this inside the TabItem Style:

<Setter Property="TextElement.Foreground" Value="{DynamicResource MaterialDesignBody}"/>

But I'm not sure it's the correct solution.