自定义Exander,收缩侧边栏

样式如下

<Grid>
<Grid.Resources>
<ControlTemplate x:Key="ExpanderControlTemplate1" TargetType="{x:Type Expander}">
<Border x:Name="ExpanderBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3" SnapsToDevicePixels="True">
<Border.Background>
<ImageBrush ImageSource="弧形背景图.png"></ImageBrush>
</Border.Background>
<DockPanel>
<ToggleButton x:Name="HeaderSite" HorizontalAlignment="Center" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" DockPanel.Dock="Top" Foreground="{TemplateBinding Foreground}" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontStretch="{TemplateBinding FontStretch}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" MinWidth="0" MinHeight="0" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}">
<ToggleButton.Template>
<ControlTemplate TargetType="ToggleButton">
<Grid x:Name="ToggleGrid">
<StackPanel Orientation="Horizontal">
<Border x:Name="ToggleBoder1" Height="30" Width="30" Background="#FF5A83CF" CornerRadius="60,0,0,0"></Border>
<Border x:Name="ToggleBoder2" Height="30" Width="30" Background="#FF5A83CF" CornerRadius="0,60,0,0"></Border>
</StackPanel>
<Canvas Height="30" Width="60">
<Path x:Name="TogglePath" Data="M16,25 L30,10 46,25" Stroke="White" StrokeThickness="3"></Path>
</Canvas>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Data" TargetName="TogglePath" Value="M16,10 L30,25 46,10"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" TargetName="ToggleBoder1" Value="#FF3C7FB1"/>
<Setter Property="BorderBrush" TargetName="ToggleBoder2" Value="#FF3C7FB1"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="BorderBrush" TargetName="ToggleBoder1" Value="#FF3C7FB1"/>
<Setter Property="BorderBrush" TargetName="ToggleBoder2" Value="#FF3C7FB1"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="BorderBrush" TargetName="ToggleBoder1" Value="Transparent"/>
<Setter Property="BorderBrush" TargetName="ToggleBoder2" Value="Transparent"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate> </ToggleButton.Template>
</ToggleButton>
<ContentPresenter x:Name="ExpandSite" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" DockPanel.Dock="Bottom" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Visibility="Collapsed" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</DockPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True">
<Setter Property="Visibility" TargetName="ExpandSite" Value="Visible"/>
</Trigger>
<Trigger Property="IsExpanded" Value="False">
<Setter Property="Background" TargetName="ExpanderBorder" Value="{x:Null}"/>
</Trigger>
<Trigger Property="ExpandDirection" Value="Up">
<Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Top"/>
<Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Bottom"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Expander IsExpanded="True" Grid.Row="1" Cursor="Hand" Template="{DynamicResource ExpanderControlTemplate1}">
<Border Background="LightBlue" Height="100"></Border>
</Expander>
</Grid>

Style中,可以设置一个图片的背景,如弧形的,样式会很好看。图片找项目UI人员即可

<Border.Background>
    <ImageBrush ImageSource="弧形背景图.png"></ImageBrush>
</Border.Background>

												

