Setting different tileview header colors

[Ben Larson]

I saw a different thread on this about a year ago, and there was discussion that this functionality may be coming in future releases.  Is this available now?  If not, how can I implement this in my wpf application?  I found an example in the forums, but when I try to use it, I get the following error:

Cannot animate the 'Visibility' property on a 'System.Windows.Controls.Grid' using a 'System.Windows.Media.Animation.ObjectAnimationUsingKeyFrames'.

It shows the header in a different color when it first comes up, but I get the error when I try to expand one of the tiles.

Here's the style I tried to use:

        <SolidColorBrush x:Key="RadTileView_Background" Color="#e9ecee"/>
        <LinearGradientBrush x:Key="RadTileView_Border" EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#EEEEEE" Offset="0"/>
            <GradientStop Color="#D6DEE6" Offset="1"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="RadTileView_HeaderBackground" EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#f5f5f6" Offset="0"/>
            <GradientStop Color="#e1e4e7" Offset="0.5"/>
            <GradientStop Color="#c9cdd2" Offset="0.51"/>
            <GradientStop Color="#d7dade" Offset="1"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="RadTileView_HeaderBorder" Color="#caced3"/>
        <LinearGradientBrush x:Key="RadTileView_ButtonBackground" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FFC7CDD4" Offset="0"/>
            <GradientStop Color="#FF888C94" Offset="1"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="RadTileView_ButtonOuterBorder" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FFE0E2E7" Offset="0"/>
            <GradientStop Color="#FFECF1F6" Offset="1"/>
            <GradientStop Color="#FFC9CDD2" Offset="0.53"/>
            <GradientStop Color="#FFF2F2F4" Offset="0.513"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="RadTileView_ButtonInnerBorder" Color="#FF3A3C3D"/>
        <LinearGradientBrush x:Key="RadTileView_ButtonInnerBorderRectangle" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FFEDEEF0" Offset="0"/>
            <GradientStop Color="#FFD6DADF" Offset="1"/>
            <GradientStop Color="#FFF0F0F2" Offset="0.422"/>
            <GradientStop Color="#FFC8CDD2" Offset="0.44"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="RadTileView_ButtonBackgroundOver" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FFFEEDB7" Offset="0"/>
            <GradientStop Color="#FFFACA6A" Offset="1"/>
            <GradientStop Color="#FFFFC94A" Offset="0.526"/>
            <GradientStop Color="#FFFEEDB7" Offset="0.509"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="RadTileView_ButtonInnerBorderOver" Color="#FF543E0C"/>
        <LinearGradientBrush x:Key="RadTileView_ButtonBackgroundPressed" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FFFECE95" Offset="0"/>
            <GradientStop Color="#FFFEB407" Offset="1"/>
            <GradientStop Color="#FFFEBB6E" Offset="0.517"/>
            <GradientStop Color="#FFE78318" Offset="0.539"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="RadTileView_ButtonInnerBorderPressed" Color="#FF573510"/>
        <SolidColorBrush x:Key="DisabledBrush" Color="#99FFFFFF"/>
        <Style x:Key="RadTileViewItemStyle1" TargetType="telerik:RadTileViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <Setter Property="Background" Value="{StaticResource RadTileView_Background}"/>
            <Setter Property="BorderBrush" Value="{StaticResource RadTileView_Border}"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Padding" Value="7"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="telerik:RadTileViewItem">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="DisabledVisual" Storyboard.TargetProperty="Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border Margin="{TemplateBinding Padding}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="5">
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto"/>
                                        <RowDefinition Height="*"/>
                                    </Grid.RowDefinitions>
                                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Grid.Row="1" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                                    <Border Background="{StaticResource RadTileView_HeaderBackground}" BorderBrush="{StaticResource RadTileView_HeaderBorder}" BorderThickness="0 0 0 1" CornerRadius="4 4 0 0" Padding="10 0 7 0">
                                        <Grid MinHeight="28">
                                            <Border x:Name="GripBarElement" Background="Transparent">
                                                <ContentPresenter HorizontalAlignment="Left" Margin="0,0,10,0" VerticalAlignment="Center" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}"/>
                                            </Border>
                                            <ToggleButton x:Name="MaximizeToggleButton" Height="17" HorizontalAlignment="Right" VerticalAlignment="Center" Width="17">
                                                <ToggleButton.Template>
                                                    <ControlTemplate TargetType="ToggleButton">
                                                        <Grid>
                                                            <VisualStateManager.VisualStateGroups>
                                                                <VisualStateGroup x:Name="FocusStates">
                                                                    <VisualState x:Name="Focused"/>
                                                                    <VisualState x:Name="Unfocused"/>
                                                                </VisualStateGroup>
                                                                <VisualStateGroup x:Name="CommonStates">
                                                                    <VisualState x:Name="Disabled"/>
                                                                    <VisualState x:Name="Normal"/>
                                                                    <VisualState x:Name="MouseOver">
                                                                        <Storyboard>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundOver}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderOver}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundOver}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path2Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundOver}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path3Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderOver}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderOver}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                        </Storyboard>
                                                                    </VisualState>
                                                                    <VisualState x:Name="Pressed">
                                                                        <Storyboard>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundPressed}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderPressed}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundPressed}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path2Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundPressed}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path3Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderPressed}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5Check" Storyboard.TargetProperty="Fill">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderPressed}"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                        </Storyboard>
                                                                    </VisualState>
                                                                </VisualStateGroup>
                                                                <VisualStateGroup x:Name="CheckStates">
                                                                    <VisualState x:Name="Checked">
                                                                        <Storyboard>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="checkedArrow" Storyboard.TargetProperty="Visibility">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="uncheckedArrow" Storyboard.TargetProperty="Visibility">
                                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                                                                            </ObjectAnimationUsingKeyFrames>
                                                                        </Storyboard>
                                                                    </VisualState>
                                                                    <VisualState x:Name="Unchecked"/>
                                                                    <VisualState x:Name="Indeterminate"/>
                                                                </VisualStateGroup>
                                                            </VisualStateManager.VisualStateGroups>
                                                            <Grid x:Name="uncheckedArrow" Height="13" Width="17" Visibility="Visible" Background="Transparent" ToolTipService.ToolTip="Maximize">
                                                                <Path x:Name="Path1" Fill="{StaticResource RadTileView_ButtonBackground}" Stretch="Fill" Height="11" HorizontalAlignment="Center" VerticalAlignment="Center" Width="15" Data="M3,4 L3,8 L12,8 L12,4 z M1.4999999,1.4210855E-14 L13.5,1.4210855E-14 C14.328427,-1.0430811E-07 15,0.67157274 15,1.4999999 L15,9.5 C15,10.328427 14.328427,11 13.5,11 L1.4999999,11 C0.67157286,11 0,10.328427 0,9.5 L0,1.4999999 C0,0.67157274 0.67157286,-1.0430811E-07 1.4999999,1.4210855E-14 z"/>
                                                                <Rectangle x:Name="Path4" Stroke="{StaticResource RadTileView_ButtonOuterBorder}" RadiusX="2" RadiusY="2" Height="13" HorizontalAlignment="Center" VerticalAlignment="Center" Width="17"/>
                                                                <Path x:Name="Path5" Fill="{StaticResource RadTileView_ButtonInnerBorder}" Stretch="Fill" Height="10.914" HorizontalAlignment="Center" VerticalAlignment="Center" Width="14.913" Opacity="0.7" Data="M11.956482,4.9564972 L12.956482,4.9564972 L12.956482,8.9564972 L11.956482,8.9564972 L3.9564819,8.9564972 L3.9564819,7.9564972 L11.956482,7.9564972 z M1.5000182,0 L13.500164,0 C14.121492,3.0788389E-08 14.654589,0.37776613 14.882304,0.91614765 L14.912999,1.0000155 L1.0000072,1.0000155 L1.0000072,10.913 L0.91614342,10.882306 C0.37776428,10.65459 -5.9605348E-08,10.12149 7.0536E-15,9.5001593 L7.0536E-15,1.5000254 C-5.9605348E-08,0.67158419 0.67158097,3.0788389E-08 1.5000182,0 z"/>
                                                                <Rectangle x:Name="Path6" Stroke="{StaticResource RadTileView_ButtonInnerBorderRectangle}" Height="4" HorizontalAlignment="Center" VerticalAlignment="Center" Width="9"/>
                                                            </Grid>
                                                            <Grid x:Name="checkedArrow" Height="17" Margin="0 1 0 0" Width="17" Visibility="Collapsed" Background="Transparent" ToolTipService.ToolTip="Minimize">
                                                                <Path x:Name="PathCheck" Stretch="Fill" Stroke="{StaticResource RadTileView_ButtonOuterBorder}" Height="13" HorizontalAlignment="Right" VerticalAlignment="Top" Width="13" Data="M2.5,0.5 L10.5,0.5 C11.6,0.5 12.5,1.31 12.5,2.5 L12.5,10.5 C12.5,11.6 11.6,12.5 10.5,12.5 L6.5,12.5 L6.5,7.5 L0.5,7.5 L0.5,2.5 C0.5,1.4 1.4,0.5 2.5,0.5 z"/>
                                                                <Path x:Name="Path1Check" Fill="{StaticResource RadTileView_ButtonBackground}" Stretch="Fill" Margin="1,5,5,1" Data="M3,4 L3,8 L8,8 L8,4 z M1.5,0 L9.5,0 C10.3,0 11,0.6 11,1.5 L11,9.5 C11,10.3 10.3,11 9.5,11 L1.5,11 C0.6,11 0,10.3 0,9.5 L0,1.5 C0,0.6 0.6,0 1.5,0 z"/>
                                                                <Path x:Name="Path2Check" Fill="{StaticResource RadTileView_ButtonBackground}" Stretch="Fill" Margin="5.05,1,1,5" Data="M1.5,0 L9.5,0 C10.3,0 11,0.6 11,1.5 L11,3.5 L11,9.5 C11,10.3 10.3,11 9.5,11 L7,11 L7,8.5 L7,8 L7,4 L7,3.5 L0,3.5 L0,1.5 C0,0.6 0.6,0 1.5,0 z"/>
                                                                <Path x:Name="Path3Check" Fill="{StaticResource RadTileView_ButtonInnerBorder}" Stretch="Fill" Margin="5.05,1,1.05,5" Opacity="0.7" Data="M7.9,4.25 L8.9,4.25 L8.9,11.25 L7.9,11.25 z M1.5,0 L9.5,0 C10.1,0 10.6,0.4 10.9,0.9 L10.914,0.9 L0.99,0.99 L0.99,2.5 L0,2.5 L0,1.5 C0,0.6 0.6,0 1.5,0 z"/>
                                                                <Rectangle x:Name="Path4Check" Stroke="{StaticResource RadTileView_ButtonOuterBorder}" RadiusX="2" RadiusY="2" Height="13" HorizontalAlignment="Right" Margin="0,3.5,4,0" VerticalAlignment="Top" Width="13"/>
                                                                <Path x:Name="Path5Check" Fill="{StaticResource RadTileView_ButtonInnerBorder}" Stretch="Fill" Margin="1,5,5.05,1.1" Opacity="0.7" Data="M7.99,5 L9,5 L9,8.99 L8,8.99 L4,9 L4,8 L7.99,8 z M1.4,0 L9.4,0 C10,0 10.69,0.4 10.9,0.98 L10.914,0.99 L0.99,0.99 L0.99,10.914 L0.98,10.90 C0.4,10.69 0,10.14 0,9.5 L0,1.5 C0,0.675 0.675,0 1.5,0 z"/>
                                                                <Rectangle x:Name="Path6Check" Stroke="{StaticResource RadTileView_ButtonInnerBorderRectangle}" Height="4" Margin="4,0,8,4" VerticalAlignment="Bottom"/>
                                                            </Grid>
                                                        </Grid>
                                                    </ControlTemplate>
                                                </ToggleButton.Template>
                                            </ToggleButton>
                                        </Grid>
                                    </Border>
                                    <Rectangle x:Name="DisabledVisual" Fill="{StaticResource DisabledBrush}" RadiusX="4" RadiusY="4" Visibility="Collapsed" Grid.RowSpan="2"/>
                                </Grid>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

