这算是我比较喜欢的一个控件,以前在Winform中也常用类似的。它包装了一块内容,通过单击一个小箭头按钮可以显示或隐藏所包含的内容。在线帮助以及Web页面经常使用这种技术,因为既可以包含大量内容,而又不会让用户面对大量的多余信息而感到无所适从。

使用 Expander控件是非常简单的——只需要在该控件内部包装希望使其能够折叠的内容,通常,每个 Expander 控件开始都是折叠的,但是可以在代码或标记中设置 IsExpanded 属性来改变这种行为。控件的折叠是非常有趣,展开于叠起自动排版,这是我非常喜欢的。下面是我编写的一个Grid面板具有4个Expander控件的例子:

(折叠效果)

(展开效果)

XAML代码:

<Window x:Class="_1022_Expander.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions> <Expander Margin="5" Padding="5" Header="面板(1)">
<TextBlock>这是第一块面板内容,TextBlock</TextBlock>
</Expander>
<Expander Grid.Column="1" Margin="5" Padding="5" Header="面板(2)" ExpandDirection="Right">
<TextBlock TextWrapping="Wrap">第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。第二块面板多内容测试。。</TextBlock>
</Expander>
<Expander Grid.Row="1" Margin="5" Padding="5" Header="面板(3)">
<DockPanel>
<Label HorizontalAlignment="Left">伸缩面板:</Label>
<TextBox>Andrew-blog</TextBox>
</DockPanel>
</Expander>
<Expander Grid.Row="1" Grid.Column="1" Header="面板(4)">
<Label>http://Andrew-blog.cnblogs.com</Label>
</Expander>
</Grid>
</Window>

源码下载:http://files.cnblogs.com/andrew-blog/1022_Expander.rar

开发工具:VS2012

参考:http://www.wxzzz.com/?id=132

WPF Expander控件(扩展面板)的更多相关文章

  1. WPF开源控件扩展库 - MaterialDesignExtensions

    Material Design Extensions 在WPF开源控件库 Material Design in XAML Toolkit(本站介绍:链接)的基础上进行了控件扩展和特性新增.本开源项目中 ...

  2. 继续聊WPF——Expander控件(1)

    这个控件最实用的地方,就是做导航栏. <StackPanel Margin="20,20" Width="100" Height="460&qu ...

  3. 继续聊WPF——Expander控件(2)

    <Window x:Class="Expander_Sample2.Window1" xmlns="http://schemas.microsoft.com/win ...

  4. 《WPF》Expander控件简单美化

    示例图: Expander控件功能很常见, 一般用于系统左侧的菜单收缩面板. 1.主要的组成 一个头部(header) 和 一个 内容(content) 组成. <Expander Expand ...

  5. WPF中Expander控件样式,ListBox的样式(带checkbox)恢复

    Expander控件样式: <ControlTemplate x:Key="ExpanderToggleButton" TargetType="ToggleButt ...

  6. 迟到的 WPF 学习 —— 控件

    这一章书中内容比较多而杂,但每个对象的内容又相对简短,所以只挑选里边有代表性的内容做记录. 1. Label 控件:一个基础的简单的 ContentControl,Labe 支持快捷键文本的设置,可以 ...

  7. 创建 WPF 工具箱控件

    创建 WPF 工具箱控件 WPF (Windows Presentation Framework) 工具箱控件模板允许您创建 WPF 控件,会自动添加到 工具箱 安装扩展的安装. 本主题演示如何使用模 ...

  8. 两款不同应用场景的Wpf分页控件

    简介 今天给大家分享两个Wpf分页控件,本篇博客主要介绍一些实现思路和使用方法,具体实现和应用代码请参考文末的Demo链接 废话不多说,先看一下效果~ (两款控件显示效果是一样的) 实现思路 一款控件 ...

  9. 在 UWP 中实现 Expander 控件

    WPF 中的 Expander 控件在 Windows 10 SDK 中并不提供,本文主要说明,如何在 UWP 中创建这样一个控件.其效果如下图: 首先,分析该控件需要的一些特性,它应该至少包括如下三 ...

随机推荐

  1. 【TP3.2.3】微信网页授权--基类

    非常好用的微信授权 基类:其他的微信权限类都可以继承至该类: <?php namespace Wechat\Controller; use Think\Controller; //微信接口基础类 ...

  2. 【Linux】centos和ubuntu下php5安装redis2.24扩展

    1.服务器先安装redis-server,这是毋庸置疑的!!! 2.服务器开启redis-server,配置相关参数 3.配置好redis服务器后,再安装php的redis扩展phpredis. 一. ...

  3. HTTP 错误状态码讯息

    HTTP 错误讯息解读   4xx: Client Error 使用者端(浏览器)错误讯息 错误码   错误讯息说明 400 Bad Request    错误的要求 401 Unauthorized ...

  4. 一个优秀的Javascript框架--Prototype解说

    http://www.cnblogs.com/meil/archive/2007/04/24/724200.html   Prototype.js 是Ruby On Rails的副产品, Javasc ...

  5. WCF学习之三, 寄宿方式 代码,配置文件

    可以通过代码或者配置文件寄宿WCF服务,在使用过程中的一些心得,记录一下,方便后续查阅. 预备知识,几个地址的作用 1. behavior.HttpGetUrl  定义元数据的地址,如果不定义基地址, ...

  6. ASP.NET Web Forms 的 DI 應用範例

    跟 ASP.NET MVC 与 Web API 比起来,在 Web Forms 应用程式中使用 Dependency Injection 要来的麻烦些.这里用一个范例来说明如何注入相依物件至 Web ...

  7. 设置 TIM3_CH2 的 PWM 模式,使能 TIM3 的 CH2 输出

    /**   ******************************************************************************   * @file    st ...

  8. 构建SqlSessionFactory 的过程

    1 SqlSessionFactory 的核心功能是创建 SqlSession 接口,而 SqlSessionFactory 是通过 SqlSessionFactoryBuilder 去构建. 构建步 ...

  9. MySQL replace into 用法

    讨人喜欢的 MySQL replace into 用法(insert into 的增强版) 在向表中插入数据的时候,经常遇到这样的情况:1. 首先判断数据是否存在: 2. 如果不存在,则插入:3.如果 ...

  10. Typeface-为自定义字体提供字体内存缓存

    Android 上自定义字体的代码一般如下: TextView textview = (TextView) findViewById(R.id.your_referenced_textview); / ...