Problem with header in Office2013 theme

[Patrick]

Hello,
the Office2013 theme corrects the text of the header so that they are in uppercase.
This work correctly when we just set the header as a text, but not if we want to customize it, for example to add an image or something else. It seems that the theme takes the Text property of the header content, converts it to uppercase and use the result to display in the header. If the header content doesn't contain a Text property, nothing is displayed.

To see this in action, just create a WPF application, add the relevent assemblies and replace MainWindow.xaml with:

<Window
  x:Class="Test_GridView_header_Office2013.MainWindow"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:tk="http://schemas.telerik.com/2008/xaml/presentation"
  Title="MainWindow" Height="350" Width="525">
  <tk:RadGridView Margin="10">

    <tk:RadGridView.Columns>

      <tk:GridViewDataColumn Header="Direct text" />

      <tk:GridViewDataColumn>
        <tk:GridViewDataColumn.Header>
          <StackPanel>
            <TextBlock Text="Header with a stack panel" />
          </StackPanel>
        </tk:GridViewDataColumn.Header>
      </tk:GridViewDataColumn>

    </tk:RadGridView.Columns>

  </tk:RadGridView>
</Window>

If you run the application, you will see that the first header is displayed, but not the second one...
In all other themes I tested, including Windows8, both headers are displayed.

To correct the problem, I think that the best solution is to check whether the header has a Text proprty. If there is none, you should display the header as defined by the user, without changing it.

Patrick

[Vanya Pavlova]

Hi Patrick,

 
Thank you for pointing this out! Following the design guidelines for Office2013 theme we added upper cased header. If you take a look at the template of GridViewHeaderCell you can see the following Binding:

<ContentControl x:Name="ContentPresenter" Foreground="{TemplateBinding Foreground}"
                         Style="{StaticResource StretchedContentControl}" Margin="{TemplateBinding Padding}"
                         IsTabStop="{TemplateBinding IsTabStop}"  Content="{Binding Content.Text,Converter={StaticResource UppercaseConverter},RelativeSource={RelativeSource TemplatedParent}}"
                         ContentTemplate="{TemplateBinding ContentTemplate}"
                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />

During the implementation process we hit several platform specific issues and by that reason we used direct text binding for the Content of GridViewHeaderCells. Currently I may suggest you to predefine the template of GridViewHeaderCell against Office2013 theme, remove this Binding from the template and move it to the text elements of your custom headers. Then the images and any non-string content will be correctly displayed.


Please excuse us for any inconvenience caused!     


Regards,
Vanya Pavlova
Telerik

[Patrick]

Hello Vanya,
my application should have the possibility to change the theme dynamically, so changing the template of the header cell is not an option. Setting the header content by code, and checking whether it is a string or another object, should do the trick easily.

<ContentControl Name="ContentPresenter"
                Foreground="{TemplateBinding Foreground}"
                Style="{StaticResource StretchedContentControl}"
                Margin="{TemplateBinding Padding}"
                IsTabStop="{TemplateBinding IsTabStop}"
               ContentTemplate="{TemplateBinding ContentTemplate}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}">
  <ContentControl.Content>
    <Grid>
      <TextBlock Name="TextContent"
                 Text="{Binding Content.Text,Converter={StaticResource UppercaseConverter},RelativeSource={RelativeSource TemplatedParent}}" />
      <ContentPresenter Name="ObjectContent" />
    </Grid>
  </ContentControl.Content>
</ContentControl>

I really think that it's not the Telerik problem to convert the text to uppercase, but the application problem.
Patrick

[Patrick]

Vanya,
no response from you, 2 weeks later.....
Does that means that Telerik won't change anything about this problem. Actually we cannot display anything else than text in GridView headers.
Patrick

[Vera]

Hello Patrick,

Thank you for the details. I have logged the issue and the fix is scheduled for the upcoming service pack (expected next month).

Excuse us for the inconvenience caused. Your Telerik points have been updated accordingly.

Regards,
Vera
Telerik

[Devi]

Hi Vera,

Would you let me know , what the fix would be. I see that in the RadGridView, HEader Text is displayed in CAPS by default and also Foreground cannot override the default style

[Ivan Ivanov]

Hello,

The CAPS format of control headers' content is set in the design of the Office2013 theme. However, you can modify it by assigning a custom header. Please have a look at the attached sample project.
The original issue that the was discussed in the thread was related to lack of support for custom headers, which was fixed shortly after it was reported.

Regards,
Ivan Ivanov
Telerik