WPF基础五：UI③带标题内容控件Expander

最新推荐文章于 2024-04-08 19:55:01 发布

hd51cc

最新推荐文章于 2024-04-08 19:55:01 发布

阅读量719

点赞数

分类专栏： # UI③HeaderedContentControl族控件

本文链接：https://blog.csdn.net/hd51cc/article/details/116069542

版权

UI③HeaderedContentControl族控件专栏收录该内容

3 篇文章 0 订阅

订阅专栏

HeaderedContentControl

为包含单项内容并具有标头的所有控件提供基实现。

HeaderedContentControl 从 ContentControl 继承 Content 属性，并定义 Header 的属性类型为 Object 。提供 Header 控件的标题。像ContentControl的Content属性一样，Header可以是任何类型。

下图显示了两个TabItem对象，它们继承自HeaderedContentControl。第一个TabItem在标题和内容中都具有UIElement对象作为内容：标题设置为包含Ellipse和TextBlock的StackPanel；在内容设置为StackPanel中包含的TextBlock和标签。第二个TabItem的Header设置为字符串，并且Content设置为单个TextBlock。

TabControl

Header属性中具有不同类型的TabControl

一个HeaderedContentControl具有有限的默认样式。应用程序开发人员可以创建HeaderedContentControl，但是其外观将非常简单。如果希望增强控件的外观，则可以创建一个新的ControlTemplate。一个HeaderedContentControl是用于创建自定义的控件，因为它提供了与头单内容控制模型非常有用。

此控件的依赖项属性可以由控件的默认样式设置。如果使用默认样式设置属性，则当控件出现在应用程序中时，该属性可能会从其默认值更改。默认样式由运行应用程序时使用的桌面主题确定。有关更多信息，请参见默认WPF主题。

名称	备注	权限
HasHeaderProperty	标识 HasHeader 依赖项属性。	public static readonly
HeaderProperty	标识 Header 依赖项属性。	public static readonly
HeaderStringFormatProperty	标识 HeaderStringFormat 依赖项属性。	public static readonly
HeaderTemplateProperty	标识 HeaderTemplate 依赖项属性。	public static readonly
HeaderTemplateSelectorProperty	标识 HeaderTemplateSelector 依赖项属性。	public static readonly

名称	备注	权限
HasHeader	获取一个指示标头是否为 `null` 的值。	get;
Header	获取或设置每个控件的标题所用的数据。	get; set;
HeaderStringFormat	获取或设置一个撰写字符串，该字符串指定如果 Header 属性显示为字符串，应如何设置该属性的格式。	get; set;
HeaderTemplate	获取或设置用于显示控件标头的内容的模板。	get; set;
HeaderTemplateSelector	获取或设置一个数据模板选择器，以提供自定义逻辑来选择用于显示标头的模板。	get; set;
LogicalChildren	获取 ControlTemplate 的逻辑子元素的枚举器。	get;

名称	备注	权限
OnHeaderChanged	在 Header 的 HeaderedContentControl 属性更改时调用。	protected
OnHeaderStringFormatChanged	当 HeaderStringFormat 属性更改时调用。	protected
OnHeaderTemplateChanged	当 HeaderTemplate 属性更改时调用。	protected
OnHeaderTemplateSelectorChanged	当 HeaderTemplateSelector 属性更改时调用。	protected
ToString	提供 HeaderedContentControl 的字符串表示形式。	public

Expander

表示一个弹出菜单，该弹出菜单使控件能够公开特定于该控件的上下文的功能。

Expander 为 HeaderedContentControl ，这意味着其 Content 和 Header 属性可以是任何类型 (例如字符串、图像或面板) 。有关更多信息，请参见 HeaderedContentControl 类。

下图显示了一个 Expander 控件。

Expander 示例

如果展开的窗口的内容对窗口而言太大，则可以将 Expander 控件中的内容包装在ScrollViewer 以提供可滚动的内容。 Expander控件不自动提供滚动功能。

为了使Expander正常工作，当ExpandDirection属性设置为Down或Up时，请不要在Expander控件上指定Height。同样，当ExpandDirection属性设置为Left或Right时，也不要在Expander控件上指定Width。当您在 Expander 控件上设置扩展内容的方向时，则由size参数定义的区域将显示为带有边框。即使窗口处于折叠状态，也会显示此区域。若要设置扩展窗口的大小，请在Expander控件或包围该内容的ScrollViewer的内容上设置大小尺寸

如果 Expander 控件是 DockPanel 中的最后一个元素，Expander 则将调整大小以填充 DockPanel 的剩余区域。若要防止出现这种情况，请将 DockPanel 的 LastChildFill 的属性设置为 false ，或确保 Expander 不是DockPanel 中的最后一个元素。

可以通过在Expander控件设置 HorizontalContentAlignment 和VerticalContentAlignment 属性来定义内容的对齐方式。这些属性将应用于标头和展开窗口的内容。

自定义扩展器控件

若要对多个 Expander 控件应用相同的属性设置，请使用 Style 属性。您可以修改 ControlTemplate默认值，为控件指定独特的外观。有关创建ControlTemplate的详细信息，请参阅通过创建 System.windows.controls.controltemplate> 自定义现有控件的外观。若要查看特定于Expander的部分和状态，请参阅扩展器样式和模板。

此控件的依赖属性可能由控件的默认样式设置。如果按默认样式设置属性，则当控件出现在应用程序中时，属性可能会更改为默认值。默认样式取决于应用程序运行时使用的桌面主题。有关详细信息，请参阅默认的 WPF 主题。

