All geek questions in one place

Why doesn't my Expander expand when I install its template?

I am trying to change the color of the Expander expand button, and it seems that the only way to do this is to change my control template, since there is no property to set this.

So, I used the Show Me Template to capture a template for the Aero theme. I installed this template on my Expander, without any changes . This looks great, but clicking the button no longer expands it.

Can someone explain why this is happening? I expect this to be something simple, but I am still learning WPF and could not figure it out. Thanks.

Here is the complete code:

<Expander Header="Test"> <Expander.Template> <ControlTemplate TargetType="Expander" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:s="clr-namespace:System;assembly=mscorlib" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Border BorderThickness="{TemplateBinding Border.BorderThickness}" CornerRadius="3,3,3,3" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}" SnapsToDevicePixels="True"> <DockPanel> <ToggleButton IsChecked="False" Content="{TemplateBinding HeaderedContentControl.Header}" ContentTemplate="{TemplateBinding HeaderedContentControl.HeaderTemplate}" Foreground="{TemplateBinding TextElement.Foreground}" FontFamily="{TemplateBinding TextElement.FontFamily}" FontSize="{TemplateBinding TextElement.FontSize}" FontStretch="{TemplateBinding TextElement.FontStretch}" FontStyle="{TemplateBinding TextElement.FontStyle}" FontWeight="{TemplateBinding TextElement.FontWeight}" HorizontalContentAlignment="{TemplateBinding Control.HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding Control.VerticalContentAlignment}" Padding="{TemplateBinding Control.Padding}" Name="HeaderSite" MinWidth="0" MinHeight="0" Margin="1,1,1,1" DockPanel.Dock="Top"> <ToggleButton.Style> <Style TargetType="ToggleButton"> <Style.Resources> <ResourceDictionary /> </Style.Resources> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate TargetType="ToggleButton"> <Border Padding="{TemplateBinding Control.Padding}"> <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> <Grid.ColumnDefinitions> <ColumnDefinition Width="19" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="4,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" SnapsToDevicePixels="True" Grid.Column="1" /> </Grid> </Border> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsChecked"> <Setter TargetName="arrow" Property="Path.Data"> <Setter.Value> <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="UIElement.IsMouseOver"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF3C7FB1</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF222222</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="ButtonBase.IsPressed"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF526C7B</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="circle" Property="Shape.StrokeThickness"> <Setter.Value> <s:Double>1.5</s:Double> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF003366</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </ToggleButton.Style> <ToggleButton.FocusVisualStyle> <Style TargetType="IFrameworkInputElement"> <Style.Resources> <ResourceDictionary /> </Style.Resources> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <Border> <Rectangle Stroke="#FF000000" StrokeThickness="1" StrokeDashArray="1 2" Margin="0,0,0,0" SnapsToDevicePixels="True" /> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> </ToggleButton.FocusVisualStyle> </ToggleButton> <ContentPresenter Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Name="ExpandSite" Margin="{TemplateBinding Control.Padding}" HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding Control.VerticalContentAlignment}" Visibility="Collapsed" Focusable="False" DockPanel.Dock="Bottom" /> </DockPanel> </Border> <ControlTemplate.Triggers> <Trigger Property="Expander.IsExpanded"> <Setter TargetName="ExpandSite" Property="UIElement.Visibility" Value="{x:Static Visibility.Visible}" /> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="Expander.ExpandDirection"> <Setter TargetName="ExpandSite" Property="DockPanel.Dock" Value="{x:Static Dock.Right}" /> <Setter TargetName="HeaderSite" Property="DockPanel.Dock" Value="{x:Static Dock.Left}" /> <Setter TargetName="HeaderSite" Property="FrameworkElement.Style"> <Setter.Value> <Style TargetType="ToggleButton"> <Style.Resources> <ResourceDictionary /> </Style.Resources> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate TargetType="ToggleButton"> <Border Padding="{TemplateBinding Control.Padding}"> <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> <Grid.RowDefinitions> <RowDefinition Height="19" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid> <Grid.LayoutTransform> <TransformGroup> <TransformGroup.Children> <RotateTransform Angle="-90" /> </TransformGroup.Children> </TransformGroup> </Grid.LayoutTransform> <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> </Grid> <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="0,4,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" SnapsToDevicePixels="True" Grid.Row="1" /> </Grid> </Border> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsChecked"> <Setter TargetName="arrow" Property="Path.Data"> <Setter.Value> <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="UIElement.IsMouseOver"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF3C7FB1</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF222222</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="ButtonBase.IsPressed"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF526C7B</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="circle" Property="Shape.StrokeThickness"> <Setter.Value> <s:Double>1.5</s:Double> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF003366</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </Setter.Value> </Setter> <Trigger.Value> <x:Static Member="ExpandDirection.Right" /> </Trigger.Value> </Trigger> <Trigger Property="Expander.ExpandDirection"> <Setter TargetName="ExpandSite" Property="DockPanel.Dock" Value="{x:Static Dock.Top}" /> <Setter TargetName="HeaderSite" Property="DockPanel.Dock" Value="{x:Static Dock.Bottom}" /> <Setter TargetName="HeaderSite" Property="FrameworkElement.Style"> <Setter.Value> <Style TargetType="ToggleButton"> <Style.Resources> <ResourceDictionary /> </Style.Resources> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate TargetType="ToggleButton"> <Border Padding="{TemplateBinding Control.Padding}"> <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> <Grid.ColumnDefinitions> <ColumnDefinition Width="19" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Grid> <Grid.LayoutTransform> <TransformGroup> <TransformGroup.Children> <RotateTransform Angle="180" /> </TransformGroup.Children> </TransformGroup> </Grid.LayoutTransform> <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> </Grid> <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="4,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" SnapsToDevicePixels="True" Grid.Column="1" /> </Grid> </Border> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsChecked"> <Setter TargetName="arrow" Property="Path.Data"> <Setter.Value> <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="UIElement.IsMouseOver"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF3C7FB1</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF222222</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="ButtonBase.IsPressed"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF526C7B</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="circle" Property="Shape.StrokeThickness"> <Setter.Value> <s:Double>1.5</s:Double> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF003366</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </Setter.Value> </Setter> <Trigger.Value> <x:Static Member="ExpandDirection.Up" /> </Trigger.Value> </Trigger> <Trigger Property="Expander.ExpandDirection"> <Setter TargetName="ExpandSite" Property="DockPanel.Dock" Value="{x:Static Dock.Left}" /> <Setter TargetName="HeaderSite" Property="DockPanel.Dock" Value="{x:Static Dock.Right}" /> <Setter TargetName="HeaderSite" Property="FrameworkElement.Style"> <Setter.Value> <Style TargetType="ToggleButton"> <Style.Resources> <ResourceDictionary /> </Style.Resources> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate TargetType="ToggleButton"> <Border Padding="{TemplateBinding Control.Padding}"> <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> <Grid.RowDefinitions> <RowDefinition Height="19" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid> <Grid.LayoutTransform> <TransformGroup> <TransformGroup.Children> <RotateTransform Angle="90" /> </TransformGroup.Children> </TransformGroup> </Grid.LayoutTransform> <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> </Grid> <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="0,4,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" SnapsToDevicePixels="True" Grid.Row="1" /> </Grid> </Border> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsChecked"> <Setter TargetName="arrow" Property="Path.Data"> <Setter.Value> <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="UIElement.IsMouseOver"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF3C7FB1</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF222222</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> <Trigger Property="ButtonBase.IsPressed"> <Setter TargetName="circle" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF526C7B</SolidColorBrush> </Setter.Value> </Setter> <Setter TargetName="circle" Property="Shape.StrokeThickness"> <Setter.Value> <s:Double>1.5</s:Double> </Setter.Value> </Setter> <Setter TargetName="arrow" Property="Shape.Stroke"> <Setter.Value> <SolidColorBrush>#FF003366</SolidColorBrush> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>True</s:Boolean> </Trigger.Value> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </Setter.Value> </Setter> <Trigger.Value> <x:Static Member="ExpandDirection.Left" /> </Trigger.Value> </Trigger> <Trigger Property="UIElement.IsEnabled"> <Setter Property="TextElement.Foreground"> <Setter.Value> <DynamicResource ResourceKey="{x:Static SystemColors.GrayTextBrushKey}" /> </Setter.Value> </Setter> <Trigger.Value> <s:Boolean>False</s:Boolean> </Trigger.Value> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Expander.Template> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </Expander>
+4
source share
1 answer

When I edit a copy of the Expander template in Blend, which should do roughly the same thing as you do with ShowMeTheTemplate , the IsChecked ToggleButton property named HeaderSite not False (as in your XAML above), but this expression:

 IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"

Thus, the button switching state is tied to the IsExpanded property of the control. The way the toggle button works.

+3
source

Source: https://habr.com/ru/post/1335368/

More articles:


All Articles