[Dimitrina]

Hi Ben,

I reviewed your code and I noticed that the custom style for the RadTileView control  which you used is for SilverLight application. Please find attached a project with a custom style for the RadTileView for WPF aplication.

If you have further questions please do not hesitate to ask us.
I hope this will help you.

Best wishes,
Dimitrina
the Telerik team

[phuoc tran ngoc]

Hi guy

I have two problems that drive me crazy:
1   I'm trying to customize the header color of each tileview_Item.
for example: I have 4 items, every item header has a color.
2 When items are minimized, all items are same size. Now I want there is a item that is alway bigger than orther.
you can see 2 screenshot below. I'm very appreciate

[Kiril Stanoev]

Hi phuoc tran ngoc,

1. If you want to apply different colors to the TileViewItem headers, you will have to create 4 different styles for each TileViewItem. More information on how to edit the style of a Telerik control you can find here.

2. Are you talking about this feature request? If so, then this scenario is not yet supported. You can track and vote for the PITS item to increase its priority. This feature will be implemented by the end of Q1 2011.

Let me know if you need further assistance.

Kind regards,
Kiril Stanoev
the Telerik team

[Akber]

<SolidColorBrush x:Key="RadTileView_Background" Color="#e9ecee"/>

<LinearGradientBrush x:Key="RadTileView_Border" EndPoint="0,1" StartPoint="0,0">

