This is a migrated thread and some comments may be shown as answers.

Format the header of the RadGridView

3 Answers 105 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Carl
Top achievements
Rank 1
Carl asked on 31 Mar 2016, 04:03 PM

I am trying to format the header of the RadGreidView

 

I

 

            <telerik:RadGridView Margin="10" 
                                 x:Name="safeDataGridView" 
                                 HorizontalAlignment="Stretch" 
                                 VerticalAlignment="Stretch" 
                                 ItemsSource="{Binding QueryTable}" 
                                 ScrollViewer.VerticalScrollBarVisibility="Visible" 
                                 ScrollViewer.HorizontalScrollBarVisibility="Visible" 
                                 RowLoaded="safeDataGridView_RowLoaded" 
                                 Loaded="safeDataGridView_Loaded" >
                <telerik:RadGridView.HeaderRowStyle>
                    <Style TargetType="telerik:HeaderRowStyle">
                        <Setter Property="Background">
                            <Setter.Value>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <GradientStop Offset="0.0" Color="#373638" />
                                    <GradientStop Offset="1.0" Color="#77797B" />
                                </LinearGradientBrush>
                            </Setter.Value>

                        </Setter>
                    </Style>                 
                </telerik:RadGridView.HeaderRowStyle>
            </telerik:RadGridView>

 

I am fcoming unstuck with the line <Style TargetType="telerik:HeaderRowStyle">.  Am I going in the right direction with this and if not could I have a similar simple example of how it is done correctly please.  

 

3 Answers, 1 is accepted

Sort by
0
Martin
Telerik team
answered on 05 Apr 2016, 10:02 AM
Hi Carl,

 Thank you for contacting us.

 To achieve the desired behavior, please take a look at the Styling Header Row article where you can find detailed information on the matter. But keep in mind that if you want to change a whole header row, you should also style the column headers

Also, you may take a look at the code snippet below which will be helpful:

<Style TargetType="telerik:GridViewHeaderCell">
<Setter Property="Background">
      <Setter.Value>
            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                <GradientStop Offset="0.0" Color="Red" />
                <GradientStop Offset="1.0" Color="Green" />
             </LinearGradientBrush>
      </Setter.Value>
 </Setter>
</Style>

I hope this helps. If further assistance is needed, please feel free to get back to us.

Regards,
Martin Vatev
Telerik
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
0
Carl
Top achievements
Rank 1
answered on 06 Apr 2016, 12:36 PM

Hi Martin

Good post so far 

If I use the code below I get what is seen in the attached image.  There are regions that remain black and I would expect that.  How do I access them to apply the same formatting?

Kind regards

 

Carl

 

 

<Color x:Key="HeadertextColour">#FFFCF2</Color>
        <Color x:Key="HeaderTriColour3">#C0C0C0</Color>
        <Color x:Key="HeaderTriColour1">#6A8CB0</Color>
        <Color x:Key="HeaderTriColour2">#99B4D1</Color>
 
        <SolidColorBrush x:Key="tabfontBrush" Color="{StaticResource HeadertextColour}"/>
 
        <Style TargetType="telerik:GridViewHeaderCell" x:Name="Heading">
            <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Offset="0.0" Color="{StaticResource HeaderTriColour1}" />
                        <GradientStop Offset="0.5" Color="{StaticResource HeaderTriColour2}" />
                        <GradientStop Offset="0.6" Color="{StaticResource HeaderTriColour3}" />
                        <GradientStop Offset="1.0" Color="{StaticResource HeaderTriColour1}" />
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
            <Setter Property="Foreground" Value="{StaticResource tabfontBrush}"/>
        </Style>

0
Martin
Telerik team
answered on 11 Apr 2016, 07:32 AM
Hello Carl,

For your convenience, I prepared an example to demonstrate how to style the entire header row.
Please take a look at the implementation and consider how this approach fits your scenario.

I hope that this helps. Should you have any other questions, do not hesitate to contact us.

Regards,
Martin Vatev
Telerik
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Tags
GridView
Asked by
Carl
Top achievements
Rank 1
Answers by
Martin
Telerik team
Carl
Top achievements
Rank 1
Share this question
or