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

Styling problems with RadGridView

1 Answer 56 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Stephen asked on 16 Oct 2014, 10:47 PM
I am having some issues with finding what to call to set certain colors.  If you look at the attached RadGridView you will see these problems:

1. The child template has that light grey background.
2. On the selected tab it is white.
3. The selected grid header column is an orageish color (also is an orangeish color when moused over).

What are the proper ways to fix these color issues?  I've tried changing the style on almost everything and have had no success.

1 Answer, 1 is accepted

Sort by
Vanya Pavlova
Telerik team
answered on 20 Oct 2014, 07:58 AM
Hello Stephen,

Thank you for contacting us. 

You may find my answers in the following order:

1. Gray coloured background is the one around the element, which is responsible for displaying hierarchical grid view elements.
You could modify its appearance via predefining the template of GridViewRow and find the XAML mark-up below:
                      Background="{StaticResource GridView_HierarchyBackground}"
                      BorderBrush="{StaticResource ControlOuterBorder}"
                      Visibility="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}">
                  <ContentPresenter x:Name="PART_HierarchyChildPresenter" grid:SelectiveScrollingGrid.SelectiveScrollingClip="True"/>

2. You may modify the selected tam item, via predefining the template of RadTabItem and the selection visual below:

<Border x:Name="SelectionVisual"
                   Margin="{StaticResource TabItem_Margin_Selected}"
                   Background="{StaticResource TabItem_Background_Selected}"
                   BorderBrush="{StaticResource TabItem_OuterBorder_Selected}"
                   BorderThickness="{StaticResource TabItem_OuterBorderThickness}"
                   CornerRadius="{StaticResource TabItem_OuterCornerRadius}">
               <Border BorderBrush="{StaticResource TabItem_InnerBorder_Selected}" CornerRadius="{StaticResource TabItem_InnerCornerRadius}" BorderThickness="{StaticResource TabItem_InnerBorderThickness}"/>

3. The orange color, that appears when you sort header in RadGridView could be modified via predefining the template of GridViewHeaderCell. The Background of the element with x:Name Background_Selected is the one you need:

<Border x:Name="GridViewHeaderCell_Selected"
                        BorderBrush="{StaticResource GridView_HeaderOuterBorder_Selected}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                    <Border BorderBrush="{StaticResource GridView_HeaderInnerBorder_Selected}" Background="{StaticResource GridView_HeaderBackground_Selected}" BorderThickness="1"/>

You could also refer to our online documentation for further reference. following this link.  

Vanya Pavlova

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Asked by
Top achievements
Rank 1
Answers by
Vanya Pavlova
Telerik team
Share this question