只有视觉对象属性已存在于控件的默认模板中并且已使用 TemplateBinding 设置时，设置该属性才有效。在通过创建 ControlTemplate 自定义现有控件的外观一文的更改控件的视觉结构部分可以找到视觉属性列表。

名称	备注	权限
CollapsedEvent	标识 Collapsed 路由事件。	public static readonly
ExpandDirectionProperty	标识 ExpandDirection 依赖项属性。	public static readonly
ExpandedEvent	标识 Expanded 路由事件。	public static readonly
IsExpandedProperty	标识 IsExpanded 依赖项属性。	public static readonly

名称	备注	权限
ExpandDirection	获取或设置 Expander 内容窗口的打开方向。	get; set;
IsExpanded	获取或设置 Expander 内容窗口是否可见。	get; set;

名称	备注	权限
OnApplyTemplate	每当应用程序代码或内部进程调用 ApplyTemplate() 时，进行调用。	protected
OnCollapsed	当 Collapsed 属性从 `true` 更改为 `false` 时引发 IsExpanded 事件。	protected
OnCreateAutomationPeer	创建 AutomationPeer 控件的 Expander 实现。	protected
OnExpanded	当 Expanded 属性从 `false` 更改为 `true` 时引发 IsExpanded 事件。	protected

名称	备注
Collapsed	在 Expander 控件的内容窗口关闭且只有 Header 可见时发生。
Expanded	在 Expander 控件的内容窗口打开时发生，以便同时显示其标题和内容。

XAML代码

主要属性Header、Content、ExpandDirection、IsExpanded。

Header是控件标题。

Content是控件内容。

ExpandDirection控件展开方向。（注意，展开方向不要限制尺寸）。

IsExpanded是加载窗口后控件默认时候打开。（收缩和展开2种状态。）

主要的2个事件Collapsed、Expanded。在控件展开或收拢时发生。

范例：

Collapsed、Expanded更改控件标题Header。

展开方向ExpandDirection向下。

<Window x:Class="ExpanderDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:ExpanderDemo"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Expander Width="200" Header="Expander"  ExpandDirection="Down" IsExpanded="True" Collapsed="OnCollapsed" Expanded="OnExpanded">
            <StackPanel>
                <Button Content="LightSeaGreen" Click="OnClick1"/>
                <Button Content="LightSkyBlue" Click="OnClick2"/>
                <Button Content="White" Click="OnClick3"/>
            </StackPanel>
        </Expander>
    </Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace ExpanderDemo
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void OnCollapsed(object sender, RoutedEventArgs e)
        {
            (sender as Expander).Header = "Expander is Collapsed";
        }

        private void OnExpanded(object sender, RoutedEventArgs e)
        {
            (sender as Expander).Header = "Expander is Expanded";
        }

        private void OnClick1(object sender, RoutedEventArgs e)
        {
            (((sender as Button).Parent as StackPanel).Parent as Expander). Background = Brushes.LightSeaGreen;
        }

        private void OnClick2(object sender, RoutedEventArgs e)
        {
            (((sender as Button).Parent as StackPanel).Parent as Expander).Background = Brushes.LightSkyBlue;
        }

        private void OnClick3(object sender, RoutedEventArgs e)
        {
            (((sender as Button).Parent as StackPanel).Parent as Expander).Background = Brushes.White;
        }
    }
}

C#代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace ExpanderDemo
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            Expander expander = new Expander();
            expander.Width = 200;
            expander.Header = "Expander";
            expander.ExpandDirection = ExpandDirection.Down;
            expander.IsExpanded = true;
            expander.Collapsed += OnCollapsed;
            expander.Expanded += OnExpanded;

            StackPanel stackPanel = new StackPanel();
            Button button1 = new Button();
            Button button2 = new Button();
            Button button3 = new Button();

            button1.Content = "LightSeaGreen";
            button1.Click += OnClick1;

            button2.Content = "LightSkyBlue";
            button2.Click += OnClick2;

            button3.Content = "White";
            button3.Click += OnClick3;

            stackPanel.Children.Add(button1);
            stackPanel.Children.Add(button2);
            stackPanel.Children.Add(button3);
            expander.Content = stackPanel;

            (this.Content as Grid).Children.Add(expander);

        }

        private void OnCollapsed(object sender, RoutedEventArgs e)
        {
            (sender as Expander).Header = "Expander is Collapsed";
        }

        private void OnExpanded(object sender, RoutedEventArgs e)
        {
            (sender as Expander).Header = "Expander is Expanded";
        }

        private void OnClick1(object sender, RoutedEventArgs e)
        {
            (((sender as Button).Parent as StackPanel).Parent as Expander). Background = Brushes.LightSeaGreen;
        }

        private void OnClick2(object sender, RoutedEventArgs e)
        {
            (((sender as Button).Parent as StackPanel).Parent as Expander).Background = Brushes.LightSkyBlue;
        }

        private void OnClick3(object sender, RoutedEventArgs e)
        {
            (((sender as Button).Parent as StackPanel).Parent as Expander).Background = Brushes.White;
        }
    }
}

hd51cc

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
WPF基础五：UI③带标题内容控件Expander

HeaderedContentControl为包含单项内容并具有标头的所有控件提供基实现。HeaderedContentControl从ContentControl继承Content属性，并定义Header的属性类型为Object。提供Header控件的标题。像ContentControl的Content属性一样，Header可以是任何类型。下图显示了两个TabItem对象，它们继承自HeaderedContentControl。第一个TabItem在标题和内容中都具有...
复制链接

扫一扫

专栏目录