Foreground styling of GroupHeaderRow

[Loic]

Hello,

I am trying to set the color of the text in the GroupHeaderRow of my gridview. 
Both the title of the group (value of the column grouped) and the text of the aggregate functions.

When I use the office black theme, everything is in black and when I use the windows 8 theme, the aggregate function text is in blue.

I use a GroupRowStyleSelector :

<cstyle:ReconReportStyle x:Key="styleGroupHeaderRow">
            <cstyle:ReconReportStyle.UnmatchedStyle>
                <Style TargetType="telerik:GroupHeaderRow">
                    <Setter Property="Background" Value="Red"/>
                    <Setter Property="Foreground" Value="Pink"/>                     <!--  this setter does not change anything-->
                </Style>....


<telerik:RadGridView ...
GroupRenderMode="Flat"
GroupRowStyleSelector="{StaticResource styleGroupHeaderRow}"
</....>


 What should I do ?

[Boris]

Hello Loic,

The easiest way to set the Foreground color of the GroupHeaderRow is to use the GroupHeaderTemplate property of the GridView. 

<telerik:RadGridView.GroupHeaderTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Header}" Foreground="Yellow"/>
            </StackPanel>
        </DataTemplate>
</telerik:RadGridView.GroupHeaderTemplate>

In addition, to set the Background property of the GroupHeaderRow / GridViewGroupRow(depending on the GroupRenderMode), you can use a style.

GroupRenderMode="Flat":

<Style TargetType="telerik:GroupHeaderRow" BasedOn="{StaticResource GroupHeaderRowStyle}">
            <Setter Property="Background" Value="Red"/>
</Style>

GroupRenderMode="Nested":

<Style TargetType="telerik:GridViewGroupRow" BasedOn="{StaticResource GridViewGroupRowStyle}">
            <Setter Property="Background" Value="Red" />
</Style>

As for the aggregate functions, you can edit their ControlTemplate with x:Key="GridViewAggregateResultCellTemplate" directly in the Telerik.Windows.Controls.GridView.xaml file or through style. All you need to do is set the Foreground property of the two TextBlocks. For your conveyance I have implemented the second approach:

<Style TargetType="telerik:GridViewAggregateResultCell">
            <Setter Property="Template">
                <Setter.Value>

                    <ControlTemplate TargetType="telerik:GridViewAggregateResultCell">
                        <StackPanel Margin="{TemplateBinding Padding}"
                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                    Background="{TemplateBinding Background}"
                                    Orientation="Horizontal">
                            <TextBlock Margin="10 0 0 0"
                                       VerticalAlignment="Center"
                                       Foreground="Yellow"
                                       Text="{Binding Caption}"
                                       TextAlignment="Right" />
                            <TextBlock Margin="3 0"
                                       VerticalAlignment="Center"
                                       Foreground="Yellow"
                                       Text="{Binding FormattedValue}"
                                       TextAlignment="Right" />
                        </StackPanel>
                    </ControlTemplate>

                </Setter.Value>
            </Setter>
        </Style>

I hope this helps.

Regards,
Boris Penev
Telerik

 

 

[Loic]

Thank you, it is working.