<GradientStop Color="#EEEEEE" Offset="0"/>

<GradientStop Color="#D6DEE6" Offset="1"/>

</LinearGradientBrush>

<LinearGradientBrush x:Key="RadTileView_HeaderBackground" EndPoint="0,1" StartPoint="0,0">

<GradientStop Color="#f5f5f6" Offset="0"/>

<GradientStop Color="#e1e4e7" Offset="0.5"/>

<GradientStop Color="#c9cdd2" Offset="0.51"/>

<GradientStop Color="#d7dade" Offset="1"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="RadTileView_HeaderBorder" Color="#caced3"/>

<LinearGradientBrush x:Key="RadTileView_ButtonBackground" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFC7CDD4" Offset="0"/>

<GradientStop Color="#FF888C94" Offset="1"/>

</LinearGradientBrush>

<LinearGradientBrush x:Key="RadTileView_ButtonOuterBorder" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFE0E2E7" Offset="0"/>

<GradientStop Color="#FFECF1F6" Offset="1"/>

<GradientStop Color="#FFC9CDD2" Offset="0.53"/>

<GradientStop Color="#FFF2F2F4" Offset="0.513"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="RadTileView_ButtonInnerBorder" Color="#FF3A3C3D"/>

<LinearGradientBrush x:Key="RadTileView_ButtonInnerBorderRectangle" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFEDEEF0" Offset="0"/>

