GridViewHeaderRow border

[Tigran]

Hello,

I need to remove GridView's header row border partially to display only right and bottom sides(Grid.png). I've tried to style HeaderRow and HeaderCell but it does not help so the whole border is seen.  Any idea how can I achieve that?  Here is my styles

<Style x:Key="gridheaderstyle"  TargetType="telerik:GridViewHeaderRow">
        <Setter Property="BorderBrush"      Value="Transparent" />
        <Setter Property="BorderThickness"  Value="0 0 0 0" />
        <Setter Property="Background"       Value="Transparent" />
</Style>

<Style x:Key="gridheadercellstyle"  TargetType="telerik:GridViewHeaderCell">
        <Setter Property="Background"       Value="Transparent" />
        <Setter Property="BorderBrush"      Value="Black" />
        <Setter Property="BorderThickness"  Value="0 0 1 1" />
</Style>

[Vanya Pavlova]

Hi Tigran,


Thank you for contacting us. 

Which Telerik theme are you currently using?

Based on this information I will prepare sample demo, which illustrates how to achieve your goal. 


Regards,
Vanya Pavlova
Telerik

 

 

[Tigran]

Hello Vanya,

I'm using default theme.  Thank you for response.

[Vanya Pavlova]

Hello Tigran,


Thank you for getting back to us. 


In the default themes, GridViewHeaderCell and GridViewHeaderRow elements have outer and inner borders. With a simple style you could remove only the outer borders, not the inner ones. 
You should predefine their templates and remove the inner borders in order to achieve your goal. 

I've prepared sample demo, which illustrates this approach against Office_Black theme. 


Regards,
Vanya Pavlova
Telerik

 

 

[Tigran]

Hi Vanya,

I've tried your demo but borders are still present and I cannot understand what I'm doing wrong.

[Vanya Pavlova]

Hi Tigran,


Thank you for getting back to us.

The referred example demonstrates how to remove the inner borders of GridViewHeaderCell and GridViewHeaderRow. If you want to reset the border thickness to the left you should alter the BorderThickness of GridViewHeaderRow:

<Style x:Key="GridViewHeaderRowStyle" TargetType="grid:GridViewHeaderRow">
      <Setter Property="Template" Value="{StaticResource GridViewHeaderRowTemplate}"/>
      <Setter Property="Background" Value="White"/>
      <Setter Property="MinHeight" Value="27"/>
      <Setter Property="BorderBrush" Value="Black"/>
      <Setter Property="BorderThickness" Value="0 0 0 1"/>

RadGridView's definition should be modified, as well:

<telerik:RadGridView ShowGroupPanel="False" CanUserFreezeColumns="False" BorderThickness="0" RowIndicatorVisibility="Collapsed" IsFilteringAllowed="False" GridLinesVisibility="None" ItemsSource="{Binding Collection}"/>

You could check the updated project and image for further reference.

Could you clarify how this corresponds to your needs? 


Regards,
Vanya Pavlova
Telerik

 

 

[Tigran]

Hi Vanya,

Now everything is clear, this is what I need. Thank you very much for your help !