How to change style for GridViewToggleRowDetailsColumn?

6 posts, 0 answers
  1. saravanakumar subramaniam
    saravanakumar subramaniam avatar
    28 posts
    Member since:
    May 2010

    Posted 25 May 2011 Link to this post


    I am using GridViewToggleRowDetailsColumn to show the RowDetails, i am getting '+' and '-' symbol to show and hide the RowDetails. Bu t i need to change to custom symbol for '+' and '-'.

    Is there anyway that i can change the image or symbol for + and -?
  2. Ivan Ivanov
    Ivan Ivanov avatar
    1201 posts

    Posted 26 May 2011 Link to this post

    Hello saravanakumar subramaniam,

    To achieve this you should set GridViewToggleRowDetailsColumn's ToggleButtonStyle property and retemplate GridViewToggleButton. I have prepared a sample project, where all the needed templates and resources are extracted. Please, refer to it and do not hesitate to contact us if any further inquiries occur.

    Ivan Ivanov
    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
  3. Krista Thompson
    Krista Thompson avatar
    2 posts
    Member since:
    Mar 2010

    Posted 13 Sep 2011 Link to this post

    Hi there,

    Since we upgraded to the latest release of the WPF Controls (Version 2011.2 712), the ToggleButton Templates no longer work. I was able to recreate the issue by downloading the above template. I change the Fill color of the plus sign to Magenta. Everything looked great. Then I removed the old references and added a reference to the new verions of the dlls. At this point, no matter what property I change on the plus, it still looks like the default black plus sign.

    Here's what I changed it to just to see if I could get it to look different with no luck.






    <ControlTemplate x:Key="GridViewToggleButtonTemplate" TargetType="telerik:GridViewToggleButton">
          <Border Background="Transparent" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
              <Border Width="9" Height="9" 
                  Background="{TemplateBinding Background}"
                  BorderBrush="{TemplateBinding BorderBrush}"                 
                  BorderThickness="{TemplateBinding BorderThickness}" 
                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}">
                      <!-- Change plus/minus here -->
                      <Path x:Name="plus" Fill="Magenta" Stretch="Fill" Stroke="{x:Null}" Margin="{TemplateBinding Padding}" Data="M1.937,0 L2.937,0 z" Width="10" Height="10" />
                      <Rectangle x:Name="minus" Fill="{StaticResource GridView_ToggleButtonStroke}" Stroke="{x:Null}" RadiusX="0" RadiusY="0" Margin="{TemplateBinding Padding}" VerticalAlignment="Center" Height="1" HorizontalAlignment="Center" Width="5" Opacity="0"/>
              <Trigger Property="IsChecked" Value="True">
                  <Setter TargetName="plus"  Property="Opacity" Value="0" />
                  <Setter TargetName="minus"  Property="Opacity" Value="1" />

  4. Ivan Ivanov
    Ivan Ivanov avatar
    1201 posts

    Posted 19 Sep 2011 Link to this post

    Hi Krista Thompson,

    I have prepared an example project that illustrates how to retemplate GridViewToggleButton. I have tested it with 2011.2 712 binaries. Please, let us know whether this solution meets your requirements.

    Ivan Ivanov
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  5. Krista Thompson
    Krista Thompson avatar
    2 posts
    Member since:
    Mar 2010

    Posted 13 Oct 2011 Link to this post

    Thanks! That did it. The property name must have changed in one of the more recent versions. As soon as I switched form using Template to PlusMinusTemplate, it was fixed.

    Thanks again,
  6. Benjamin
    Benjamin avatar
    0 posts
    Member since:
    Nov 2015

    Posted 16 Nov 2015 Link to this post

    I am trying to change the background of the column header. How do I access it? I was able to change the background of the cells with the example above.
Back to Top