<GradientStop Color="#FFD6DADF" Offset="1"/>

<GradientStop Color="#FFF0F0F2" Offset="0.422"/>

<GradientStop Color="#FFC8CDD2" Offset="0.44"/>

</LinearGradientBrush>

<LinearGradientBrush x:Key="RadTileView_ButtonBackgroundOver" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFEEDB7" Offset="0"/>

<GradientStop Color="#FFFACA6A" Offset="1"/>

<GradientStop Color="#FFFFC94A" Offset="0.526"/>

<GradientStop Color="#FFFEEDB7" Offset="0.509"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="RadTileView_ButtonInnerBorderOver" Color="#FF543E0C"/>

<LinearGradientBrush x:Key="RadTileView_ButtonBackgroundPressed" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFECE95" Offset="0"/>

<GradientStop Color="#FFFEB407" Offset="1"/>

<GradientStop Color="#FFFEBB6E" Offset="0.517"/>

<GradientStop Color="#FFE78318" Offset="0.539"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="RadTileView_ButtonInnerBorderPressed" Color="#FF573510"/>

<SolidColorBrush x:Key="DisabledBrush" Color="#99FFFFFF"/>

<Style x:Key="RadTileViewItemStyle1" TargetType="telerik:RadTileViewItem">

<Setter Property="HorizontalContentAlignment" Value="Stretch"/>

<Setter Property="VerticalContentAlignment" Value="Stretch"/>

<Setter Property="Background" Value="{StaticResource RadTileView_Background}"/>