WPF 自定义Expander的更多相关文章

  1. WPF 自定义柱状图 BarChart

    WPF 自定义柱状图 当前的Telerik控件.DevExpress控件在图表控件方面做得不错,但是有时项目中需要特定的样式,不是只通过修改图表的模板和样式就能实现的. 或者说,通过修改当前的第三方控 ...

  2. wpf 自定义圆形按钮

    wpf 自定义圆形按钮 效果图 默认样式 获取焦点样式 点击样式 下面是实现代码: 一个是自定义控件类,一个是控件类皮肤 using System; using System.Collections. ...

  3. WPF自定义窗口基类

    WPF自定义窗口基类时,窗口基类只定义.cs文件,xaml文件不定义.继承自定义窗口的类xaml文件的根节点就不再是<Window>,而是自定义窗口类名(若自定义窗口与继承者不在同一个命名 ...

  4. WPF 自定义 MessageBox (相对完善版)

    WPF 自定义 MessageBox (相对完善版)     基于WPF的自定义 MessageBox. 众所周知WPF界面美观.大多数WPF元素都可以简单的修改其样式,从而达到程序的风格统一.可是当 ...

  5. WPF自定义Window样式(2)

    1. 引言 在上一篇中,介绍了如何建立自定义窗体.接下来,我们需要考虑将该自定义窗体基类放到类库中去,只有放到类库中,我们才能在其他地方去方便的引用该基类. 2. 创建类库 接上一篇的项目,先添加一个 ...

  6. WPF自定义Window样式(1)

    1. 引言 WPF是制作界面的一大利器.最近在做一个项目,用的就是WPF.既然使用了WPF了,那么理所当然的,需要自定义窗体样式.所使用的代码是在网上查到的,遗憾的是,整理完毕后,再找那篇帖子却怎么也 ...

  7. WPF自学入门(九)WPF自定义窗口基类

    今天简单记录一个知识点:WPF自定义窗口基类,常用winform的人知道,winform的窗体继承是很好用的,写一个基础窗体,直接在后台代码改写继承窗体名.但如果是WPF要继承窗体,我个人感觉没有理解 ...

  8. WPF自定义TabControl样式

    WPF自定义TabControl,TabControl美化 XAML代码: <TabControl x:Class="SunCreate.Common.Controls.TabCont ...

  9. WPF 自定义ComboBox样式,自定义多选控件

    原文:WPF 自定义ComboBox样式,自定义多选控件 一.ComboBox基本样式 ComboBox有两种状态,可编辑和不可编辑状态.通过设置IsEditable属性可以切换控件状态. 先看基本样 ...

随机推荐

  1. android srudio使用HttpClient

    最近学习Android网络编程,在AndroidStudio下无法使用HttpClient,在网上找到了答案在这里记下来: //官方原文Apache HTTP Client RemovalAndroi ...

  2. 25M时钟的梁祝演奏

    module liangzhu(clk_50M,rst,speaker); input clk_50M,rst; output speaker; reg speaker; //分频计数器paramet ...

  3. 关于tomcat文件下载配置

    前言 tomcat文件下载 关闭tomcat目录列表浏览功能 Tomcat 不能下载带中文文件名的附件的方法 在Java Web项目中文件下载是一个很常见的功能,最近在做项目中发现可以通过tomcat ...

  4. 数据结构与算法 Big O 备忘录与现实

    不论今天的计算机技术变化,新技术的出现,所有都是来自数据结构与算法基础.我们需要温故而知新.        算法.架构.策略.机器学习之间的关系.在过往和技术人员交流时,很多人对算法和架构之间的关系感 ...

  5. Lind.DDD.ExpressionExtensions动态构建表达式树,实现对数据集的权限控制

    回到目录 Lind.DDD框架里提出了对数据集的控制,某些权限的用户为某些表添加某些数据集的权限,具体实现是在一张表中存储用户ID,表名,检索字段,检索值和检索操作符,然后用户登陆后,通过自己权限来构 ...

  6. 十一个行为模式之观察者模式(Observer Pattern)

    定义: 定义对象之间一种一对多的关系,当被观察者状态变化时,可以自动地通知观察者并执行相关的业务操作.观察者模式又被称为发布-订阅模式等. 结构图: Subject:抽象主题类,定义了所有被观察类的通 ...

  7. 【Spring】浅析Spring框架的搭建

    c目录结构: // contents structure [-] Spring是什么 搭建Spring框架 简单Demo 1,建立User类 2,建立Test类 3,建立ApplicationCont ...

  8. Mvc视图的那些事

    最近参与项目底层重写,在代码组织方式,类型使用上已经与之前有了很大的不同,这里总结一下视图的使用. 一.视图中命名空间的使用 视图命名空间的使用方式大致有三种:一,完全限定名,如 @System.Da ...

  9. 利用CSS3D效果制作简易旋转木马效果

    最近看一下css3d的一些特性,想着也实验学习一下,制作个小demo之类的.就练习了一下.开发一个粗糙的选择木马效果,如图 其实就是找到角度和位置,计算每根柱子的旋转角度摆放到3d空间的置顶位置即可. ...

  10. VMware VirtualBox共存时桥接注意

    今天在VMware必须桥接的一个虚拟机上需要连接其他机器时,遇到总是连接不到的情况. 具体现象: HOST机器可以ping A机器 VMWare Guest机器无法ping A机器,也无法ping H ...