WPF: Style.Setter Changes ComboBox Colors, Won't Change Back

Question

I've got a ComboBox I'm hiding and showing with a Style.Setter on the Visibility property:

<ComboBox ItemsSource="{Binding ElementName=BVTWindow, Path=DataContext.AreaList}" SelectedItem="{Binding Path=Area}">
    <ComboBox.Style>
        <Style TargetType="{x:Type ComboBox}">
            <Style.Setters>
                <Setter Property="Visibility" Value="Collapsed" />
            </Style.Setters>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=BVTWindow, Path=DataContext.IdentitySelection}" Value="Test Management">
                    <Setter Property="Visibility" Value="Visible" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ComboBox.Style>
</ComboBox>

This works great. Unfortunately, applying the style setter (for some reason) removes the color theme from the ComboBox. Now it's a light grey box with white text and nearly unreadable.

I tried adding Foreground and Background attributes to the ComboBox tag, but it had no effect.

I also tried adding Setter Properties for Foreground and Background to the DataTrigger, also with no effect.

I need to either stop the theme from being removed from the box, manually set the text color, or manually set the background color.

I read one article saying that Windows 8 (which is what I'm using) interferes with ComboBox styling, but there wasn't an easily-understandable solution for it.

Any advice would help me out a lot. Thanks in advance.

Answer 1

This articles explains it pretty well:

http://social.technet.microsoft.com/wiki/contents/articles/24240.changing-the-background-color-of-a-combobox-in-wpf-on-windows-8.aspx

Basically, Windows 8 has a different setup for ComboBox, and it breaks some of the style attributes. You can still style it, but you've got to right click the ComboBox and pick "edit template". This will generate a massive amount of xaml in your project view (color schemes for every possible combination of states), but you probably don't need all of it. I played with commenting / uncommenting sections to figure out what each Trigger and Setter affected, then set my colors and killed the extra parts.

Answer 2

I have a new solution that's much cleaner, faster, easier and better-looking than my previous idea:

Just wrap the ComboBox in a WrapPanel or StackPanel and apply the Style Setter to the parent. The control will retain it's proper style and the parent panel should be transparent anyway, so styles won't matter there. Worst case, you've got a WrapPanel with only one item in it and two extra lines of code in the xaml. This will work with other controls as well, as I just had to do it with a Checkbox.

Here's an example:

<WrapPanel>
    <WrapPanel.Style>
        <Style TargetType="{x:Type WrapPanel}">
            <Setter Property="Visibility" Value="Collapsed"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataContext.TesterIdentitySelection.CanEdit, ElementName=BVTWindow}" Value="true">
                    <Setter Property="Visibility" Value="Visible"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </WrapPanel.Style>
    <ComboBox ItemsSource="{Binding Path=DataContext.AreaList, ElementName=BVTWindow}" DisplayMemberPath="Name" SelectedItem="{Binding Path=Area, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" ToolTip="Select the testing area."/>
</WrapPanel>

The combo box is inside the wrap panel, and the wrap panel is what has the show/hide behavior applied to it. Since the wrap panel doesn't really have any style itself (just an invisible holder), everything ends up looking great.