<Setter Property="BorderBrush" Value="{StaticResource RadTileView_Border}"/>

<Setter Property="BorderThickness" Value="1"/>

<Setter Property="Padding" Value="7"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="telerik:RadTileViewItem">

<Grid>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="CommonStates">

<VisualState x:Name="Normal"/>

<VisualState x:Name="Disabled">

<Storyboard>

<ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="DisabledVisual" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="MouseOver"/>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Border Margin="{TemplateBinding Padding}" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="5">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="Auto"/>

<RowDefinition Height="*"/>

</Grid.RowDefinitions>

<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Grid.Row="1" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>

<Border Background="{StaticResource RadTileView_HeaderBackground}" BorderBrush="{StaticResource RadTileView_HeaderBorder}" BorderThickness="0 0 0 1" CornerRadius="4 4 0 0" Padding="10 0 7 0">

<Grid MinHeight="28">

<Border x:Name="GripBarElement" Background="Transparent">

<ContentPresenter HorizontalAlignment="Left" Margin="0,0,10,0" VerticalAlignment="Center" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}"/>

</Border>

<ToggleButton x:Name="MaximizeToggleButton" Height="17" HorizontalAlignment="Right" VerticalAlignment="Center" Width="17">

<ToggleButton.Template>

<ControlTemplate TargetType="ToggleButton">

<Grid>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="FocusStates">

<VisualState x:Name="Focused"/>

<VisualState x:Name="Unfocused"/>

</VisualStateGroup>

<VisualStateGroup x:Name="CommonStates">

<VisualState x:Name="Disabled"/>

<VisualState x:Name="Normal"/>

<VisualState x:Name="MouseOver">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundOver}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderOver}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundOver}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path2Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundOver}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path3Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderOver}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderOver}"/>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Pressed">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundPressed}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderPressed}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path1Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundPressed}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path2Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonBackgroundPressed}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path3Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderPressed}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Path5Check" Storyboard.TargetProperty="Fill">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource RadTileView_ButtonInnerBorderPressed}"/>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

<VisualStateGroup x:Name="CheckStates">

<VisualState x:Name="Checked">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="checkedArrow" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="uncheckedArrow" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Unchecked"/>

<VisualState x:Name="Indeterminate"/>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Grid x:Name="uncheckedArrow" Height="13" Width="17" Visibility="Visible" Background="Transparent" ToolTipService.ToolTip="Maximize">

<Path x:Name="Path1" Fill="{StaticResource RadTileView_ButtonBackground}" Stretch="Fill" Height="11" HorizontalAlignment="Center" VerticalAlignment="Center" Width="15" Data="M3,4 L3,8 L12,8 L12,4 z M1.4999999,1.4210855E-14 L13.5,1.4210855E-14 C14.328427,-1.0430811E-07 15,0.67157274 15,1.4999999 L15,9.5 C15,10.328427 14.328427,11 13.5,11 L1.4999999,11 C0.67157286,11 0,10.328427 0,9.5 L0,1.4999999 C0,0.67157274 0.67157286,-1.0430811E-07 1.4999999,1.4210855E-14 z"/>

<Rectangle x:Name="Path4" Stroke="{StaticResource RadTileView_ButtonOuterBorder}" RadiusX="2" RadiusY="2" Height="13" HorizontalAlignment="Center" VerticalAlignment="Center" Width="17"/>

<Path x:Name="Path5" Fill="{StaticResource RadTileView_ButtonInnerBorder}" Stretch="Fill" Height="10.914" HorizontalAlignment="Center" VerticalAlignment="Center" Width="14.913" Opacity="0.7" Data="M11.956482,4.9564972 L12.956482,4.9564972 L12.956482,8.9564972 L11.956482,8.9564972 L3.9564819,8.9564972 L3.9564819,7.9564972 L11.956482,7.9564972 z M1.5000182,0 L13.500164,0 C14.121492,3.0788389E-08 14.654589,0.37776613 14.882304,0.91614765 L14.912999,1.0000155 L1.0000072,1.0000155 L1.0000072,10.913 L0.91614342,10.882306 C0.37776428,10.65459 -5.9605348E-08,10.12149 7.0536E-15,9.5001593 L7.0536E-15,1.5000254 C-5.9605348E-08,0.67158419 0.67158097,3.0788389E-08 1.5000182,0 z"/>

