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

Display Hyperlink within GridViewHeaderCell

2 Answers 189 Views

GridView

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

Jack asked on 26 Mar 2013, 05:30 PM

I would like to display a hyperlink in a GridViewHeaderCell. I have found this thread. I would like to do this in XAML. I have extracted the markup for a GridViewHeaderCell and modified a derived style with no luck (below). I have two questions:

How can modify the derived style to display a hyperlink as well as the filter control (ie. only override the TextBlock displaying the column name)?
How can I bind both the display text and navigation URI to this hyperlink control?

<Style x:Key="GridViewHeaderCellStyle" TargetType="{x:Type telerik:GridViewHeaderCell}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:GridViewHeaderCell}">

<Grid x:Name="PART_OuterGrid">

<Grid.RowDefinitions>

<RowDefinition Height="*"/>

<RowDefinition Height="Auto"/>

</Grid.RowDefinitions>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="CommonStates">

<VisualStateGroup.Transitions>

<VisualTransition From="{x:Null}" GeneratedDuration="0:0:0.2" GeneratedEasingFunction="{x:Null}" Storyboard="{x:Null}" To="Normal"/>

<VisualTransition From="{x:Null}" GeneratedDuration="0:0:0.2" GeneratedEasingFunction="{x:Null}" Storyboard="{x:Null}" To="MouseOver"/>

</VisualStateGroup.Transitions>

<VisualState x:Name="Normal"/>

<VisualState x:Name="MouseOver">

<Storyboard>

<DoubleAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="GridViewHeaderCell_Over">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<SolidColorBrush Color="Black"/>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Ascending">

<Storyboard>

<ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<SolidColorBrush Color="Black"/>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="PART_SortIndicator">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="GridViewHeaderCell_Selected">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Descending">

<Storyboard>

<ObjectAnimationUsingKeyFrames BeginTime="0" Duration="0:0:0.001" Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<SolidColorBrush Color="Black"/>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="PART_SortIndicator">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="RenderTransform" Storyboard.TargetName="PART_SortIndicator">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<ScaleTransform ScaleY="-1" ScaleX="1"/>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="GridViewHeaderCell_Selected">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Grid x:Name="PART_HeaderCellGrid" MinHeight="26">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*"/>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<Border x:Name="GridViewHeaderCell" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2">

<Border BorderBrush="#FF4B4B4B" BorderThickness="1" Background="{TemplateBinding Background}"/>

</Border>

<Border x:Name="GridViewHeaderCell_Over" BorderBrush="#FFFFC92B" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" Opacity="0">

<Border BorderBrush="White" BorderThickness="1">

<Border.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

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

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

<GradientStop Color="#FFFFD25A" Offset="0.43"/>

<GradientStop Color="#FFFEEBAE" Offset="0.42"/>

</LinearGradientBrush>

</Border.Background>

</Border>

<Border x:Name="GridViewHeaderCell_Selected" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" Opacity="0">

<Border.BorderBrush>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

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

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

</LinearGradientBrush>

</Border.BorderBrush>

<Border BorderThickness="1">

<Border.BorderBrush>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFB69A78"/>

<GradientStop Color="#FFFFE17A" Offset="0.126"/>

</LinearGradientBrush>

</Border.BorderBrush>

<Border.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFFD74E" Offset="0.996"/>

<GradientStop Color="#FFFFDCAB" Offset="0.17"/>

<GradientStop Color="#FFFFB062" Offset="0.57"/>

<GradientStop Color="#FFFFD18F" Offset="0.56"/>

<GradientStop Color="#FFFFBA74"/>

</LinearGradientBrush>

</Border.Background>

</Border>

<ContentControl x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="0" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsTabStop="{TemplateBinding IsTabStop}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">

<ContentControl.Style>

<Style TargetType="{x:Type ContentControl}">

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

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

</Style>

</ContentControl.Style>

</ContentControl>

<Path x:Name="PART_SortIndicator" Grid.ColumnSpan="2" Data="M256,328L248,336 264,336" Fill="Black" HorizontalAlignment="Center" Height="3" Margin="0,3,0,0" Opacity="0" RenderTransformOrigin="0.5,0.5" Stretch="Fill" SnapsToDevicePixels="True" VerticalAlignment="Top" Width="5">

<Path.RenderTransform>

<TransformGroup>

<ScaleTransform ScaleY="1" ScaleX="1"/>

<SkewTransform AngleY="0" AngleX="0"/>

<RotateTransform Angle="0"/>

<TranslateTransform X="0" Y="0"/>

</TransformGroup>

</Path.RenderTransform>

</Path>

<telerik:FilteringDropDown x:Name="PART_DistinctFilterControl" Grid.Column="1" IsTabStop="False" Margin="0,0,4,0" Visibility="{TemplateBinding FilteringUIVisibility}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:FilteringDropDown>

<Thumb x:Name="PART_LeftHeaderGripper" Grid.ColumnSpan="2" HorizontalAlignment="Left" IsTabStop="{TemplateBinding IsTabStop}">

<Thumb.Style>

<Style TargetType="{x:Type Thumb}">

<Setter Property="Width" Value="8"/>

<Setter Property="Background" Value="Transparent"/>

<Setter Property="BorderBrush" Value="Transparent"/>

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

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

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

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

<Setter Property="Cursor" Value="SizeWE"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type Thumb}">

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</Thumb.Style>

</Thumb>

<Thumb x:Name="PART_RightHeaderGripper" Grid.ColumnSpan="2" HorizontalAlignment="Right" IsTabStop="{TemplateBinding IsTabStop}">

<Thumb.Style>

<Style TargetType="{x:Type Thumb}">

<Setter Property="Width" Value="8"/>

<Setter Property="Background" Value="Transparent"/>

<Setter Property="BorderBrush" Value="Transparent"/>

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

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

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

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

<Setter Property="Cursor" Value="SizeWE"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type Thumb}">

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</Thumb.Style>

</Thumb>

</Grid>

<telerik:FieldFilterControl x:Name="PART_FieldFilterControl" Column="{x:Null}" IsTabStop="False" Grid.Row="1" Visibility="{TemplateBinding FieldFilterControlVisibility}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:FieldFilterControl>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="Background">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

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

<GradientStop Color="#FF868686"/>

<GradientStop Color="#FF4F4F4F" Offset="0.42"/>

<GradientStop Color="#FF0E0E0E" Offset="0.43"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

<Setter Property="BorderBrush" Value="#FF848484"/>

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

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

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

<Setter Property="Padding" Value="5,0,3,0"/>

<Setter Property="Foreground" Value="White"/>

<Setter Property="DropMarkPen">

<Setter.Value>

<Pen Brush="White" Thickness="2"/>

</Setter.Value>

</Setter>

<Setter Property="SnapsToDevicePixels" Value="True"/>

</Style>

<Style x:Key="HyperlinkHeaderCellStyle" TargetType="{x:Type telerik:GridViewHeaderCell}"

BasedOn="{StaticResource GridViewHeaderCellStyle}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:GridViewHeaderCell}">

<Grid x:Name="PART_OuterGrid">

<Grid.RowDefinitions>

<RowDefinition Height="*"/>

<RowDefinition Height="Auto"/>

</Grid.RowDefinitions>

<Grid x:Name="PART_HeaderCellGrid" MinHeight="26">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*"/>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<ContentControl.Style>

<Style TargetType="{x:Type ContentControl}">

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

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

</Style>

</ContentControl.Style>

</ContentControl>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

2 Answers, 1 is accepted

Accepted