GridViewHeaderRow border

7 posts, 1 answers
  1. Tigran
    Tigran avatar
    16 posts
    Member since:
    Jul 2014

    Posted 16 Aug 2014 Link to this post

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

    Posted 18 Aug 2014 Link to this post

    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
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  5. Tigran
    Tigran avatar
    16 posts
    Member since:
    Jul 2014

    Posted 18 Aug 2014 in reply to Vanya Pavlova Link to this post

    Hello Vanya,

    I'm using default theme.  Thank you for response.
  7. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 19 Aug 2014 Link to this post

    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
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  8.
  9. Tigran
    Tigran avatar
    16 posts
    Member since:
    Jul 2014

    Posted 19 Aug 2014 in reply to Vanya Pavlova Link to this post

    Hi Vanya,

    I've tried your demo but borders are still present and I cannot understand what I'm doing wrong.
  11. Answer
    Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 19 Aug 2014 Link to this post

    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
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  13. Tigran
    Tigran avatar
    16 posts
    Member since:
    Jul 2014

    Posted 19 Aug 2014 in reply to Vanya Pavlova Link to this post

    Hi Vanya,

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