Styling problems with RadGridView

2 posts, 0 answers
  1. Stephen
    Stephen avatar
    1 posts
    Member since:
    Oct 2014

    Posted 16 Oct 2014 Link to this post

    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.
  2. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 20 Oct 2014 Link to this post

    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:
     
    <Border
                          Background="{StaticResource GridView_HierarchyBackground}"
                          grid:SelectiveScrollingGrid.SelectiveScrollingClip="True"
                          Grid.Column="2"
                          Grid.Row="2"
                          Grid.ColumnSpan="2"
                          Padding="6"
                          BorderBrush="{StaticResource ControlOuterBorder}"
                          BorderThickness="0,1"
                          Visibility="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}">
                      <ContentPresenter x:Name="PART_HierarchyChildPresenter" grid:SelectiveScrollingGrid.SelectiveScrollingClip="True"/>
                  </Border>

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

    <Border x:Name="SelectionVisual"
                       Opacity="0"
                       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}"/>
               </Border>

    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"
                            Grid.ColumnSpan="2"
                            BorderBrush="{StaticResource GridView_HeaderOuterBorder_Selected}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Opacity="0">
                        <Border BorderBrush="{StaticResource GridView_HeaderInnerBorder_Selected}" Background="{StaticResource GridView_HeaderBackground_Selected}" BorderThickness="1"/>
     </Border>

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


    Regards,
    Vanya Pavlova
    Telerik
     

    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.

     
Back to Top