How to change style for GridViewToggleRowDetailsColumn?

[saravanakumar subramaniam]

Hi,

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 -?

[Ivan Ivanov]

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.

Regards,
Ivan Ivanov
the Telerik team

[Krista Thompson]

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}">
              <Grid>
                  <!-- 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"/>
              </Grid>
          </Border>
      </Border>
      <ControlTemplate.Triggers>
          <Trigger Property="IsChecked" Value="True">
              <Setter TargetName="plus"  Property="Opacity" Value="0" />
              <Setter TargetName="minus"  Property="Opacity" Value="1" />
          </Trigger>
      </ControlTemplate.Triggers>
  </ControlTemplate>

[Ivan Ivanov]

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.

Regards,
Ivan Ivanov
the Telerik team

[Krista Thompson]

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,
Krista