Search code examples
c#wpfxamlgroupboxmaterial-design-in-xaml

Styling WPF - Material Design GroupBox in Code


After quite a bit of searching / trial and error, I must resort to asking for the community's help on this one. I'm working on a WPF application using MaterialDesign framework with custom colors defined in my App.xaml and as provided below:

<Application.Resources>
        <ResourceDictionary>
            <!-- primary -->
            <SolidColorBrush x:Key="PrimaryHueLightBrush" Color="#033059"/><!--5c5b5e-->
            <SolidColorBrush x:Key="PrimaryHueLightForegroundBrush" Color="#FFFFFF"/>
            <SolidColorBrush x:Key="PrimaryHueMidBrush" Color="DarkRed"/> <!--6134d9-->
            <SolidColorBrush x:Key="PrimaryHueMidForegroundBrush" Color="#FFFFFF"/>
            <SolidColorBrush x:Key="PrimaryHueDarkBrush" Color="#48545e"/> <!--4D1DCF-->
            <SolidColorBrush x:Key="PrimaryHueDarkForegroundBrush" Color="#FFFFFF"/>
            <!-- accent -->
            <SolidColorBrush x:Key="SecondaryAccentBrush" Color="#1266a7"/> <!--5c5b5e-->
            <SolidColorBrush x:Key="SecondaryAccentForegroundBrush" Color="#FFFFFF"/>

            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
                <!--<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.Red.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Blue.xaml" />-->
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Button.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.GroupBox.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.DatePicker.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Calendar.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.CheckBox.xaml" />


            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>

There is a need to render certain controls programatically (in code behind) and one of those controls is a GroupBox. This GroupBox is rendered just fine but is styled with the color defined in the PrimaryHueMidBrush. What I would like to accomplish is to assign another (SecondaryAccentBrush) to the GroupBox. In XAML this can be achieved like below:

<Border BorderBrush="{DynamicResource SecondaryAccentBrush}" BorderThickness="2" Padding="10" Height="50" Width="300">
        <TextBlock Text="Material Design Test" />
</Border>

var childDef = new GroupBox()
            {
                Header = "Deficiencies",
                HorizontalAlignment = HorizontalAlignment.Right,
                VerticalAlignment = VerticalAlignment.Top,


                //Background = new SolidColorBrush(Colors.Red)
                //Foreground = new SolidColorBrush(Colors.Red),
                //OverridesDefaultStyle = true
                //Background = Brushes.DarkRed,
                //BorderThickness = new Thickness(1),
                //BorderBrush = new SolidColorBrush(Colors.Red)
            };

            //childDef.SetResourceReference(Control.BorderBrushProperty, "PrimaryHueDarkBrush");
            //childDef.SetResourceReference(Control., materialDesign:ColorZoneAssist.Mode="Accent");

The problem is, that I can't figure out how to achieve this through code. Nothing I try seems to work. I can't figure out how to overide the BorderBrushProperty.

Any help would be much appreciated!

Thanks in advance


Solution

  • TO expand on Mikael's answer, which works just fine when you are not working with Material Design, I was able to get this to work out:

    childDef.Style = Application.Current.FindResource("MaterialDesignGroupBox") as Style;
    

    I'm still in search to find a way to apply MaterialDesign:ColorZoneAssist.Mode="Accent" in code behind as it seems that that is the only way to apply a different color other than the primary MaterialDesign color of the application.