Styling the Column Headers - with theme

[Tim]

I am attempting to customize the column headers for RadGridView, but am running into a problem where the template generated in Blend is not based on my selected theme. I have assigned the Windows7Theme to the GridViewHeaderCell before editing the template and have also assigned the theme to the RadGridView itself, but the header cells use the office black theme instead. I am following the instructions found here: http://www.telerik.com/help/wpf/gridview-styling-column-headers.html

My goal is to add a button to the header. I do not wish to alter the style/theme other than that. If there is another way to accomplish this, or a way to edit the header cell template that will respect the theme, I would be interested to know how. Thank you!

I am using Visual Studio 2012 and Expression Blend 4.

I have attached a screenshot of the resulting gridview. Here is the XAML:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    x:Class="WpfApplication1.MainWindow"
    x:Name="TheWindow"
    Title="MainWindow"
    Width="640" Height="480">
    <Window.Resources>
        <Style x:Key="GridViewHeaderCellStyle1" TargetType="{x:Type telerik:GridViewHeaderCell}">
            <!-- Auto-generated template content removed for sake of brevity -->
            <Setter Property="Background">
                <Setter.Value>
           <!-- Note the colors here, they are the office black theme colors that have been hard coded into the template. Remnants of the office black theme are found throughout the auto-generated template -->
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF5B5B5B" Offset="1"/>
                        <GradientStop Color="#FF868686"/>
                        <GradientStop Color="#FF4F4F4F" Offset="0.42"/>
                        <GradientStop Color="#FF0E0E0E" Offset="0.43"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
            <Setter Property="BorderBrush" Value="#FF848484"/>
            <Setter Property="BorderThickness" Value="0,0,1,1"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="Padding" Value="5,0,3,0"/>
            <Setter Property="DropIndicatorBrush" Value="White"/>
            <Setter Property="DropIndicatorThickness" Value="2"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="SnapsToDevicePixels" Value="True"/>
        </Style>
    </Window.Resources>

    <Grid>
     <!-- GridViewHeaderCell used for editing template -->
        <telerik:GridViewHeaderCell telerik:StyleManager.Theme="Windows7" Style="{DynamicResource GridViewHeaderCellStyle1}" />

        <telerik:RadGridView AutoGenerateColumns="False">
            <telerik:StyleManager.Theme>
                <telerik:Windows7Theme/>
            </telerik:StyleManager.Theme>
            <telerik:RadGridView.Columns>
                <telerik:GridViewDataColumn Header="ID3" HeaderCellStyle="{DynamicResource GridViewHeaderCellStyle1}" />
            </telerik:RadGridView.Columns>

        </telerik:RadGridView>
    </Grid>
</Window>

[Matt]

Why not start from setting the theme for the entire app in the MainWindow class (or whatever you may have renamed it) as seen in the C# portion here:
http://www.telerik.com/help/wpf/common-styling-apperance-setting-theme-wpf.html

And then you won't have to worry about the custom styling, or am I missing something?

[Yoan]

Hello Tim,

Generally, the styles used in our themes are theme specific. Thus, you should predefine the template of GridViewHeaderCell against each theme. You can manually extract the template for the GridViewHeaderCell that is available with the installation files of the RadControls. You can find it together with all the other templates used for the GridView inside "Telerik.Windows.Controls.GridView.xaml" file browsing to "InstallationFolder\WPF\Themes\OfficeBlack(or Windows7/ Windows8 )\Themes" folder.

However, you can check this help article on how to place a button in GridViewHeaderCell.

I hope this information helps.

Regards,
Yoan
Telerik