Ali Rafiee
Top achievements
Rank 1
Ali Rafiee
asked on 02 Aug 2011, 10:40 PM
Hi,
I have a page with a RabPanelBar, which has 4 RadPanelBarItems in it. For only the last RadPanelBarItem i want to remove the header.
I have looked at the following thread:
http://www.telerik.com/community/forums/silverlight/panelbar/how-to-remove-header-from-the-panelbaritem.aspx
But couldn't figure out how to do it. The last panel has a single button for it's content, and when I tried the method in the link above, it would put the button in the header of the panel.
Can anyone please help me with this?
Just so you guys know I have followed the tutorial below to change the style of the panelbar so that it doesn't do any highlighting:
http://www.screencast.com/users/Dimitrina/folders/Jing/media/1743bafd-3bd1-4507-a9af-ef5b1a66b3d0
Thanks.
I have a page with a RabPanelBar, which has 4 RadPanelBarItems in it. For only the last RadPanelBarItem i want to remove the header.
I have looked at the following thread:
http://www.telerik.com/community/forums/silverlight/panelbar/how-to-remove-header-from-the-panelbaritem.aspx
But couldn't figure out how to do it. The last panel has a single button for it's content, and when I tried the method in the link above, it would put the button in the header of the panel.
Can anyone please help me with this?
Just so you guys know I have followed the tutorial below to change the style of the panelbar so that it doesn't do any highlighting:
http://www.screencast.com/users/Dimitrina/folders/Jing/media/1743bafd-3bd1-4507-a9af-ef5b1a66b3d0
Thanks.
7 Answers, 1 is accepted
0
Hello Ali Rafiee,
Petar Mladenov
the Telerik team
Have you tried using an empty string as a header of the last RadPanelBarItem. Please check out the attached project and let us know if this could fit in your scenario. Thank you for your cooperation.
Petar Mladenov
the Telerik team
Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>
0
Ali Rafiee
Top achievements
Rank 1
answered on 08 Aug 2011, 03:06 PM
Hi Petar,
Thank you for the reply. I'm attempting to remove the header all together, not just the text part.
The only thing I have managed to do so far is to reduce the size of the header, but it is still there.
See the attached image.
Please let me know if there is any way I can remove/hide the header for the last RadPanelBarItem.
Thanks
Ali
Thank you for the reply. I'm attempting to remove the header all together, not just the text part.
The only thing I have managed to do so far is to reduce the size of the header, but it is still there.
See the attached image.
Please let me know if there is any way I can remove/hide the header for the last RadPanelBarItem.
Thanks
Ali
0
Ali Rafiee
Top achievements
Rank 1
answered on 08 Aug 2011, 03:46 PM
Hi Petar,
I figured it out. I loaded the project in Blend, edited the style for the last RadPanelbarItem. And set the visibility of the header to collapsed.
Worked great.
Ali
I figured it out. I loaded the project in Blend, edited the style for the last RadPanelbarItem. And set the visibility of the header to collapsed.
Worked great.
Ali
0
Hi Ali Rafiee,
Petar Mladenov
the Telerik team
I'm glad to hear that you have succeeded. Please let us know if you need further assistance or info.
Best wishes,Petar Mladenov
the Telerik team
Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>
0
Eirik H
Top achievements
Rank 2
answered on 09 Sep 2011, 08:08 AM
@Ali
So what did you end up with after editing the style in Blend XAML-wise? I'm trying to do the same, but we don't have Blend ..
So what did you end up with after editing the style in Blend XAML-wise? I'm trying to do the same, but we don't have Blend ..
0
Ali Rafiee
Top achievements
Rank 1
answered on 09 Sep 2011, 08:42 PM
Hi Eirik,
Here is the modifications to the style for the PanelBarItem. The resource that I'm positing has two different styles "RadPanelBarItemNoHeaderStyle" and "RadPanelBarItemNoHiLiteStyle", one for removing the header of an item and one to remove the highlighting feature of the panelbar. The NoHeaderStyle also implements the no highlight.
And here is an example of how to apply it:
I hope this helps you out.
Let me know if you need clarification on anything.
Ali
Here is the modifications to the style for the PanelBarItem. The resource that I'm positing has two different styles "RadPanelBarItemNoHeaderStyle" and "RadPanelBarItemNoHiLiteStyle", one for removing the header of an item and one to remove the highlighting feature of the panelbar. The NoHeaderStyle also implements the no highlight.
<
UserControl.Resources
>
<
LinearGradientBrush
x:Key
=
"ControlItem_Background_Normal"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"White"
/>
<
GradientStop
Color
=
"Gainsboro"
Offset
=
"0.43"
/>
<
GradientStop
Color
=
"#FFADADAD"
Offset
=
"0.44"
/>
<
GradientStop
Color
=
"#FFD4D4D4"
Offset
=
"1"
/>
</
LinearGradientBrush
>
<
SolidColorBrush
x:Key
=
"ControlItem_OuterBorder_Normal"
Color
=
"#FF848484"
/>
<
SolidColorBrush
x:Key
=
"ControlForeground_Normal"
Color
=
"#FF000000"
/>
<
SolidColorBrush
x:Key
=
"ControlItem_InnerBorder_Normal"
Color
=
"#FFFFFFFF"
/>
<
SolidColorBrush
x:Key
=
"ControlItem_OuterBorder_MouseOver"
Color
=
"#FFFFC92B"
/>
<
SolidColorBrush
x:Key
=
"ControlItem_InnerBorder_MouseOver"
Color
=
"#FFFFFFFF"
/>
<
LinearGradientBrush
x:Key
=
"ControlItem_Background_MouseOver"
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
>
<
LinearGradientBrush
x:Key
=
"ControlItem_OuterBorder_Selected"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FF282828"
/>
<
GradientStop
Color
=
"#FF5F5F5F"
Offset
=
"1"
/>
</
LinearGradientBrush
>
<
LinearGradientBrush
x:Key
=
"ControlItem_InnerBorder_Selected"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFB69A78"
/>
<
GradientStop
Color
=
"#FFFFE17A"
Offset
=
"0.126"
/>
</
LinearGradientBrush
>
<
LinearGradientBrush
x:Key
=
"ControlItem_Background_Selected"
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
>
<
SolidColorBrush
x:Key
=
"ControlOuterBorder_Disabled"
Color
=
"#FF989898"
/>
<
SolidColorBrush
x:Key
=
"ControlInnerBorder_Disabled"
Color
=
"Transparent"
/>
<
SolidColorBrush
x:Key
=
"ControlBackground_Disabled"
Color
=
"#FFE0E0E0"
/>
<
SolidColorBrush
x:Key
=
"ControlElement_Normal"
Color
=
"#FF000000"
/>
<
SolidColorBrush
x:Key
=
"FocusBrushBlack"
Color
=
"#FF000000"
/>
<
ControlTemplate
x:Key
=
"PanelBarItemTopLevelTemplate"
TargetType
=
"telerik:RadPanelBarItem"
>
<
Grid
x:Name
=
"RootElement"
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"Auto"
/>
<
RowDefinition
Height
=
"*"
/>
</
Grid.RowDefinitions
>
<
VisualStateManager.VisualStateGroups
>
<
VisualStateGroup
x:Name
=
"CommonStates"
>
<
VisualState
x:Name
=
"Normal"
/>
<
VisualState
x:Name
=
"Disabled"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"NormalVisual"
/>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"DisabledVisual"
/>
<
DoubleAnimation
Duration
=
"0"
To
=
"0.5"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"arrow"
/>
<
DoubleAnimation
Duration
=
"0"
To
=
"0.5"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"Header"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"MouseOver"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"MouseOverVisual"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"MouseOut"
/>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"SelectionStates"
>
<
VisualState
x:Name
=
"Unselected"
/>
<
VisualState
x:Name
=
"Selected"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"SelectVisual"
/>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"ExpandStates"
>
<
VisualState
x:Name
=
"Expanded"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"180"
Storyboard.TargetProperty
=
"Angle"
Storyboard.TargetName
=
"directionRotation"
/>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"ItemsContainer"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
<
DoubleAnimation
Duration
=
"0:0:0.2"
From
=
"0.0"
To
=
"1.0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"ItemsContainer"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Collapsed"
/>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"FocusStates"
>
<
VisualState
x:Name
=
"Focused"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"FocusVisual"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Unfocused"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"FocusVisual"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Collapsed"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
</
VisualStateManager.VisualStateGroups
>
<
Grid
x:Name
=
"HeaderRow"
>
<
Grid.ColumnDefinitions
>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"*"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
</
Grid.ColumnDefinitions
>
<
Border
x:Name
=
"NormalVisual"
BorderBrush
=
"{TemplateBinding BorderBrush}"
BorderThickness
=
"{TemplateBinding BorderThickness}"
Grid.ColumnSpan
=
"5"
>
<
Border
BorderBrush
=
"{StaticResource ControlItem_InnerBorder_Normal}"
BorderThickness
=
"1"
Background
=
"{TemplateBinding Background}"
/>
</
Border
>
<
Border
x:Name
=
"MouseOverVisual"
BorderBrush
=
"{StaticResource ControlItem_OuterBorder_MouseOver}"
BorderThickness
=
"1"
Grid.ColumnSpan
=
"5"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlItem_InnerBorder_MouseOver}"
BorderThickness
=
"1"
Background
=
"{StaticResource ControlItem_Background_MouseOver}"
/>
</
Border
>
<
Border
x:Name
=
"SelectVisual"
BorderBrush
=
"{StaticResource ControlItem_OuterBorder_Selected}"
BorderThickness
=
"1"
Grid.ColumnSpan
=
"5"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlItem_InnerBorder_Selected}"
BorderThickness
=
"1"
Background
=
"{StaticResource ControlItem_Background_Selected}"
/>
</
Border
>
<
Border
x:Name
=
"DisabledVisual"
BorderBrush
=
"{StaticResource ControlOuterBorder_Disabled}"
BorderThickness
=
"1"
Grid.ColumnSpan
=
"5"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlInnerBorder_Disabled}"
BorderThickness
=
"1"
Background
=
"{StaticResource ControlBackground_Disabled}"
/>
</
Border
>
<
Path
x:Name
=
"arrow"
Grid.Column
=
"5"
Data
=
"M 1,1.5 L 4.5,5 L 8,1.5"
HorizontalAlignment
=
"Right"
Margin
=
"7 0"
Opacity
=
"1"
RenderTransformOrigin
=
"0.5 0.5"
Stretch
=
"None"
Stroke
=
"{StaticResource ControlElement_Normal}"
StrokeThickness
=
"2"
VerticalAlignment
=
"Center"
>
<
Path.RenderTransform
>
<
RotateTransform
x:Name
=
"directionRotation"
Angle
=
"0"
/>
</
Path.RenderTransform
>
</
Path
>
<
ContentPresenter
x:Name
=
"Header"
Grid.ColumnSpan
=
"4"
ContentTemplate
=
"{TemplateBinding HeaderTemplate}"
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
Margin
=
"{TemplateBinding Padding}"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
/>
<
Rectangle
x:Name
=
"FocusVisual"
Grid.ColumnSpan
=
"5"
Grid.Column
=
"0"
IsHitTestVisible
=
"False"
Stroke
=
"{StaticResource FocusBrushBlack}"
StrokeThickness
=
"1"
StrokeDashArray
=
"1 2"
Visibility
=
"Collapsed"
/>
</
Grid
>
<
Grid
x:Name
=
"ItemsContainer"
Grid.Row
=
"1"
Visibility
=
"Collapsed"
>
<
telerik:LayoutTransformControl
x:Name
=
"transformationRoot"
>
<
ItemsPresenter
/>
</
telerik:LayoutTransformControl
>
</
Grid
>
</
Grid
>
</
ControlTemplate
>
<
ControlTemplate
x:Key
=
"PanelBarItemTopLevelNoHeaderTemplate"
TargetType
=
"telerik:RadPanelBarItem"
>
<
Grid
x:Name
=
"RootElement"
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"Auto"
/>
<
RowDefinition
Height
=
"*"
/>
</
Grid.RowDefinitions
>
<
VisualStateManager.VisualStateGroups
>
<
VisualStateGroup
x:Name
=
"CommonStates"
>
<
VisualState
x:Name
=
"Normal"
/>
<
VisualState
x:Name
=
"Disabled"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"NormalVisual"
/>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"DisabledVisual"
/>
<
DoubleAnimation
Duration
=
"0"
To
=
"0.5"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"arrow"
/>
<
DoubleAnimation
Duration
=
"0"
To
=
"0.5"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"Header"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"MouseOver"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"MouseOverVisual"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"MouseOut"
/>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"SelectionStates"
>
<
VisualState
x:Name
=
"Unselected"
/>
<
VisualState
x:Name
=
"Selected"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"SelectVisual"
/>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"ExpandStates"
>
<
VisualState
x:Name
=
"Expanded"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"180"
Storyboard.TargetProperty
=
"Angle"
Storyboard.TargetName
=
"directionRotation"
/>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"ItemsContainer"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
<
DoubleAnimation
Duration
=
"0:0:0.2"
From
=
"0.0"
To
=
"1.0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"ItemsContainer"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Collapsed"
/>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"FocusStates"
>
<
VisualState
x:Name
=
"Focused"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"FocusVisual"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Unfocused"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"FocusVisual"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Collapsed"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
</
VisualStateManager.VisualStateGroups
>
<
Grid
x:Name
=
"HeaderRow"
Visibility
=
"Collapsed"
>
<
Grid.ColumnDefinitions
>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"*"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
</
Grid.ColumnDefinitions
>
<
Border
x:Name
=
"NormalVisual"
BorderBrush
=
"{TemplateBinding BorderBrush}"
BorderThickness
=
"{TemplateBinding BorderThickness}"
Grid.ColumnSpan
=
"5"
>
<
Border
BorderBrush
=
"{StaticResource ControlItem_InnerBorder_Normal}"
BorderThickness
=
"1"
Background
=
"{TemplateBinding Background}"
/>
</
Border
>
<
Border
x:Name
=
"MouseOverVisual"
BorderBrush
=
"{StaticResource ControlItem_OuterBorder_MouseOver}"
BorderThickness
=
"1"
Grid.ColumnSpan
=
"5"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlItem_InnerBorder_MouseOver}"
BorderThickness
=
"1"
Background
=
"{StaticResource ControlItem_Background_MouseOver}"
/>
</
Border
>
<
Border
x:Name
=
"SelectVisual"
BorderBrush
=
"{StaticResource ControlItem_OuterBorder_Selected}"
BorderThickness
=
"1"
Grid.ColumnSpan
=
"5"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlItem_InnerBorder_Selected}"
BorderThickness
=
"1"
Background
=
"{StaticResource ControlItem_Background_Selected}"
/>
</
Border
>
<
Border
x:Name
=
"DisabledVisual"
BorderBrush
=
"{StaticResource ControlOuterBorder_Disabled}"
BorderThickness
=
"1"
Grid.ColumnSpan
=
"5"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlInnerBorder_Disabled}"
BorderThickness
=
"1"
Background
=
"{StaticResource ControlBackground_Disabled}"
/>
</
Border
>
<
Path
x:Name
=
"arrow"
Grid.Column
=
"5"
Data
=
"M 1,1.5 L 4.5,5 L 8,1.5"
HorizontalAlignment
=
"Right"
Margin
=
"7 0"
Opacity
=
"1"
RenderTransformOrigin
=
"0.5 0.5"
Stretch
=
"None"
Stroke
=
"{StaticResource ControlElement_Normal}"
StrokeThickness
=
"2"
VerticalAlignment
=
"Center"
>
<
Path.RenderTransform
>
<
RotateTransform
x:Name
=
"directionRotation"
Angle
=
"0"
/>
</
Path.RenderTransform
>
</
Path
>
<
ContentPresenter
x:Name
=
"Header"
Grid.ColumnSpan
=
"4"
ContentTemplate
=
"{TemplateBinding HeaderTemplate}"
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
Margin
=
"{TemplateBinding Padding}"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
/>
<
Rectangle
x:Name
=
"FocusVisual"
Grid.ColumnSpan
=
"5"
Grid.Column
=
"0"
IsHitTestVisible
=
"False"
Stroke
=
"{StaticResource FocusBrushBlack}"
StrokeThickness
=
"1"
StrokeDashArray
=
"1 2"
Visibility
=
"Collapsed"
/>
</
Grid
>
<
Grid
x:Name
=
"ItemsContainer"
Grid.Row
=
"1"
Visibility
=
"Collapsed"
>
<
telerik:LayoutTransformControl
x:Name
=
"transformationRoot"
>
<
ItemsPresenter
/>
</
telerik:LayoutTransformControl
>
</
Grid
>
</
Grid
>
</
ControlTemplate
>
<
SolidColorBrush
x:Key
=
"ControlSubItem_OuterBorder_MouseOver"
Color
=
"#FFFFC92B"
/>
<
Thickness
x:Key
=
"ControlSubItem_OuterBorderThickness"
>1</
Thickness
>
<
SolidColorBrush
x:Key
=
"ControlSubItem_InnerBorder_MouseOver"
Color
=
"#FFFFFFFF"
/>
<
Thickness
x:Key
=
"ControlSubItem_InnerBorderThickness"
>1</
Thickness
>
<
LinearGradientBrush
x:Key
=
"ControlSubItem_Background_MouseOver"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFFFBA3"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFFFFBDA"
Offset
=
"0"
/>
</
LinearGradientBrush
>
<
CornerRadius
x:Key
=
"ControlSubItem_InnerCornerRadius"
>0</
CornerRadius
>
<
CornerRadius
x:Key
=
"ControlSubItem_OuterCornerRadius"
>1</
CornerRadius
>
<
SolidColorBrush
x:Key
=
"ControlSubItem_OuterBorder_Selected"
Color
=
"#FFFFC92B"
/>
<
SolidColorBrush
x:Key
=
"ControlSubItem_InnerBorder_Selected"
Color
=
"#FFFFFFFF"
/>
<
LinearGradientBrush
x:Key
=
"ControlSubItem_Background_Selected"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFCE79F"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFFDD3A8"
/>
</
LinearGradientBrush
>
<
ControlTemplate
x:Key
=
"PanelBarItemSecondLevelTemplate"
TargetType
=
"telerik:RadPanelBarItem"
>
<
Grid
x:Name
=
"RootElement"
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"Auto"
/>
<
RowDefinition
Height
=
"*"
/>
</
Grid.RowDefinitions
>
<
VisualStateManager.VisualStateGroups
>
<
VisualStateGroup
x:Name
=
"CommonStates"
>
<
VisualState
x:Name
=
"Normal"
/>
<
VisualState
x:Name
=
"Disabled"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"1.0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"DisabledVisual"
/>
</
Storyboard
>
</
VisualState
>
<!-- <
VisualState
x:Name
=
"MouseOver"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0:0:0.2"
To
=
"1.0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"MouseOverVisual"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"MouseOut"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0:0:0.2"
To
=
"0.0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"MouseOverVisual"
/>
</
Storyboard
>
</
VisualState
> -->
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"SelectionStates"
>
<
VisualState
x:Name
=
"Unselected"
/>
<!-- <
VisualState
x:Name
=
"Selected"
>
<
Storyboard
>
<
DoubleAnimation
Duration
=
"0"
To
=
"1"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"SelectionVisual"
/>
</
Storyboard
>
</
VisualState
> -->
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"ExpandStates"
>
<
VisualState
x:Name
=
"Expanded"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"ItemsContainer"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
<
DoubleAnimation
Duration
=
"0:0:0.2"
From
=
"0.0"
To
=
"1.0"
Storyboard.TargetProperty
=
"Opacity"
Storyboard.TargetName
=
"ItemsContainer"
/>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Collapsed"
/>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"FocusStates"
>
<
VisualState
x:Name
=
"Focused"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"FocusVisual"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Visible"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
<
VisualState
x:Name
=
"Unfocused"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetProperty
=
"Visibility"
Storyboard.TargetName
=
"FocusVisual"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
Value
=
"Collapsed"
/>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
</
VisualStateManager.VisualStateGroups
>
<
Grid
x:Name
=
"HeaderRow"
Background
=
"Transparent"
>
<!-- <
Border
x:Name
=
"MouseOverVisual"
BorderBrush
=
"{StaticResource ControlSubItem_OuterBorder_MouseOver}"
BorderThickness
=
"{StaticResource ControlSubItem_OuterBorderThickness}"
CornerRadius
=
"{StaticResource ControlSubItem_OuterCornerRadius}"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlSubItem_InnerBorder_MouseOver}"
BorderThickness
=
"{StaticResource ControlSubItem_InnerBorderThickness}"
Background
=
"{StaticResource ControlSubItem_Background_MouseOver}"
CornerRadius
=
"{StaticResource ControlSubItem_InnerCornerRadius}"
/>
</
Border
>-->
<!-- <
Border
x:Name
=
"SelectionVisual"
BorderBrush
=
"{StaticResource ControlSubItem_OuterBorder_Selected}"
BorderThickness
=
"{StaticResource ControlSubItem_OuterBorderThickness}"
CornerRadius
=
"{StaticResource ControlSubItem_OuterCornerRadius}"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlSubItem_InnerBorder_Selected}"
BorderThickness
=
"{StaticResource ControlSubItem_InnerBorderThickness}"
Background
=
"{StaticResource ControlSubItem_Background_Selected}"
CornerRadius
=
"{StaticResource ControlSubItem_InnerCornerRadius}"
/>
</
Border
> -->
<
Border
x:Name
=
"DisabledVisual"
BorderBrush
=
"{StaticResource ControlOuterBorder_Disabled}"
BorderThickness
=
"{StaticResource ControlSubItem_OuterBorderThickness}"
CornerRadius
=
"{StaticResource ControlSubItem_OuterCornerRadius}"
Opacity
=
"0"
>
<
Border
BorderBrush
=
"{StaticResource ControlInnerBorder_Disabled}"
BorderThickness
=
"{StaticResource ControlSubItem_InnerBorderThickness}"
Background
=
"{StaticResource ControlBackground_Disabled}"
CornerRadius
=
"{StaticResource ControlSubItem_InnerCornerRadius}"
/>
</
Border
>
<
ContentPresenter
x:Name
=
"Header"
ContentTemplate
=
"{TemplateBinding HeaderTemplate}"
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
Margin
=
"{TemplateBinding Padding}"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
/>
<
Rectangle
x:Name
=
"FocusVisual"
IsHitTestVisible
=
"False"
RadiusY
=
"2"
RadiusX
=
"2"
Stroke
=
"{StaticResource FocusBrushBlack}"
StrokeThickness
=
"1"
StrokeDashArray
=
"1 2"
Visibility
=
"Collapsed"
/>
</
Grid
>
<
Grid
x:Name
=
"ItemsContainer"
Grid.Row
=
"1"
Visibility
=
"Collapsed"
>
<
ItemsPresenter
/>
</
Grid
>
</
Grid
>
</
ControlTemplate
>
<
Style
x:Key
=
"RadPanelBarItemNoHiLiteStyle"
TargetType
=
"telerik:RadPanelBarItem"
>
<
Setter
Property
=
"Background"
Value
=
"{StaticResource ControlItem_Background_Normal}"
/>
<
Setter
Property
=
"BorderBrush"
Value
=
"{StaticResource ControlItem_OuterBorder_Normal}"
/>
<
Setter
Property
=
"BorderThickness"
Value
=
"1"
/>
<
Setter
Property
=
"Foreground"
Value
=
"{StaticResource ControlForeground_Normal}"
/>
<
Setter
Property
=
"TabNavigation"
Value
=
"Once"
/>
<
Setter
Property
=
"IsTabStop"
Value
=
"True"
/>
<
Setter
Property
=
"Template"
Value
=
"{StaticResource PanelBarItemTopLevelTemplate}"
/>
<
Setter
Property
=
"Padding"
Value
=
"3"
/>
<
Setter
Property
=
"HorizontalContentAlignment"
Value
=
"Stretch"
/>
<
Setter
Property
=
"VerticalContentAlignment"
Value
=
"Stretch"
/>
<
Setter
Property
=
"ChildItemsTemplate"
Value
=
"{StaticResource PanelBarItemSecondLevelTemplate}"
/>
<
Setter
Property
=
"ItemsPanel"
>
<
Setter.Value
>
<
ItemsPanelTemplate
>
<
telerik:PanelBarPanel
/>
</
ItemsPanelTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>
<
Style
x:Key
=
"RadPanelBarItemNoHeaderStyle"
TargetType
=
"telerik:RadPanelBarItem"
>
<
Setter
Property
=
"Background"
Value
=
"{StaticResource ControlItem_Background_Normal}"
/>
<
Setter
Property
=
"BorderBrush"
Value
=
"{StaticResource ControlItem_OuterBorder_Normal}"
/>
<
Setter
Property
=
"BorderThickness"
Value
=
"1"
/>
<
Setter
Property
=
"Foreground"
Value
=
"{StaticResource ControlForeground_Normal}"
/>
<
Setter
Property
=
"TabNavigation"
Value
=
"Once"
/>
<
Setter
Property
=
"IsTabStop"
Value
=
"True"
/>
<
Setter
Property
=
"Template"
Value
=
"{StaticResource PanelBarItemTopLevelNoHeaderTemplate}"
/>
<
Setter
Property
=
"Padding"
Value
=
"3"
/>
<
Setter
Property
=
"HorizontalContentAlignment"
Value
=
"Stretch"
/>
<
Setter
Property
=
"VerticalContentAlignment"
Value
=
"Stretch"
/>
<
Setter
Property
=
"ChildItemsTemplate"
Value
=
"{StaticResource PanelBarItemSecondLevelTemplate}"
/>
<
Setter
Property
=
"ItemsPanel"
>
<
Setter.Value
>
<
ItemsPanelTemplate
>
<
telerik:PanelBarPanel
/>
</
ItemsPanelTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>
</
UserControl.Resources
>
And here is an example of how to apply it:
<
telerik:RadPanelBarItem
Name
=
"startPanel"
IsExpanded
=
"True"
IsEnabled
=
"False"
Style
=
"{StaticResource RadPanelBarItemNoHeaderStyle}"
>
<
Button
Content
=
"Start Activity"
FontSize
=
"20"
Height
=
"35"
HorizontalAlignment
=
"Center"
Margin
=
"14,20,0,20"
Name
=
"startButton"
VerticalAlignment
=
"Top"
Width
=
"200"
Click
=
"startButton_Click"
/>
</
telerik:RadPanelBarItem
>
I hope this helps you out.
Let me know if you need clarification on anything.
Ali
0
Eirik H
Top achievements
Rank 2
answered on 12 Sep 2011, 06:37 AM
Thank you, Ali. Saved my day!
Edit: Btw, can't believe one needs to build a whole new control template and that it took that many lines of XAML just to remove the 10 pixels or so the header renders as when there is no header text set ...
Edit: Btw, can't believe one needs to build a whole new control template and that it took that many lines of XAML just to remove the 10 pixels or so the header renders as when there is no header text set ...