<Rectangle x:Name="Path6" Stroke="{StaticResource RadTileView_ButtonInnerBorderRectangle}" Height="4" HorizontalAlignment="Center" VerticalAlignment="Center" Width="9"/>

</Grid>

<Grid x:Name="checkedArrow" Height="17" Margin="0 1 0 0" Width="17" Visibility="Collapsed" Background="Transparent" ToolTipService.ToolTip="Minimize">

<Path x:Name="PathCheck" Stretch="Fill" Stroke="{StaticResource RadTileView_ButtonOuterBorder}" Height="13" HorizontalAlignment="Right" VerticalAlignment="Top" Width="13" Data="M2.5,0.5 L10.5,0.5 C11.6,0.5 12.5,1.31 12.5,2.5 L12.5,10.5 C12.5,11.6 11.6,12.5 10.5,12.5 L6.5,12.5 L6.5,7.5 L0.5,7.5 L0.5,2.5 C0.5,1.4 1.4,0.5 2.5,0.5 z"/>

<Path x:Name="Path1Check" Fill="{StaticResource RadTileView_ButtonBackground}" Stretch="Fill" Margin="1,5,5,1" Data="M3,4 L3,8 L8,8 L8,4 z M1.5,0 L9.5,0 C10.3,0 11,0.6 11,1.5 L11,9.5 C11,10.3 10.3,11 9.5,11 L1.5,11 C0.6,11 0,10.3 0,9.5 L0,1.5 C0,0.6 0.6,0 1.5,0 z"/>

<Path x:Name="Path2Check" Fill="{StaticResource RadTileView_ButtonBackground}" Stretch="Fill" Margin="5.05,1,1,5" Data="M1.5,0 L9.5,0 C10.3,0 11,0.6 11,1.5 L11,3.5 L11,9.5 C11,10.3 10.3,11 9.5,11 L7,11 L7,8.5 L7,8 L7,4 L7,3.5 L0,3.5 L0,1.5 C0,0.6 0.6,0 1.5,0 z"/>

<Path x:Name="Path3Check" Fill="{StaticResource RadTileView_ButtonInnerBorder}" Stretch="Fill" Margin="5.05,1,1.05,5" Opacity="0.7" Data="M7.9,4.25 L8.9,4.25 L8.9,11.25 L7.9,11.25 z M1.5,0 L9.5,0 C10.1,0 10.6,0.4 10.9,0.9 L10.914,0.9 L0.99,0.99 L0.99,2.5 L0,2.5 L0,1.5 C0,0.6 0.6,0 1.5,0 z"/>

<Rectangle x:Name="Path4Check" Stroke="{StaticResource RadTileView_ButtonOuterBorder}" RadiusX="2" RadiusY="2" Height="13" HorizontalAlignment="Right" Margin="0,3.5,4,0" VerticalAlignment="Top" Width="13"/>

<Path x:Name="Path5Check" Fill="{StaticResource RadTileView_ButtonInnerBorder}" Stretch="Fill" Margin="1,5,5.05,1.1" Opacity="0.7" Data="M7.99,5 L9,5 L9,8.99 L8,8.99 L4,9 L4,8 L7.99,8 z M1.4,0 L9.4,0 C10,0 10.69,0.4 10.9,0.98 L10.914,0.99 L0.99,0.99 L0.99,10.914 L0.98,10.90 C0.4,10.69 0,10.14 0,9.5 L0,1.5 C0,0.675 0.675,0 1.5,0 z"/>

<Rectangle x:Name="Path6Check" Stroke="{StaticResource RadTileView_ButtonInnerBorderRectangle}" Height="4" Margin="4,0,8,4" VerticalAlignment="Bottom"/>

</Grid>

</Grid>

</ControlTemplate>

</ToggleButton.Template>

</ToggleButton>

</Grid>

</Border>

<Rectangle x:Name="DisabledVisual" Fill="{StaticResource DisabledBrush}" RadiusX="4" RadiusY="4" Visibility="Collapsed" Grid.RowSpan="2"/>

</Grid>

</Border>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>