Column Header Font Style

10 posts, 0 answers
  1. mark
    mark avatar
    50 posts
    Member since:
    Mar 2009

    Posted 13 May 2009 Link to this post

    I know this is probably simple, but how do I set the Header Text style like font color, size, etc.  I changed the foregroundcolor for the grid and that changed the color for all text in the grid, but how do I just affect the Column Headers?  I see

    HeaderCellStyle.SetValue(

    ), but I don't know what the values should be or how it works.

    Thanks

  2. Kalin Milanov
    Admin
    Kalin Milanov avatar
    447 posts

    Posted 14 May 2009 Link to this post

    Hello Mark,

    You can easily style the HeaderCell text by creating a style and applying it to the HeaderCellStyle property of your column.

    Here is a sample XAML showing you the properties you can tweak:
    <Style x:Key="MyHeaderCellStyle" TargetType="telerik:GridViewHeaderCell"
          <Setter Property="Foreground" Value="Red" /> 
          <Setter Property="FontSize" Value="20" /> 
          <Setter Property="FontWeight" Value="Bold" /> 
          <Setter Property="FontStyle" Value="Italic" /> 
    </Style> 

    To set this style to your column headers either to it in XAML by:
    <telerikGridView:RadGridView x:Name="RadGridView1">   
        <telerikGridView:RadGridView.Columns> 
            <telerikGridView:GridViewDataColumn HeaderCellStyle="{StaticResource MyHeaderCellStyle}"/> 
            <telerikGridView:GridViewDataColumn HeaderCellStyle="{StaticResource MyHeaderCellStyle}"/> 
        </telerikGridView:RadGridView.Columns> 
    </telerikGridView:RadGridView> 

    or in code by:
    void RadGridView1.DataLoaded(object sender, EventArgs e) 
       foreach (var col in RadGridView1.Columns) 
       { 
           col.HeaderCellStyle = (Style)this.Resources["MyHeaderCellStyle"]; 
       } 

    This should do the trick.

    All the best,
    Kalin Milanov
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  3. DevCraft banner
  4. G
    G avatar
    14 posts
    Member since:
    May 2009

    Posted 24 May 2009 Link to this post

    Does this work for the current trial version?

    I'm unable to get this fairly basic example working.
  5. Kalin Milanov
    Admin
    Kalin Milanov avatar
    447 posts

    Posted 25 May 2009 Link to this post

    Hello G,

    I could not reproduce any problems in setting the font style. Please review the attached sample application which demonstrates setting the style both in XAML and in code. Also please note that the CS should be different depending on where you declare your style. 

    I hope this will bring some clarity in the situation.

    All the best,
    Kalin Milanov
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  6. Marc Roussel
    Marc Roussel avatar
    429 posts
    Member since:
    Dec 2009

    Posted 01 Mar 2010 Link to this post

    Need Blend 3 example without having to write xaml by hand.
    This would be greatly apreciated.
  7. Mike Lee
    Mike Lee avatar
    11 posts
    Member since:
    Jan 2010

    Posted 05 Apr 2010 Link to this post

    Hi Kalin, is it possible to give a style to all the GridViewDataColumns without having to do this?

        <telerikGridView:RadGridView.Columns>  
            <telerikGridView:GridViewDataColumn HeaderCellStyle="{StaticResource MyHeaderCellStyle}"/>  
            <telerikGridView:GridViewDataColumn HeaderCellStyle="{StaticResource MyHeaderCellStyle}"/>  
        </telerikGridView:RadGridView.Columns>  


    I tried using HeaderRowStyle to change the header background, but it doesn't work.

        <UserControl.Resources> 
            <Style x:Key="MyHeaderRowStyle1" TargetType="controls:GridViewHeaderRow"
                <Setter Property="Background" Value="Red" /> 
            </Style> 
        </UserControl.Resources> 
         
         
        <Grid x:Name="LayoutRoot" Background="White"
            <telerik:RadGridView x:Name="RadGridView1" HeaderRowStyle="{StaticResource MyHeaderRowStyle1}" > 
                <telerik:RadGridView.Columns> 
                    <telerik:GridViewDataColumn UniqueName="ID"  /> 
                    <telerik:GridViewDataColumn UniqueName="ID" /> 
                    <telerik:GridViewDataColumn UniqueName="ID"  /> 
                </telerik:RadGridView.Columns> 
            </telerik:RadGridView> 
        </Grid> 
     






  8. Kalin Milanov
    Admin
    Kalin Milanov avatar
    447 posts

    Posted 06 Apr 2010 Link to this post

    Hello Mike Lee,

    You can set the HeaderCellStyle in the code behind and let the grid to automatically generate its columns. As for the header row - I was unable to reproduce the error as the style gets applied. Could you please send me a sample which reproduces the problem.

    Also attached I am sending you a sample demonstrating both issues.

    Greetings,
    Kalin Milanov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  9. Mike Lee
    Mike Lee avatar
    11 posts
    Member since:
    Jan 2010

    Posted 06 Apr 2010 Link to this post

    Hi Kalin, thanks for responding.  Your code-behind solution works, but I don't want to insert that code behind for every grid in my project.  I want to create a style that all my grids can use.  If I run the project you sent without the code-behind, I get the default Office Black theme for the columns that have data.  The coloring of the row works using HeaderRowStyle, but the populated columns have header rows in the Office Black Theme.  I want to have control over the column header colors when it's populated.  Here's the sample:

    <UserControl 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:telerikGridView="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.GridView" xmlns:Telerik_Windows_Controls_GridView="clr-namespace:Telerik.Windows.Controls.GridView;assembly=Telerik.Windows.Controls.GridView" 
        x:Class="HeaderRow.MainPage" 
        Width="640" Height="480"
         
        <UserControl.Resources> 
            <Style x:Key="MyHeaderRowStyle" TargetType="Telerik_Windows_Controls_GridView:GridViewHeaderRow"
                <Setter Property="Background" Value="Red" /> 
            </Style> 
        </UserControl.Resources> 
     
        <Grid x:Name="LayoutRoot" Background="White" DataContext="{Binding Source={StaticResource SampleDataSource}}"
            <telerikGridView:RadGridView x:Name="gridView" HeaderRowStyle="{StaticResource MyHeaderRowStyle}" ItemsSource="{Binding Collection}" /> 
        </Grid> 
    </UserControl> 

    Attached is the screen shot showing the populated column headers in Office Black.
  10. Kalin Milanov
    Admin
    Kalin Milanov avatar
    447 posts

    Posted 07 Apr 2010 Link to this post

    Hi Mike Lee,

    Unfortunately with Silverlight 3 you cannot define implicit style (unlike WPF) which will automatically apply to the respective elements. Therefore you will need to somehow set the style either in XAML or in code.
    Fortunately this feature is being added to Silverlight 4, which will be available on 12th April.

    All the best,
    Kalin Milanov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  11. Sonal
    Sonal avatar
    1 posts
    Member since:
    Mar 2012

    Posted 14 Mar 2012 Link to this post

    Hi,

    We have textBlock that is being added in a telrik grid(1st row and 1st Colum). This block has been given the font weight as bold.

    TextBlock block = new TextBlock();

    block.Margin = new Thickness(HeaderMargin2, 0, 0, 0);

    block.Text = "Text";

    block.FontSize = 13;

    block.FontWeight = FontWeights.Bold;
    When page is loaded for first time, font weight is fine but on reload(due to some selection changed or any other event) the text in textBlock gets bolder.
    On second reload it is again normal and on next reload it get bolder. It gets bold and bolder on alternate reload. Please let me know how can I seal my style.
    FYI.. I tried style.seal(), it is not working.

    Thanks,
    Sonal

Back to Top
DevCraft banner