本文共 5343 字,大约阅读时间需要 17 分钟。
WPF 控件Expander其实是由ToggleButton+ContentPresenter 组成的Expander样式代码:
<Style x:Key="ExpanderStyle" TargetType="{x:Type Expander}">
<Setter Property="Foreground" Value="#FF217cb5"/> <Setter Property="FontFamily" Value="宋体" /> <Setter Property="FontSize" Value="14" /> <Setter Property="Background" Value="Transparent"/> <Setter Property="HorizontalContentAlignment" Value="Stretch"/> <Setter Property="VerticalContentAlignment" Value="Stretch"/> <Setter Property="BorderBrush" Value="Transparent"/> <Setter Property="BorderThickness" Value="0"/> <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="35" Canvas.Left="0" Focusable="false" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Width="{Binding ElementName=HeaderSite,Path=Width}" Background="#7Ae9f4fa" > <ContentPresenter Margin="10 10" 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样式代码:
<Style x:Key="ToggleButtonStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="FocusVisualStyle" Value="{x:Null}"/> <Setter Property="Width" Value="245"/> <Setter Property="Height" Value="35" /> <Setter Property="Background" Value="#7Ad2e7f4" /> <Setter Property="Foreground" Value="#FF217cb5"/> <Setter Property="FontSize" Value="14" /> <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 10"/> <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="15" Height="35" Fill="#FFc7ebff" Canvas.Right="0"/> <Line X1="0" Y1="0" X2="0" Y2="15" Stroke="#297eb4" StrokeThickness="3" Margin="6 10" StrokeDashArray="1" Canvas.Right="0"/> </Canvas> <Canvas x:Name="canvChecked" Visibility="Hidden" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True" Canvas.Right="0"> <Path Data="M13.494,10.697l-3.497-3.6l-3.497,3.6L6.494,8.328l3.503-3.631l3.48,3.592L13.494,10.697z" Fill="#297eb4" Canvas.Right="5" Canvas.Top="8"/> <Path Data="M13.494,10.697l-3.497-3.6l-3.497,3.6L6.494,8.328l3.503-3.631l3.48,3.592L13.494,10.697z" Fill="#297eb4" Canvas.Right="5" Canvas.Top="15"/> <Rectangle Width="{TemplateBinding Width}" Height="1" Canvas.Bottom="0" Fill="#FFbacfda" /> </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="#FFd2e7f4" /> </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 "
HorizontalAlignment="Left" IsExpanded="true" Margin="46,0,0,60" Style="{DynamicResource ExpanderStyle1}" Height="122.5" VerticalAlignment="Bottom" > <Expander.Header> <TextBlock Text="标题" /> </Expander.Header> <Expander.Content> <TextBlock Text="文本内容" TextWrapping="Wrap" /> </Expander.Content> </Expander>注:暂不清楚为什么ToggleButton样式中的字体对Expander起不到作用
———————————————— 版权声明:本文为CSDN博主「qiustion」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。 原文链接:https://blog.csdn.net/Qiustion/article/details/24377555