自定义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. c++中的重名问题

    看C++视频教程-范磊主讲(2.91G)视频学习笔记整理. 1.c++为什么要引入名字空间(namespace)? c++引入名字空间这个概念,是为了避免重名问题,比如说避免重复的函数名或者变量名引起 ...

  2. 百度编辑器UEditor常用设置函数大全

    在线文档对UEditor说明不够全面,收集了一些常用的方法和基本设置,以供参考.1.创建编辑器UE.getEditor('editor', { initialFrameWidth:"100% ...

  3. CSS基础转载

    css基本知识框架:(一:基本知识缩影.二基本知识框架图) 1.css样式表的基本概念 2.样式表基本类型-----1.内嵌样式 2.内联样式3.链入外部样式表4.导入外部?式 3.样式表配置方法 4 ...

  4. Cats(3)- freeK-Free编程更轻松,Free programming with freeK

    在上一节我们讨论了通过Coproduct来实现DSL组合:用一些功能简单的基础DSL组合成符合大型多复杂功能应用的DSL.但是我们发现:cats在处理多层递归Coproduct结构时会出现编译问题.再 ...

  5. PHP函数之自定义函数

    像数学中的函数一样,y=f(x)是函数基本的表达形式,x可看做是参数,y可看做是返回值,即函数定义就是一个被命名的.独立的代码段,它执行特定的任务,并可能给调用它的程序返回一个值. 自定义函数 函数的 ...

  6. Linux Cmd Tool 系列之—history & search command history

    History cmd is for list Bash's log of the historical cmd you typed 1. List last n commands history n ...

  7. ABP中使用Redis Cache(1)

    本文将讲解如何在ABP中使用Redis Cache以及使用过程中遇到的各种问题.下面就直接讲解使用步骤,Redis环境的搭建请直接网上搜索. 使用步骤: 一.ABP环境搭建 到http://www.a ...

  8. Xdebug文档(七) 远程调试

    Xdebug提示调试客户端接口与PHP运行相联系.该章节解释如何设置PHP与xdebug,并推荐一些客户端. 介绍 Xdebug的远程调试器允许你检查数据结构,交互式地穿过和调试你的代码.该协议已经开 ...

  9. js中的位运算

    按位运算符是把操作数看作一系列单独的位,而不是一个数字值.所以在这之前,不得不提到什么是"位": 数值或字符在内存内都是被存储为0和 1的序列,每个0和1被称之为1个位,比如说10 ...

  10. ajax大全

    简介 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 传统的web应用简单的操作需要加载全局 ...