This is a migrated thread and some comments may be shown as answers.

Template for GridViewToggleRowDetailsColumn

7 Answers 154 Views
GridView
This is a migrated thread and some comments may be shown as answers.
GEB
Top achievements
Rank 1
GEB asked on 11 Jan 2010, 02:50 PM
I am using VS2010, SL4 Beta with the Blend 4 Preview.  In this environment, I am unable to get the teamplates for RadGridView using Blend.  I would like to change the +/- symbol on a GridViewToggleRowDetailsColumn.  Is there an example on how to do this, or can someone post the teamplate for GridViewToggleRowDetailsColumn?

 

7 Answers, 1 is accepted

Sort by
0
Stefan Dobrev
Telerik team
answered on 14 Jan 2010, 07:57 AM
Hi GEB,

This column is using GridViewToggleButton control. You can find its style bellow:
<ResourceDictionary
    xmlns:controls="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.GridView"
    xmlns:grid="clr-namespace:Telerik.Windows.Controls.GridView;assembly=Telerik.Windows.Controls.GridView"
    xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
    xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
    <SolidColorBrush x:Key="GridViewDisabledBackground" Color="#FFEEEEEE"/>
    <LinearGradientBrush x:Key="GridViewIndicatorsPartsFill" StartPoint="0.5,0" EndPoint="0.5,1">
        <GradientStop Offset="0" Color="#FF000000"/>
        <GradientStop Offset="1" Color="#FF000000"/>
    </LinearGradientBrush>
    <SolidColorBrush x:Key="GridLinesFill" Color="#FFB3B3B3"/>
    <ControlTemplate x:Key="GridViewToggleButtonTemplate" TargetType="controls:GridViewToggleButton">
        <Border
            x:Name="Background"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal"/>
                    <VisualState x:Name="MouseOver"/>
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ColorAnimationUsingKeyFrames
                                BeginTime="00:00:00"
                                Duration="00:00:00.001"
                                Storyboard.TargetName="Background"
                                Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)">
                                <EasingColorKeyFrame KeyTime="00:00:00" Value="{StaticResource GridViewDisabledBackground}"/>
                            </ColorAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="CheckStates">
                    <VisualState x:Name="Checked">
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames
                                BeginTime="00:00:00"
                                Duration="00:00:00.001"
                                Storyboard.TargetName="plus"
                                Storyboard.TargetProperty="(UIElement.Opacity)">
                                <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                            </DoubleAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames
                                BeginTime="00:00:00"
                                Duration="00:00:00.001"
                                Storyboard.TargetName="minus"
                                Storyboard.TargetProperty="(UIElement.Opacity)">
                                <EasingDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unchecked"/>
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused"/>
                    <VisualState x:Name="Unfocused"/>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid>
                <Path
                    x:Name="plus"
                    Width="8"
                    Height="8"
                    HorizontalAlignment="Center"
                    Margin="0"
                    VerticalAlignment="Center"
                    Data="M19.5,0 L27.5,0 L27.5,19.5 L47,19.5 L47,27.5 L27.5,27.5 L27.5,47 L19.5,47 L19.5,27.5 L0,27.5 L0,19.5 L19.5,19.5 z"
                    Fill="{StaticResource GridViewIndicatorsPartsFill}"
                    Stretch="Fill"
                    StrokeThickness="1"/>
                <Path
                    x:Name="minus"
                    Width="8"
                    Height="2"
                    HorizontalAlignment="Center"
                    Margin="0"
                    VerticalAlignment="Center"
                    Data="M0,0 L8,0 L8,47 L0,47 z"
                    Fill="{StaticResource GridViewIndicatorsPartsFill}"
                    Opacity="0"
                    RenderTransformOrigin="0.5,0.5"
                    Stretch="Fill"
                    StrokeThickness="1"/>
            </Grid>
        </Border>
    </ControlTemplate>
    <Style TargetType="controls:GridViewToggleButton">
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="BorderBrush" Value="{StaticResource GridLinesFill}"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="VerticalAlignment" Value="Stretch"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="Template" Value="{StaticResource GridViewToggleButtonTemplate}"/>
    </Style>
</ResourceDictionary>

Greetings,
Stefan Dobrev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Sébastien ISINGRINI
Top achievements
Rank 1
answered on 08 Feb 2010, 03:15 PM
I try to use the style to change the appearance of the toggle button.
I changed the controlTemplate using "plus" and "minus" images insted of using path.

Even if I use and x:Key and then link it the ToggleButtonStyle property of my column, It does not seem to work : the plus and minus are always the same, the original ones.

Do you have an idea or can you provide a small full sample?

Thanks
0
Stefan Dobrev
Telerik team
answered on 11 Feb 2010, 01:31 PM
Hi S├ębastien,

We have introduced a regression issue and this style did not get applied in the latest version of the grid. This will be fixed for the next latest internal build.

All the best,
Stefan Dobrev
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.
0
saravanakumar subramaniam
Top achievements
Rank 1
answered on 26 May 2011, 01:12 AM
Hi,
I am using WPF 3.5, so i was not able to use the above sample code... Is there a way to get it through WPF 3.5?
0
Ganesh Shivshankar
Top achievements
Rank 1
answered on 07 Aug 2012, 08:28 AM
Hi Stefan,

I'm on 2012.1.326.1040. Even now when I set the ToggleButtonStyle on the GridViewToggleRowDetailsColumn with my style, it still seems to use the inbuilt +/- icons.

Need help here.

Cheers.
Ganesh
0
Vanya Pavlova
Telerik team
answered on 07 Aug 2012, 08:50 AM
Hi Ganesh,

 


Indeed GridViewToggleRowDetailsColumn use a GridViewToggleButton. I have prepared some sample demo using the mentioned version, which illustrates how to customize it and set it to the column using the ToggleButtonStyle property. Will you verify how this works for you?   



All the best,
Vanya Pavlova
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Ganesh Shivshankar
Top achievements
Rank 1
answered on 07 Aug 2012, 11:16 AM
Thanks Vanya. I had missed out setting the PlusMinusTemplate to the changed control template as well. Setting that did the trick.
Tags
GridView
Asked by
GEB
Top achievements
Rank 1
Answers by
Stefan Dobrev
Telerik team
Sébastien ISINGRINI
Top achievements
Rank 1
saravanakumar subramaniam
Top achievements
Rank 1
Ganesh Shivshankar
Top achievements
Rank 1
Vanya Pavlova
Telerik team
Share this question
or