博客
关于我
WPF Expander更改样式
阅读量:666 次
发布时间:2019-03-15

本文共 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

你可能感兴趣的文章
MySql中关于geometry类型的数据_空的时候如何插入处理_需用null_空字符串插入会报错_Cannot get geometry object from dat---MySql工作笔记003
查看>>
mysql中出现Incorrect DECIMAL value: '0' for column '' at row -1错误解决方案
查看>>
mysql中出现Unit mysql.service could not be found 的解决方法
查看>>
mysql中出现update-alternatives: 错误: 候选项路径 /etc/mysql/mysql.cnf 不存在 dpkg: 处理软件包 mysql-server-8.0的解决方法(全)
查看>>
Mysql中各类锁的机制图文详细解析(全)
查看>>
MySQL中地理位置数据扩展geometry的使用心得
查看>>
Mysql中存储引擎简介、修改、查询、选择
查看>>
Mysql中存储过程、存储函数、自定义函数、变量、流程控制语句、光标/游标、定义条件和处理程序的使用示例
查看>>
mysql中实现rownum,对结果进行排序
查看>>
mysql中对于数据库的基本操作
查看>>
Mysql中常用函数的使用示例
查看>>
MySql中怎样使用case-when实现判断查询结果返回
查看>>
Mysql中怎样使用update更新某列的数据减去指定值
查看>>
Mysql中怎样设置指定ip远程访问连接
查看>>
mysql中数据表的基本操作很难嘛,由这个实验来带你从头走一遍
查看>>
Mysql中文乱码问题完美解决方案
查看>>
mysql中的 +号 和 CONCAT(str1,str2,...)
查看>>
Mysql中的 IFNULL 函数的详解
查看>>
mysql中的collate关键字是什么意思?
查看>>
MySql中的concat()相关函数
查看>>