Expander Class

Definition

Namespace:

Microsoft.UI.Xaml.Controls

Represents a control that displays a header and has a collapsible body that displays content.

This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).

/// [Microsoft.UI.Xaml.CustomAttributes.MUXContractProperty(version=0)]
/// [Windows.Foundation.Metadata.Experimental]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.Foundation.Metadata.Version(1)]
class Expander : ContentControl

/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.XamlContract, 65536)]
class Expander : ContentControl

[Microsoft.UI.Xaml.CustomAttributes.MUXContractProperty(version=0)]
[Windows.Foundation.Metadata.Experimental]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.Foundation.Metadata.Version(1)]
public class Expander : ContentControl

[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.XamlContract), 65536)]
public class Expander : ContentControl

Public Class Expander
Inherits ContentControl

Inheritance

ContentControl

Expander

Attributes

Microsoft.UI.Xaml.CustomAttributes.MUXContractPropertyAttribute ExperimentalAttribute MarshalingBehaviorAttribute ThreadingAttribute VersionAttribute ContractVersionAttribute

Examples

Tip

For more info, design guidance, and code examples, see Expander.

Open the WinUI 2 Gallery app and see the Expander in action.

The WinUI 2 Gallery app includes interactive examples of most WinUI 2 controls, features, and functionality. Get the app from the Microsoft Store or get the source code on GitHub.

Remarks

Tip

For more info, design guidance, and code examples, see Expander overview.

Use an Expander to focus on the most important content when display space is limited. The Expander control lets you show or hide less important content that's related to a piece of primary content that's always visible. Items contained in the Header are always visible. The user can expand and collapse the Content area, where secondary content is displayed, by interacting with the header. When the content area is expanded, it pushes other UI elements out of the way; it does not overlay other UI. The Expander can expand upwards or downwards.

Both the Header and Content areas can contain any content, from simple text to complex UI layouts.

Control style and template

You can modify the default Style and ControlTemplate to give the control a unique appearance. For information about modifying a control's style and template, see Styling controls. The default style, template, and resources that define the look of the control are included in the generic.xaml file. For design purposes, generic.xaml is available in the (Program Files)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\ <SDK version>\Generic folder from a Windows Software Development Kit (SDK) installation. Styles and resources from different versions of the SDK might have different values.

Starting in Windows 10, version 1607 (SDK 14393), generic.xaml includes resources that you can use to modify the colors of a control in different visual states without modifying the control template. In apps that target this software development kit (SDK) or later, modifying these resources is preferred to setting properties such as Background and Foreground. For more info, see the Light-weight styling section of the Styling controls article.

This table shows the resources used by the Expander control.

Resource key	Description
ExpanderHeaderBackground	Header background color
ExpanderHeaderForeground	Header foreground color at rest
ExpanderHeaderForegroundPointerOver	Header foreground color on pointer over
ExpanderHeaderForegroundPressed	Header foreground color when pressed
ExpanderHeaderBorderBrush	Header border color at rest
ExpanderHeaderBorderPointerOverBrush	Header border color on pointer over
ExpanderHeaderBorderPressedBrush	Header border color when pressed
ExpanderHeaderDisabledForeground	Header foreground color when disabled
ExpanderHeaderDisabledBorderBrush	Header border color when disabled
ExpanderHeaderBorderThickness	Header border thickness
ExpanderChevronBackground	Chevron background color at rest
ExpanderChevronPointerOverBackground	Chevron background color on pointer over
ExpanderChevronPressedBackground	Chevron background color when pressed
ExpanderChevronForeground	Chevron foreground color at rest
ExpanderChevronPointerOverForeground	Chevron foreground color on pointer over
ExpanderChevronPressedForeground	Chevron foreground color when pressed
ExpanderChevronBorderBrush	Chevron border color at rest
ExpanderChevronBorderPointerOverBrush	Chevron border color on pointer over
ExpanderChevronBorderPressedBrush	Chevron border color when pressed
ExpanderChevronBorderThickness	Chevron border thickness
ExpanderContentBackground	Content background color
ExpanderContentBorderBrush	Content border color
ExpanderMinHeight	Minimum height of Expander
ExpanderHeaderHorizontalContentAlignment	Horizontal alignment of content
ExpanderHeaderVerticalContentAlignment	Vertical alignment of content
ExpanderHeaderPadding	Header padding thickness
ExpanderChevronMargin	Chevron margin thickness
ExpanderChevronUpGlyph	Chevron glyph when ExpandDirection is Up
ExpanderChevronDownGlyph	Chevron glyph when ExpandDirection is Down
ExpanderChevronButtonSize	Chevron button size
ExpanderChevronGlyphSize	Chevron glyph size
ExpanderContentPadding	Content padding thickness
ExpanderContentDownBorderThickness	Content border thickness when ExpandDirection is Down
ExpanderContentUpBorderThickness	Content border thickness when ExpandDirection is Up
ExpanderHeaderDownStyle	Header style when ExpandDirection is Down
ExpanderHeaderUpStyle	Header style when ExpandDirection is Up

Constructors

Expander()

Initializes a new instance of the Expander class. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).

Properties

ExpandDirection	Gets or sets a value that indicates the direction in which the content area expands. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
ExpandDirectionProperty	Identifies the ExpandDirection dependency property. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
Header	Gets or sets the XAML content that is displayed in the header of the Expander. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
HeaderProperty	Identifies the Header dependency property. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
HeaderTemplate	Gets or sets the data template for the Expander.Header. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
HeaderTemplateProperty	Identifies the HeaderTemplate dependency property. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
HeaderTemplateSelector	Gets or sets a reference to a custom DataTemplateSelector logic class that returns a template to apply to the Header. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
HeaderTemplateSelectorProperty	Identifies the HeaderTemplateSelector dependency property. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
IsExpanded	Gets or sets a value that indicates whether the content area of the Expander is shown. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
IsExpandedProperty	Identifies the IsExpanded dependency property. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
TemplateSettings	Gets an object that provides calculated values that can be referenced as TemplatedParent sources when defining templates for an Expander. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).

Events

Collapsed	Occurs when the content area of the Expander is hidden. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).
Expanding	Occurs when the content area of the Expander starts to be shown. This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).

See also

• Expander overview