I have a layout circle error when I use a custom template for StakedBar. I add a button in the template in order to have more functionality (visual state …).
Here is the code i use
Thanks in advance...
<Style x:Key="ButtonStackedBarStyle" TargetType="Button"> |
<Setter Property="Template"> |
<Setter.Value> |
<ControlTemplate TargetType="Button"> |
<Grid> |
<VisualStateManager.VisualStateGroups> |
<VisualStateGroup x:Name="CommonStates"> |
<VisualState x:Name="Normal"/> |
<VisualState x:Name="MouseOver"> |
<Storyboard> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#AA000000"/> |
</ColorAnimationUsingKeyFrames> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#00000000"/> |
</ColorAnimationUsingKeyFrames> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#00000000"/> |
</ColorAnimationUsingKeyFrames> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#AA000000"/> |
</ColorAnimationUsingKeyFrames> |
</Storyboard> |
</VisualState> |
<VisualState x:Name="Pressed"> |
<Storyboard> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#AA000000"/> |
</ColorAnimationUsingKeyFrames> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#00000000"/> |
</ColorAnimationUsingKeyFrames> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#00000000"/> |
</ColorAnimationUsingKeyFrames> |
<ColorAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"> |
<SplineColorKeyFrame KeyTime="0" Value="#AA000000"/> |
</ColorAnimationUsingKeyFrames> |
</Storyboard> |
</VisualState> |
<VisualState x:Name="Disabled"> |
<Storyboard> |
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity"> |
<SplineDoubleKeyFrame KeyTime="0" Value=".55"/> |
</DoubleAnimationUsingKeyFrames> |
</Storyboard> |
</VisualState> |
</VisualStateGroup> |
<VisualStateGroup x:Name="FocusStates"> |
<VisualState x:Name="Focused"> |
<Storyboard> |
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity"> |
<SplineDoubleKeyFrame KeyTime="0" Value="1"/> |
</DoubleAnimationUsingKeyFrames> |
</Storyboard> |
</VisualState> |
<VisualState x:Name="Unfocused"/> |
</VisualStateGroup> |
</VisualStateManager.VisualStateGroups> |
<Grid Margin="0" Background="{TemplateBinding Background}"> |
<Rectangle x:Name="BackgroundGradient"> |
<Rectangle.Fill> |
<LinearGradientBrush EndPoint="0,.7" StartPoint="1,.7"> |
<GradientStop Color="#AA000000" Offset="0"/> |
<GradientStop Color="#20000000" Offset="0.3"/> |
<GradientStop Color="#20000000" Offset="0.7"/> |
<GradientStop Color="#AA000000" Offset="1"/> |
</LinearGradientBrush> |
</Rectangle.Fill> |
</Rectangle> |
</Grid> |
<ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/> |
<Rectangle x:Name="DisabledVisualElement" Fill="#FFFFFFFF" RadiusX="3" RadiusY="3" IsHitTestVisible="false" Opacity="0"/> |
<Rectangle x:Name="FocusVisualElement" Stroke="#FF6DBDD1" StrokeThickness="1" RadiusX="2" RadiusY="2" Margin="1" IsHitTestVisible="false" Opacity="0"/> |
</Grid> |
</ControlTemplate> |
</Setter.Value> |
</Setter> |
</Style> |
<ControlTemplate x:Key="ButtonStackedBarControlTemplate" TargetType="telerikCharting:StackedBar"> |
<Canvas> |
<Rectangle x:Name="PART_DefiningGeometry" |
Height="{TemplateBinding ItemActualHeight}" |
Width="{TemplateBinding ItemActualWidth}" |
RadiusX="5" |
RadiusY="5" |
StrokeThickness="2" /> |
<Button Height="{TemplateBinding ItemActualHeight}" |
Width="{TemplateBinding ItemActualWidth}" |
Background="{TemplateBinding Background}" |
BorderThickness="0" |
Style="{StaticResource ButtonStackedBarStyle}" |
ClickMode="Hover"> |
</Button> |
<telerikCharting:SeriesItemLabel x:Name="PART_SeriesItemLabel" |
HorizontalAlignment="Center" |
Width="{TemplateBinding ItemActualWidth}" |
Content="{TemplateBinding SeriesItemLabelText}" |
Visibility="{TemplateBinding SeriesItemLabelVisibility}" /> |
<Canvas.RenderTransform> |
<ScaleTransform x:Name="PART_AnimationTransform" ScaleY="0" /> |
</Canvas.RenderTransform> |
<Canvas.Triggers> |
<EventTrigger RoutedEvent="Rectangle.Loaded"> |
<EventTrigger.Actions> |
<BeginStoryboard> |
<Storyboard BeginTime="00:00:00.5" |
x:Name="PART_Storyboard"> |
<DoubleAnimationUsingKeyFrames |
Storyboard.TargetName="PART_AnimationTransform" |
Storyboard.TargetProperty="ScaleY" |
Duration="00:00:00.5" |
BeginTime="00:00:00.2"> |
<SplineDoubleKeyFrame KeySpline="0.646,0.239,1,1" KeyTime="00:00:00" Value="0.025"/> |
<SplineDoubleKeyFrame KeyTime="00:00:00.495" Value="0.99" KeySpline="0.26,0.564,0.512,1"/> |
</DoubleAnimationUsingKeyFrames> |
<DoubleAnimationUsingKeyFrames |
Storyboard.TargetName="PART_DefiningGeometry" |
Storyboard.TargetProperty="Opacity" |
Duration="00:00:00.5" |
BeginTime="00:00:00.2"> |
<SplineDoubleKeyFrame KeySpline="0.646,0.239,1,1" KeyTime="00:00:00" Value="0.7"/> |
<SplineDoubleKeyFrame KeyTime="00:00:00.495" Value="1" KeySpline="0.26,0.564,0.512,1"/> |
</DoubleAnimationUsingKeyFrames> |
</Storyboard> |
</BeginStoryboard> |
</EventTrigger.Actions> |
</EventTrigger> |
</Canvas.Triggers> |
</Canvas> |
</ControlTemplate> |
<Style x:Key="StackedBarErrorStyle" TargetType="telerikCharting:StackedBar"> |
<Setter Property="Background" Value="#FFFF0000"/> |
<Setter Property="Template" Value="{StaticResource ButtonStackedBarControlTemplate}" /> |
</Style> |