wpf -----Expander自定义样式

Expander是一个可以展开和折叠的控件，由ContentPresenter和ToggleButton组成

 

<!--Expander样式-->
<Style x:Key="ExpanderStyle" TargetType="{x:Type Expander}">
<Setter Property="Foreground" Value="Black"/>
<Setter Property="FontFamily" Value="宋体" />
<Setter Property="FontSize" Value="12" />
<Setter Property="Background" Value="#ffffff"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Width" Value="276"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Expander}">
<Canvas Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
<ToggleButton x:Name="HeaderSite" 
Canvas.Top="0"
ContentTemplate="{TemplateBinding HeaderTemplate}" 
ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}"
Content="{TemplateBinding Header}" 
IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" 
Style="{DynamicResource ToggleButtonStyle}" />
<Border x:Name="ExpandSite" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
Visibility="Collapsed" 


Canvas.Top="0" Canvas.Left="0"


Focusable="false"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" 
Background="#ffffff" ScrollViewer.VerticalScrollBarVisibility="Hidden">
<ContentPresenter Margin="10 0" 
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Border>

</Canvas>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="true">
<Setter Property="Visibility" TargetName="ExpandSite" Value="Visible"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

 

 

 

 

 

<!--ToggleButton样式-->

<!--ToggleButton样式-->

<Style x:Key="ToggleButtonStyle" TargetType="{x:Type ToggleButton}">

<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="Width" Value="275"/>
<Setter Property="Height" Value="25" />

<Setter Property="Background" Value="#ffffff" />

<Setter Property="Foreground" Value="#FF217c"/>
<Setter Property="FontSize" Value="12" />
<Setter Property="FontFamily" Value="宋体" />
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="10 5"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Canvas Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" 
Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
<Canvas x:Name="canvNormal" Visibility="Visible" 
Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" 
Background="{TemplateBinding Background}" SnapsToDevicePixels="True" Canvas.Right="0">
<Rectangle Width="275" Height="35" Fill="Red" Canvas.Right="0"/>
<Path Data="M 0 0 L 6 -6 12 0 " Stroke="#7D7D7D" StrokeThickness="2" Canvas.Right="5" Canvas.Top="18"/>
<!--<Rectangle Width="{TemplateBinding Width}" Height="1" Canvas.Bottom="0" Fill="#E3E3E3" />-->
</Canvas>
<Canvas x:Name="canvChecked" Visibility="Hidden" 
Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" 
Background="{TemplateBinding Background}" SnapsToDevicePixels="True" Canvas.Right="0">
<Path Data="M 0 0 L 6 6 12 0 " Stroke="#7D7D7D" StrokeThickness="2" Canvas.Right="5" Canvas.Top="10"/>
<Rectangle Width="{TemplateBinding Width}" Height="1" Canvas.Bottom="0" Fill="#E3E3E3" />
</Canvas>

<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
Margin="{TemplateBinding Padding}" 
RecognizesAccessKey="True" 
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Canvas>

<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="true">
<!--点击颜色-->
<Setter Property="Background" Value="Red"/>
</Trigger>
<Trigger Property="IsChecked" Value="true">
<Setter Property="Visibility" TargetName="canvChecked" Value="Visible" />
<Setter Property="Visibility" TargetName="canvNormal" Value="Hidden" />
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>

</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

 

 

主程序代码：

<Expander ExpandDirection="Down " Width="276"
HorizontalAlignment="Left" IsExpanded="true" 
Style="{DynamicResource ExpanderStyle}" Height="24" VerticalAlignment="Bottom" >
<Expander.Header>
<TextBlock Text="2.分析图" Name="abc" PreviewMouseLeftButtonDown="CloseClick"/>
</Expander.Header>
<!--<Expander.Content>
<TextBlock Text="文本内容" TextWrapping="Wrap" Name="asdf" />
</Expander.Content>-->
</Expander>

 

 

 参考的链接为：https://blog.csdn.net/Qiustion/article/details/24377555